OmniAICreator/Qiita-1.07M huggingface dataset:
質問する際にMarkdownは必ず使って欲しい

# 質問投稿するときMarkdownは使って欲しい！

某QAサイトで質問を覗いてみるとMarkdownを使用していない投稿がよく見受けられます。その様な質問は大抵回答が得られなかったり回答者にも反応してもらえる確率は比較的低いかと思います。そこでMarkdownを使う必要性と簡単な利用方法を紹介していきます。

今回紹介しているMarkdown記法は質問する際に最低限必要な一部の記法に過ぎません。もっと知りたい方は[Markdown記法 チートシート](https://qiita.com/Qiita/items/c686397e4a0f4f11683d)などを参照してください。

### 何故Markdownが必要なの？
では何故Markdownで書く必要があるのでしょうか？
結論からいうとMarkdown記法を使用することで可読性が上がったり、回答者がそのコードを用いて簡単に環境を再現できるからです。よって結果的に回答や反応がされやすくなるという訳です。

##### MarkDownを使用しない質問

<?php
$hoge = TRUE;
if ($hoge === true） {
    echo "BINGO!!";
}
?>

##### MarkDownを使用した質問
```PHP
<?php
$hoge = TRUE;
if ($hoge === true） {
    echo "BINGO!!";
}
?>
```

実際にMarkdownを使用していない質問と使用した質問を見比べてみましたが実はこれ全く同じコードなのです。Markdownを使用していない質問ではインデントが解釈されていなかったり逆に使用した質問ではシンタックスハイライトにより原因が全角の`）`であるであるということが直感的に分かります。

### Markdownって何？
[日本語Markdownユーザー会のサイト](https://www.markdown.jp/)では以下の様に説明されていました。
> Markdown（マークダウン）は、文章の書き方です。デジタル文書を活用する方法として考案されました。特徴は、
>
- 手軽に文章構造を明示できること
- 簡単で、覚えやすいこと
- 読み書きに特別なアプリを必要としないこと
- それでいて、対応アプリを使えば快適に読み書きできること
などです。Markdownはジョン・グルーバー（John Gruber）によって2004年に開発され、最初は Daring Fireball: Markdown で公開されました。その後、多くの開発者の手を経ながら発展してきました。
>
[Markdownとは - 日本語Markdownユーザ会](https://www.markdown.jp/what-is-markdown/)

簡単に言えば文章を簡単にマークアップし、文章の構造を直感的に理解できる様な記法のことです。

### 質問する際に最低限使う記法

#### コードを提示する際
コードを提示する際は`バッククオート` 3つでコードを囲むことでシンタックスハイライトされます。
また構文にもある様に上のバッククオートにはその言語名を記載します。
##### 構文:
> \`\`\`(言語名)
  コード
  \`\`\`

##### ex:
> \`\`\`PHP
  echo 'Hello Markdown!';
  \`\`\`

##### preview:
```PHP
  echo 'Hello Markdown!';
```

#### リンクを貼る際

サイトやドキュメントのリンクを貼る際は以下の構文の様にリンク先の説明を`[]`で囲みそのURLは`()`で囲む必要があります。

##### 構文:
> \[リンク先の説明\](URL)

##### ex:
> \[Google\](https://www.google.com/)

##### preview:
[Google](https://www.google.com/)

#### 見出しを書く際

`#`を1から6個記述することで見出しを表現できます。

##### 構文:
> \# 見出し

##### ex:
> \# 見出し1
  \## 見出し2
  \### 見出し3
  \#### 見出し4
  \##### 見出し5
  \###### 見出し6

##### preview:
# 見出し1
## 見出し2
### 見出し3
#### 見出し4
##### 見出し5
###### 見出し6

#### 画像を埋め込む際

サイトやドキュメントのリンクを貼る際は以下の構文の様にリンク先の説明を`[]`で囲みそのURLは`()`で囲む必要があります。

##### 構文:
> \![画像の説明]\(画像のURL)

##### ex:
> \![350 * 150の画像]\(https://via.placeholder.com/350x150)

##### preview:
![350 * 150の画像](https://via.placeholder.com/350x150)
[deno] denonで快適な開発環境を

最近、簡単なプログラムや、趣味の開発でのdenoの使用頻度が上がっています。
ちゃちゃっと何か試したい時にゼロコンフィグでtypescript環境が用意されているUXが気に入ってます。
ただ下記の課題があったので備忘として残します。

## 課題
- denoでもnode js環境のようにnpm scriptsを使いたい
- ついでにnodemonのようにオートリロード環境も欲しい

## package.jsonがない...！
denoではnode_modulesがありません。
node js作者のRyan Dahlが「モジュール用の集中管理されたリポジトリがあるのは残念なことだ」との後悔からだそうです。
つまりモジュールを管理するpackage.jsonがない。

こうなると今までお手軽に使っていたnpm scriptsが使えません。
かつdenoでは環境変数を使うにはサーバー起動時に `--allow-env`を、ネットワークへアクセスするには `--allow-net`のように起動時のオプションが多いです。

毎度これらを打つのは骨が折れます。
シェルのrcファイルにエイリアスを仕込む事もできますが、チーム開発時に各々の環境のシェルscriptを書くというのはあまりイケてません。(趣味でやってるので、これを考慮する理由はありませんが...)

そこで見つけたのが [denon](https://deno.land/x/denon@2.4.0)です。

### インストール
```
deno install --allow-read --allow-run --allow-write --allow-net -f -q --unstable https://deno.land/x/denon@2.4.0/denon.ts
```

### イニシャライズ
初期化のコマンドによって生成ファイルが変わります。

```
# json denon.json
denon init

# typescript denon.config.ts
denon init --typescript

# yaml denon.yml
denon init --yaml
```

### 設定(config.ts)
```ts
import { DenonConfig } from "https://deno.land/x/denon@2.3.2/mod.ts";

const config: DenonConfig = {
  scripts: {
    start: {
      cmd: "deno run src/server.ts",
      desc: "run my server.ts file",
      allow: ["env", "net", "read", "write", "plugin"],
      unstable: true,
    },
  },
};

export default config;
```

### エグゼキュート
```
> denon start
[*] [main] v2.3.2-master
[*] [daem] watching path(s): *.*
[*] [daem] watching extensions: ts,tsx,js,jsx,json
[!] [#0] starting main `deno run --allow-env --allow-net --allow-read --allow-write --allow-plugin --unstable src/server.ts`
Check file:///Users/your_env/your_project/src/server.ts
```

これで無事deno scriptを使えるようになりました！
Goで予約された名前のCの構造体フィールドにアクセスする。

問題
=====
typeという名前のフィールドを参照したいがGoに予約されているため下記のようなエラーがでる。

```golang
package main

/*
typedef struct {
	int type;
} Struct;
*/
import "C"

import "fmt"

func main() {
  test := C.Struct{1}
  fmt.Println(test.type)
}
```

```:エラー
./Main.go:14:20: expected selector or type assertion, found 'type'
```

解決策
=====
参照時にフィールド名にアンダーバーを付けることで参照できるようになる。

```golang
package main

/*
typedef struct {
	int type;
} Struct;
*/
import "C"

import "fmt"

func main() {
  test := C.Struct{1}
  fmt.Println(test._type) // typeではなく_typeで参照。
}
```

```:出力
1
```
参考
=====
- [cgo: howto refer to a C struct field named 'type'](https://groups.google.com/g/golang-nuts/c/mDJeP1E5q2w)
[Qiita]記事を投稿する際にタグを補完機能を使って設定して投稿すると、補完するときの文字列で確定され、実際には補完されない

さいきんおかしいなあと思っていましたが、どういうことかというと
FilesystemObjectというタグを設定したい。しかし長い。
Fileで打ち込むと、補完されてFilesyStemObjectがタグの欄に記載される。
投稿する。
タグはFileのままで実際は補完されない。
というものです。
2020年9月に発生しているようです。タグは最後まで正確に手入力して、投稿後は確認する必要があります。
しかし大したことではありません。そもそもITってバグや不完全なことばかり。こんなので紙と印鑑が邪魔だとか
ドコモ口座とかみて言ってないでしょう。こんな時期に記事を発表するときは見出しをかんがえた方がいいですねえ。
OSとかブラウザとかのバージョンは教えません。そんなので「バグ」が起きるほうがおかしい。知りたければ自分で
いろいろなPCやブラウザで確認するといいのではないでしょうか。
[Vue.js] 名前付きスロットとスコープ付きスロットを同時に使うには

#はじめに
Vue.jsでは、バージョン2.6.0でv-slotディレクティブが導入されました。これは名前付きスロットとスコープ付きスロットを統一的に扱うことのできるディレクティブなのですが、ドキュメントを読んだときに少しこんがらかったので頭の中を整理することを兼ねて投稿します。

#v-slotディレクティブ
v-slotディレクティブの書き方は以下のとおりです。

```
v-slot:{スロット名} = "{子コンポーネントからのデータを受け取る変数}"
```

これを親コンポーネントのテンプレート内のカスタムタグに記述します。名前付きコンポーネントのみを使うときはイコール以降は不要です。

# 具体例
以下に具体例を示します。
main.htmlでは、名前、スコープ付きのスロット（ヘッダー）、名前付きスロット（フッター）を指定しています。
ヘッダーに関しては、子コンポーネントからmessageを受け取っていることが分かります。

名前、スコープ付きのスロットでは、v-slotを以下のように書いています。ここでは、headerがスロット名、slotPropsが子コンポーネントからのデータを受け取る変数です。

```
v-slot:header="slotProps"
```

slotPropsには以下のようなオブジェクトが格納されます。オブジェクトのプロパティ名（ここでは"message"）は、v-bind:messageのmessageです。すなわち、v-bind:{オブジェクトのプロパティ名}となります。

```javascript

{ "message": "hello from child!" }
```

```main.html

<!DOCTYPE html>
<html lang='ja'>
  <head>
    <meta charset='UTF-8'>
  </head>
  <body>
    <div id="app">
      <child-component>
        <template v-slot:header="slotProps">
          <p>{{ slotProps.message }}</p>
        </template>
        <template v-slot:footer>
          <p>FOOTER</p>
        </template>
      </child-component>
    </div>
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    <script src="main.js"></script>
  </body>
</html>
```

```main.js
const ChildComponent = {
  template: `
    <div>
      <header>
        <slot name="header" :message="message">DEFAULT HEADER CONTENTS</slot>
      </header>
      <footer>
        <slot name="footer">DEFAULT FOOTER CONTENTS</slot>
      </footer>
      
    </div>
  `,
  data(){
    return {
      message: "hello from child!"
    }
  }
}

const app = new Vue({
  el: "#app",
  components: {
    ChildComponent
  }
})
```
実行結果


```
hello from child!

FOOTER
DjangoのテンプレートのIF文で複雑な四則演算を使いたい！→カスタムテンプレートを使うべし

# 目的
Djangoにはテンプレートファイルを使う時に動的な処理をされたいときは**組み込みタグとフィルタ**を使う。例えばIFとかFor文とか、あとはextendsとかblockとかも該当します。詳しは以下を参照ください。


参考：[組み込みタグとフィルタ](https://docs.djangoproject.com/ja/3.1/ref/templates/builtins/#built-in-tag-reference)

今回やりたいことは、テンプレート内の**ifタグの中で剰余算**です。
以下サンプルコード。

```HTML
        {% for user in users%}
            {% if 余りが1の時 %}
                <div class="columns is-mobile">
            {% endif %}
            <div class="column">
                <div>
                    ~省略~
                </div>
            </div>
            {% if 余りが0の時 %}
                </div>
            {% endif %}
        {% endfor %}
```

既に提供されているタグで**divisibleby**のように割り切れたらTrueを返すというものはあるが、余りが1の時はこの処理、余りが2の時はこの処理...みたいなことは出来ません。

そんな時は**カスタマテンプレート**を用意すれば解決できる

# カスタムテンプレートのやり方

まずはプロジェクト配下に以下のディレクトリとファイルを作ります。

```
project/
 ├ templatetags/
  　        └ tags.py
```

そして```settings.py```ファイルの```INSTALLED_APPS ```以下を追加

```python:settings.py
INSTALLED_APPS = [
    'project',
]
```

``tags.py``を以下のように編集


```python:settings.py
from django import template

register = template.Library()

@register.filter
def modulo(num, val):
    return num % val
```

最後にカスタムテンプレートを使いたいtemplateでタグをロードしてあげればOK。
``{% load templates %}``が重要です。

```HTML
{% load tags %}

~省略~

        {% for user in users%}
            {% if forloop.counter|modulo:3 == 1 %}
                <div class="columns is-mobile">
            {% endif %}
            <div class="column">
                <div>
                    ~省略~
                </div>
            </div>
            {% if forloop.counter|divisibleby:"3" %}
                </div>
            {% endif %}
        {% endfor %}
```

それではみなさま、よいDjangoライフを！
Laravel8でTarget class does not exist が出る時

```php:web.php
    Route::group(['prefix' => 'test'], function() {
        Route::get('/','TestController@index');
    });
```
こんな感じで`test`にアクセスし、indexアクションの処理をさせようとしたら、
`Target class [TestController] does not exist`というエラーが発生したのでスペルミスなどを疑ってみましたが Laravel8では少し違う様です。

[この人の記事を参考にしました。](https://medium.com/@litvinjuan/how-to-fix-target-class-does-not-exist-in-laravel-8-f9e28b79f8b4)

英語は苦手なので解釈を間違えていたらすみません。

__エラーの原因__

```php:RouteServiceProvider.php

            Route::middleware('web')
                ->group(base_path('routes/web.php'));
```
Laravel8ではこんな感じで`App\Providers\RouteServiceProvider.php`の中にある`$namespace`変数が削除されて宣言方法が変わった様なことを言ってる気がする。

__解決方法は__

```php:RouteServiceProvider.php
protected $namespace = 'App\Http\Controllers';
//boot()の上で定義されている変数にこれを追加する
   public function boot()
   {
       
       $this->configureRateLimiting();
        
       $this->routes(function () {
           Route::middleware('web')
               ->namespace($this->namespace)//この行を追加
               ->group(base_path('routes/web.php'));
       });
   }
```

上記を追加して`test`にアクセスするとしっかりとアクションの処理を呼び出せていました。

__他の方法として__

```php:web.php
Route::get('path','App\Http\Controllers\YourController@index');
```
こんな感じで強引に書くのもありみたい。
他にも

```php:web.php
use App\Http\Controllers\YourController;
Route::get('path', 'YourController@all');

Route::get('path', [YourController::class, 'all']);
```

こんな書き方もあるみたい。
コントローラーが少ない時は最後の3つでいいかもしれないけど規模が大きいと`Provider.php`いじった方がいいのかも。
備忘録 Javascript コンストラクタ

# javascript でのコンストラクタの使い方

```
var Human = function(name, weight, height){
    this.name = name;
    this.weight = weight;
    this.height = height;

    this.getBmi = function(){
        this.bmi = this.weight / (this.height * this.height);
        return this.bmi;
    }
}
var human = new Human("tanaka", 65, 1.7);
console.log(human.name + "さんのBMIは" + Math.round(human.getBmi()) + "です。");

```
Javascriptで該当月の何週目、何曜日の取得

ある月に関して全ての日付の、何週目か、何曜日かという情報をセットしておく必要がありその際に作成したロジック。特定の日付が何週目か、何曜日かという情報だけを撮るには若干オーバースペックだけれど、一応その方向でも使える。

YYYY-MM形式で渡すと、指定された月のすべての日付に関して、何週目か、何曜日（日曜始まりの0スタート）かという情報を返す。

<p class="codepen" data-height="265" data-theme-id="light" data-default-tab="js,result" data-user="nicopin" data-slug-hash="WNwKWWK" style="height: 265px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;" data-pen-title="get_week_of_month_and_weekday">
  <span>See the Pen <a href="https://codepen.io/nicopin/pen/WNwKWWK">
  get_week_of_month_and_weekday</a> by nicopin (<a href="https://codepen.io/nicopin">@nicopin</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://static.codepen.io/assets/embed/ei.js"></script>
ElasticBeanstalkでflaskアプリケーションをデプロイ

[公式ドキュメント](https://docs.aws.amazon.com/ja_jp/elasticbeanstalk/latest/dg/create-deploy-python-flask.html#python-flask-setup-venv)を簡単にまとめる

# 目次
 - 前提条件
 - flaskで仮想環境を設定する
 - flaskアプリケーションの作成
 - EB CLIでデプロイ
 - クリーンアップ

# 前提条件
 - 基本的なEBオペレーションと、EBコンソールについての知識があること
 - 使用するElasticBeanstalk環境が起動していること
    - [環境の起動](https://docs.aws.amazon.com/ja_jp/elasticbeanstalk/latest/dg/GettingStarted.html)
 - EB CLIが使えること
    - [インストール](https://docs.aws.amazon.com/ja_jp/elasticbeanstalk/latest/dg/eb-cli3-install.html)
    - [設定](https://docs.aws.amazon.com/ja_jp/elasticbeanstalk/latest/dg/eb-cli3-configuration.html)

アプリケーションで使用するPythonのバージョンに対応するEBプラットフォームのバージョンを使用する
[Python開発環境のセットアップ](https://docs.aws.amazon.com/ja_jp/elasticbeanstalk/latest/dg/python-development-environment.html)


# flaskで仮想環境を設定する
1. `virtualenv`を用いて仮想環境を作成
2. `flask`をインストール
3. `pip freeze`でインストールされているライブラリを一覧表示
4. `pip freeze`からの出力を`requirements.txt`に保存<br>

```bash
pip freeze > requirements.txt
```

[要件ファイルを使用した依存関係の設定](https://docs.aws.amazon.com/ja_jp/elasticbeanstalk/latest/dg/python-configuration-requirements.html)

# flaskアプリケーションの作成
実行ファイル名を、`application.py`にし、呼び出し可能な`applicationオブジェクト(Flaskオブジェクト)`を提供すると、EBがアプリケーションコードを見つけやすくなる

エラーはEB用に設定する前に修正する

# EB CLIでデプロイ
仮想環境フォルダは`.ebignore`ファイルに記述する

アプリケーション環境を作成し、設定済みのアプリケーションをEBを使用してデプロイする
#### `eb init`コマンドでEB CLIリポジトリを初期化

```bash
eb init python-pythonプラットフォームのバージョン EBアプリケーション名 —region リージョン
```
このコマンドは、新しいアプリケーションを作成、ローカルリポジトリを設定して指定したpythonプラットフォームバージョンで環境を作成

#### `eb init`を再度実行してデフォルトのキーペアを設定し、アプリケーションを実行しているEC2インスタンスにSSH接続できるようにする
これは必須ではない
キーペアの設定についてはプロンプトに従って行う

#### 環境を作成し、`eb create`を使用してそこにアプリケーションをデプロイする

```bash
eb create 環境名
# リソースが作成される
```

#### ウェブサイトを開く
```bash
eb open
# ウェブサイトを開く
```

# クリーンアップ
EBの操作を終了したら、環境を終了できる
環境に関連づけられている全てのリソースを終了する
1. EBコンソールでリージョンを選択
2. ナビゲーションペインで[環境]を選択肢、リストから環境を選択
3. 環境アクションから環境の終了を選択
4. 画面上のダイアログボックスを使用して環境の終了を確認

EB CLIの場合

```bash
eb terminate 環境名
```
[VBA/VBS]Scripting.FilesystemObjectのGetparentfoldernameの空白を回避するUDF関数 fnParentfolder

Filesystemobjectに"C:\"のようなRootフォルダが入ったときParentfoldernameは空白になり、エラーが起きます。
これを回避すべくFolderでもFileでもParentFolderが空白な時はドライブレターを取得してRootFolderを返します
欠点は実在するFolder、Fileにしか確実に効かない点です。これはFileかFolderかの判定にFolderExistsを用いているためです。今回の関数はこの欠点も改善し、実在しているドライブのルートフォルダの実在しないファイルや、実在しないドライブのルートに直下のファイルやフォルダでもなるべく返します。
サーバーの場合はドライブが割り当てられていれば確実に動きますが、`\\Server\root`のような場合の挙動は資料が有りません。

いままでなぜIsRootやGetDriveがあるのか不思議だったのですが、おそらくこういう使い方を想定しているのでしょう。
またFolderExistsはFalseでも実在するファイルやフォルダではありません。ここにもポイントがあります。
実在しなくてもParentfolderNameは確実に動くためです。
[FileSystemObject：フルパスからファイル名、パスを取得する（GetFileName、GetParentFolderName） ](https://excelwork.info/excel/fsogetfoldernamefilename/)

object  ・・・  FileSystemObject オブジェクトを指定します。
<b>path  ・・・  対象となるパスを指定します。</b><<つまり、ファイルではない
戻り値  ・・・  引数 path で指定したパスにある最後のコンポーネント（「フォルダ名」または「ファイル名」）の親フォルダ名を含む文字列。


><b>引数 path で指定されたコンポーネントの親フォルダがない場合は、長さ 0 の文字列 (“”) を返します。</b><今回の関数が必要になった原因
>GetParentFolderName メソッド は、引数 path で指定したパスが存在するかどうかは確認しません。<<つまり、文字列をそうさする形でひとつ上のフォルダを返していることになる。VBAでもフォルダ名をSplitで分割して配列にいれて取得する方法があるが、それも実在しないファイルやフォルダでもよい。

```vb:VBA,VBS
Function fnParentFolder(strFolder)
Dim fnFso
Set fnFso = CreateObject("Scripting.FileSystemObject")
IF fnFso.folderExists(strFolder) Then
  If fnFso.getParentfoldername(strFolder)="" Then
    IF fnFso.getFolder(strFolder).isrootfolder Then
    fnParentFolder = fnFso.getDrive(fnFso.getfolder(strFolder)) & "\"
    Exit Function
    End If
  Else
  fnParenFolder =  fnFso.getParentfoldername(strFolder)
  Exit Function
  End If
Else
  On Error Resume Next
  If  fnFso.getParentfoldername(strFolder) = "" Then '実在しないフォルダならここで空白になる
    If err.Number <> 0 Then Wscript.Echo Err.Number , Err.Description :Err.clear
    fnParentFolder = strFolder 'そのまま返す
    Exit Function
  Else
    fnParentFolder = fnFso.GetParentfoldername(strFolder)
    Exit Function
  End iF
End if
Set fnFso = Nothing
On Error Goto 0
End Function
```
ScalaのgRPCプロジェクトでもサードパーティのprotobufを使いたい

[googleapis](https://github.com/googleapis/googleapis)とか公開されているprotobufをScalaプロジェクトで使う方法がわからなかったので[gitter](https://gitter.im/ScalaPB/community?at=5f53bbca49148b41c9975efa)で聞いた。

> You may find this page helpful: https://scalapb.github.io/docs/third-party-protos/
You could either change the dependencies of proto-google-common-protos into protobuf-src dependency or use the common protos package provided by ScalaPB.
Also https://scalapb.github.io/docs/common-protos


結論、方法が2つあるみたい。
https://scalapb.github.io/docs/third-party-protos

# その1: ScalaPB Common Protos を使う

よく使いそうなprotobufをまとめてくれてるので運が良ければそれが使えるかもしれない（大抵はこれでなんとかなりそう）。https://github.com/scalapb/common-protos


```scala
libraryDependencies ++= Seq(
  "com.thesamet.scalapb.common-protos" %% "proto-google-common-protos-scalapb_0.10" % "1.17.0-0" % "protobuf",
  "com.thesamet.scalapb.common-protos" %% "proto-google-common-protos-scalapb_0.10" % "1.17.0-0"
)
```

サフィックスの`protobuf`を付けるとjarを展開して自分らのprotobufのimportパスに追加してくれる。サフィックス無しの宣言は自動生成したコードをクラスパスに追加するのに必要。

# その2: Mavenのライブラリを直接使う

例えば、googleapisのprotobufを使いたいときはこう。

```scala
libraryDependencies += "com.google.api.grpc" % "proto-google-common-protos" % version % "protobuf-src" intransitive ()
```

こっちの場合は `protobuf-src` っていうのを宣言すると自分らのprotobufへの依存を解決できる。`intransitive()` がないと自動生成で重複クラスが出てきちゃうから付けとくのがオススメらしい。

# おわり
infer(conditional types)を使って型からArrayを引っ剥がす

例えば

```typescript
type Dogs = Array<{name: string, age: number}>
```

みたいな既存型がある時に

```typescript
{name: string, age: number}
```

この部分を得たいという事が稀によくあります。

```typescript
type Dog = {name: string, age: number}
type Dogs = Array<Dog>
```

最初からDogを定義しておいて、そのDogを元にDogsを作っていれば良かったじゃん？と言われるとそれはそうなんですが、外からやってくる型(例えばGraphQLから生成された`Pick<Dog, 'name' | 'age'>`みたいなアドホックな型定義だとか)の場合はそうも言ってられません。


そういう時にはinfer(conditional types)を使って`Array<T>`の`T`部分をキャプチャして得る事ができます。

```typescript
type Flatten<T> = T extends Array<infer U> ? U : never
type Dog = Flatten<Dogs>
```

この例ではArrayを引っ剥がしましたが、Arrayと同様にPromiseだとかMaybe(`type Maybe<T> = T | null`)だとかを引っ剥がすのにも使えたり、ビルトインのユーティリティ型である[ReturnType](https://log.pocka.io/posts/typescript-builtin-type-functions/#returntype)の[定義](https://www.typescriptlang.org/docs/handbook/release-notes/typescript-2-8.html#type-inference-in-conditional-types)なんかにも使われています。
マルチステージビルドによるDockerイメージの軽量化-Reactアプリ編

# はじめに

はじめまして、最近Docker、Kubernetes辺りをいじるのにハマっております。
今回はDockerイメージの軽量化に挑戦してみました！

今回は [create-react-app](https://github.com/facebook/create-react-app) コマンドを用いてデフォルトで作成したものをコンテナ化しております。

- 事前準備
    - create-react-appでアプリ作成


```
// アプリ作成
$ create-react-app sample-react-app
$ cd sample-react-app
```

# 問題のDockerfile

Dockerfileを準備します。流れとしては
- production用にbuild
- 静的ファイルを実行するモジュールをインストール、実行

という感じです。

```Dockerfile:Dockerfile
FROM node:12
COPY . /react-app
WORKDIR /react-app
RUN npm install && npm run build && npm install -g serve
CMD ["serve","-s","build" ]
```
これでデフォルトだと5000番でListenするので以下のようにポートフォワードして実行すれば localhost:5000 でアプリが動くことが確認できると思います。

```
$ docker run -p 5000:5000 sample-react-app:0.0.1
```


昨日までの私はおー！Reactアプリコンテナ化できたじゃんと満足していました。
けど思いました。
##### 最終的に静的ファイル実行するだけなんだからnodeの環境要らなくない？

ちなみにここでDockerイメージのサイズを見てみると...

```
$ docker images
REPOSITORY                                                   TAG                 IMAGE ID            CREATED             SIZE
sample-react-app                                             0.0.1               6e7bc9096dd7        9 minutes ago       1.31GB
```
...でかいっす。

ただ、gitにproductionのファイル群をあげたりはそんなにしないかなと思うので、CIツールとか使ってgitのリポジトリからビルドしていくならnpm install, npm run buildはDockerでビルドしていく段階で欲しいと思うのです。

そこで**マルチステージ！**これがあるじゃん。

ということでマルチステージを使ってproductionのファイル群をnginxの方に持っていく、というのをやってみました。

# 改良Dockerfile

```Dockerfile:改良Dokerfile
#第一段階(productionファイル生成まで)
FROM node:12 as node
COPY . /react-app
WORKDIR /react-app
RUN npm install && npm run build

#第二段階(一段階目のコンテナの中身から静的ファイル群だけをコピーする)
FROM nginx:1.19.2-alpine
COPY --from=node ./react-app/build /usr/share/nginx/html
CMD nginx -g "daemon off;"
```

ドキドキの起動です。。。タグを0.0.2にしてビルド、実行してみます

```
$ docker build -t sample-react-app:0.0.2 .
$ docker run -p 5000:80 sample-react-app:0.0.2
```

無事起動できました！
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/721387/66afe558-313c-c69f-b5b9-f81fe79a27d5.png)

そしてサイズは...

```
$ docker images
REPOSITORY                                                   TAG                 IMAGE ID            CREATED             SIZE
sample-react-app                                             0.0.2               9148ac06ddbe        3 minutes ago       22.5MB
```

##### かなりスマートになりました！サイズだけなら1/60になりました！

#おわりに
個人的にここまで劇的に変えられたと結構な達成感を持てました！
今後はコンテナ化だけで満足せず、どのように作っていくかもじっくり考えてみたいと思います。
フリーウェアとオープンソースソフトウェアの違い

#フリーウェア
フリーウェア(フリーソフトやフリーソフトウェアとも言う)は、`単に無料で公開されているソフトウェアのことを指す`のが一般的である。

後述するオープンソースソフトウェアのように、ソースコードが公開されていたり改変や再配布が許されているわけではないので注意。


#オープンソースソフトウェア
`プログラムのソースコードが公開されていたり、改変や再配布が許されている。`
Excel(xls,xlsx)の重しを外せ！

 
#ねらい
Excelファイルを高速で起動＆使える状態を維持する。

##原因の切り分け [link3より][link3]
step1. 複数のPCを使用して調査する
　同じファイルで同じ動作をする→ファイルを疑う。重しの分類へ
　同じファイルで異なる動作をする→遅いPCを疑う
step2. １台のPCを使用して調査する
　異なるファイルで速さが同じくらい→PCや使用環境を疑う
  異なるファイルで速さが違う→遅いファイルの中身を疑う。重しの分類へ

##重しの分類
###a:見えないもの
1. 隠れオブジェクト [link1][] [link4][]
→削除する
2. ファイルのリフレッシュ [link1][] [link4][]
→データをコピー、新規ファイルに貼り付け
3. ハードウェアグラフィックアクセラレータを無効にする [link2]
4. Officeのアプリ自体を疑う [link2][]
→Officeの修復を行う、セーフモードで起動
5. ファイルサイズが原因 [link3][]
→ファイルサイズは500kB以下が基準。
6. 参照関数を使用しているセルが多い [link3][]
→計算方法の設定を"自動"を"手動"にする
7. 自動保存が頻繁に行われる [link3][]
→自動保存の間隔を長くする
8. 関数を値で貼り直す [link4][]
9. 不要な名前を削除 
10. 行全体、列全体の参照を減らす （例、 b:j)


###b:見えるもの
1. ブックの共有 [link1][] [link3][] [link4][]
→一時的にブックの共有を外す
2. 古いファイル形式の場合(xls) [link1][] [link4][]
→最新バージョンの拡張子で保存し直す
3. 使っていないアドイン [link2][]
→使っていないアドインを無効化する
4. 行数や列数が多い [link3][] [link4][]
→不要なものは削除する
5. 不要なシート [link1][] [link3][] [link4][]
→削除する
6. 図形やグラフが多い [link3][]
→不要なものは削除
7. 画像が多い [link3][] [link4][]
→不要なものは削除、サイズを圧縮する
8. リンクが多い [link3][]
→リンクをしない、リンクを削除
9. 書式設定が多い [link3][]
→色や条件付き書式を減らす
10. セルの幅が狭い
→全ての文字が表示されるようにする


##参考リンク
[link1 【Excel】もうイライラしない！重いExcelを軽くする2つの方法][link1]
[link2 Excelが重すぎる！3つの対処法を実践して軽くしよう][link2]
[link3 【すぐに解決】Excelの動作が重くなる2つの原因とは？－原因別の対処法を解説！][link3]
[link4 ケース別Excelファイルのダイエット方法8選][link4]
[link5 【解決】エクセルの容量（ファイルサイズ）を減らす・軽くする方法][link5]

[link1]:https://lab.pasona.co.jp/data-operation/skill/707/
[link2]:https://www.chips-shop.com/inkpedia/3504/
[link3]:https://briarpatch.co.jp/wakaruni/excel-heavy/
[link4]:https://excel-master.net/file-operation-and-save/file-diet/
[link5]:https://pasokon-labo.com/excel-size-down/

##更新履歴
2020/09/16 新規作成
2020/09/17 原因の切り分けを更新


--
スクラムとSECIモデルから学ぶ知識創造

# スクラムとSECIモデル

### SECIモデル
ナレッジマネジメントの基礎理論。
「知識」がどのように発生して成長するかを、「暗黙知」と「形式知」の2つの知識形態を螺旋として捉えたもの。
#### 暗黙知と形式知とは
- 暗黙知
    - 言葉や文章で表現するのが難しく、主観的で、身体的な「経験知」。
    - 例えると、自転車の乗り方。どうやってバランスをとるのかは人それぞれの感覚で言語化しづらく、経験として得られるもの。
- 形式知
    - 暗黙知と対極
    - 言語化、形式化されており、言葉や文章で表現できる。
    - 客観的でかつ理性的な「言語知」。
    - 例えると、マニュアルとか理論など。
暗黙知で得た経験を言語化し、文書化した時、形式知になる。
自転車の乗り方で言うと、サドルに跨って勢いよく地面を蹴り、勢いを殺さずにペダルを漕ぎ続ける。<br>
(こんな感じで文章化する？)

SECIモデルはこの2つの「知」を相互に繰り返し、「新しい知」に変換していく運動を知識創造活動としている。
この知識創造活動を4つの運動に分類する。
1. 共同化
2. 表出化
3. 内面化
4. 連結化

#### 共同化（暗黙知→暗黙知）
個人が組織の中で暗黙知を共有する活動。
個人が所有する暗黙知を**他人と共同作業**していく中で伝え、組織の暗黙知とする。
組織で1つの体験を通して、暗黙知を共有・共感していく活動。

- 活動例）<br>
プロの野球選手が、キャッチボールの仕方を小学生にレクチャーする。<br>
レクチャーする際に、プロ選手がキャッチボールをする様子を見せて、小学生が同じように動作を真似する。

#### 表出化（暗黙知→形式知）
共同化の中で得た暗黙知を文書化することで形式知に変換し、**伝達可能な形式**にする活動。
組織の個々人が得た直感、経験を言語化し、文章や図の形に創造する。

- 活動例）<br>
レクチャーを受けた小学生が、自分なりのボールの投げ方をレポートにまとめる。

#### 連結化（形式知→形式知）
形式知どうしを組み合わせたり、編集することで**新しい体系化した知識**を生み出す活動。

- 活動例)<br>
レポートから、ボールのリリースポイント、目線、体の使い方など普遍的なキャッチボールのやり方を本にする。

#### 内面化（形式知→暗黙知）
新たに生み出された形式知を個々人の暗黙知として取り込む活動。
行動で形式知を具現化し、実践することで個人の身体で理解・学習する。
本という形式知を読み、本に書いてある通りに実行し、体験を通して体で理解する活動。

- 活動例)<br>
別の小学生が本を読んで、書いてある通りにキャッチボールをする。

## スクラムとSECIモデルの関連性
アジャイル開発は場とコミュニケーションを重視するので、ペアプロやモブプロなど、共同で作業することが多い。
上級者から初級者への暗黙知の伝達している。しかも、様々な暗黙知を伝達する。（共同化）

### スプリントレビュー
- デモ<br>
開発チームは動く製品が成長していることを確認、POはデモを見て現物から製品の出来栄えに対する感覚を得られる。（表出化）<br>
製品をリリース→ユーザーが使用→フィードバックを得る（内面化）
- ふりかえり<br>
自分たちの仕事のやり方を改善し、新しいやり方をチームが獲得する（表出化→連結化→内面化）

**スクラムはスプリントによって獲得・創造した知識を「動くソフトウェア製品の成長」と「スクラムチームの成長」という2つの形で蓄積していく活動。**
k8sのマニフェストでPodのdocker imageのCMDを書き換えるときはcommandじゃダメ

ちゃんとドキュメントを読めば書いてありました。
ただ、間違えやすそうなのでメモ。

- ちゃんと読むべきもの
    - https://kubernetes.io/docs/tasks/inject-data-application/define-command-argument-container/
    - https://kubernetes.io/docs/tasks/inject-data-application/define-command-argument-container/#notes


# 結論

- マニフェストのcommandはDockerfileのENTRYPOINT
- マニフェストのargsはDockerfileのCMD

```
apiVersion: v1
kind: Pod
metadata:
  name: command-demo
  labels:
    purpose: demonstrate-command
spec:
  containers:
  - name: command-demo-container
    image: debian
    command: ["printenv"]                    # こっちはENTRYPOINT
    args: ["HOSTNAME", "KUBERNETES_PORT"]    # こっちはCMD
  restartPolicy: OnFailure
```

# 注意

また、command・argsをそれぞれ定義したかどうかで挙動が変わるので注意。

Dockerfileが

- ENTRYPOINT: echo
- CMD: HOSTNAME

だった場合


|command|args|実行されるコマンド|
|:--|:--|:--|
|未定義|未定義|echo HOSTNAME|
|printenv|未定義|printenv|
|未定義|KUBERNETES_PORT|echo KUBERNETES_PORT|
|printenv|KUBERNETES_PORT|printenv KUBERNETES_PORT|

となる。
addEventListenerの第2引数によってthisは変わる

TypeScript(またはJavaScript)で `EventTarget.addEventListener()` を使用する場合、第2引数の指定方法によって実行時の `this` の中身が変わります。
今更ながら地味にはまったため、自分用にメモしておきます。

# 確認

確認用にコードを作成しました。
https://playcode.io/671961

`EventTarget.addEventListener()` 第2引数の指定方法によって、関数show 実行時の `this` は以下のようになります。

```typescript:script.ts
class ThisTest {
  constructor() {
    this.bindEvent();
  }

  // この関数を呼び出して、thisの中身を判定する。
  show(e: Event) {
    console.log(this.constructor.name);
  }

  bindEvent() {
    const t1 = document.querySelector('#test1');
    t1.addEventListener('click', this.show);
    // => 'HTMLButtonElement'

    const t2 = document.querySelector('#test2');
    t2.addEventListener('click', this.show.bind(this));
    // => 'ThisTest'

    const t3 = document.querySelector('#test3');
    t3.addEventListener('click', (e: Event) => this.show(e));
    // => 'ThisTest'

    const t4 = document.querySelector('#test4');
    t4.addEventListener('click', function (e: Event) {
      console.log(this.constructor.name);
      // => 'HTMLButtonElement'

      this.show(e);
      // => 'error: Uncaught TypeError: this.show is not a function'
      // this.show(e)の `this` がボタン要素を示すため、エラーが発生する。
    });
  }
}

new ThisTest();
```

```pug:index.pug
button#test1 テスト1
button#test2 テスト2
button#test3 テスト3
button#test4 テスト4
```

# 所感
`EventTarget.addEventListener()` に限った話ではないですが、はまらないように注意したいですね。

# 参考文献
[JavaScript で陥りやすい失敗例を振り返る](https://qiita.com/yuki153/items/c909c54204eaab6ca1b2)
[EventTarget.addEventListener()](https://developer.mozilla.org/ja/docs/Web/API/EventTarget/addEventListener)
intelij(JetBrains製IDE)でファイル保存時にコマンドを実行する

ファイル保存時にリンターやフォーマッターを実行させたい時に便利です。
参考:[blackとpylintを使った快適なPython開発](https://qiita.com/navitime_tech/items/0a431a2d74c156d0bda2)



## File Watchersのインストール
Preferences > Plugins
からFile Watchersをインストールする（インストール後にintelijの再起動が必要）

![スクリーンショット 2020-09-16 23.13.05.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/230281/cc84a55e-e2d7-1baa-bbbf-095d22164e50.png)

## File Watchersの設定
Preferences > Tools > File Watchers
`+` > `<custom>`　からファイル保存時に実行したいコマンドを追加できる
![スクリーンショット 2020-09-16 23.17.33.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/230281/dde0242e-1824-e5c1-02e5-ff96b6ed7a7e.png)

開いたWindowに実行したいコマンドを入力してOKを押せば保存される

|項目名|説明|
|---|---|
|Name|任意の名前|
|FileType|どの拡張子ファイルを保存した時にコマンドを実行するか|
|Scope|基本的にCurrentFIleでOK|
|Program|実行したいコマンドの最初のワード|
|Arguments|実行したいコマンドの二つ目以降のワード|
|Working directory|コマンドを実行する際のカレントディレトリ|
|Advanced Options|自動保存時にもコマンドを実行するかなど　チェックを外しておくのが無難|

以下はPythonファイル保存時にpoetryでpylintを実行する場合の例
![スクリーンショット 2020-09-16 23.26.54.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/230281/600a9859-9fa1-a4b7-6010-3b9379a75c47.png)

`$FilePath$`は保存したファイルのパスのマクロ
`$FileDir$`は保存したファイルののディレクトリパスのマクロ
入力欄の`+`からマクロ一覧が見れる
![スクリーンショット 2020-09-16 23.34.45.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/230281/9fde8c14-05c4-8b19-fe76-41eb1fe10061.png)

## プロジェクト間での設定の共有
複数のリポジトリで使いたい時はLevelをGlobalに設定すると、
他のプロジェクトでもFile Watchers設定画面で表示される
デフォルトでEnabledのチェックは外れてるので使用したい場合はチェックを入れる必要あり
![スクリーンショット 2020-09-16 23.35.42.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/230281/56e93ea1-ac5f-b255-833b-ceeb4719f998.png)
Java カプセル化について　private public

###カプセル化とは
参考： 「徹底攻略 Java SE 11 Silver 問題集」から引用：

カプセル化は、ソフトウェアを分割する際に、関係するデータとそのデータを必要する処理を1つにまとめ、無関係なものや関係性の低いものをクラスから排除することで「何のためのクラスなのか？」というクラスの目的を明確化するために行い、ほかのクラスに重複するデータや処理がない状態を目指すもの。


修飾子
private　設定するとクラス外からアクセスする事ができなくなる(クラス内では可能)　非公開状態
public クラスの外からでもアクセスする事が可能 　


ユーザが入力した値が0から10の場合private変数numに代入し表示する

```java
class Number {
  private int num;//外からはアクセスできなくする

  public void setNum(int n){
    if(n >= 0&&n <= 10){
       num = n;
    }else{
      system.out.println("入力された値は無効です。");
    }
  }
  public int getNum(){//
    return num; //戻り値を返す
  }
}
import java.io.*;
class Sample {
  public static void main(String[] args) throws IOException{
    BufferedReader br = new BufferedReader(new inputstreamreader(system.in))
    String str = br.readLine();//８を入力した事にします。
    n = Integer.parseInt(str);
    Number nb1 = new Number();  
    //このようなアクセスはできない
    //nb1.num = 8;
    nb1.setNum(n);
    system.out.println("入力された値は"+nb1.getNum()+"です。");
  }
}
```

private変数を更新する為に同じクラス内のpublicメソッドを使い条件式を設定し通過した変数にのみ変数を更新する事で誤った値の更新を防ぐ事ができる。
【Firebase】deployがうまくいかない時の対処方法

#はじめに
本記事は初の投稿になります。わかりづらい点や間違ってる点がありましたら、コメントの程よろしくお願い致します。

- 対象者
 - Firabaseの初心者向け
- 大まかな流れ
 - Firebaseのデプロイコマンドである「firebase deploy」 を実施時のエラーの解決方法を記載する

#目次
[1. 背景](#1-背景)
[2. エラー内容](#2-エラー内容)
[3. 解決概要](#3-解決概要)
[4. 解決方法](#4-解決方法)
[5. 参考記事](#5-参考記事)

 
##1. 背景
ReactとFirebaseの学習時で、「create-react-app」で作成したアプリをFirebaseにデプロイを実施。
※「firebase init」はfirestore / functions / hostingを選択

##2. エラー内容
「firebase deploy」コマンドでデプロイを実施した時、以下のエラーがターミナルで発生

```terminal:ターミナル
✔  functions: Finished running predeploy script.
i  firestore: reading indexes from firestore.indexes.json...
i  cloud.firestore: checking firestore.rules for compilation errors...
✔  cloud.firestore: rules file firestore.rules compiled successfully
i  functions: ensuring required API cloudfunctions.googleapis.com is enabled...
i  functions: ensuring required API cloudbuild.googleapis.com is enabled...
⚠  functions: missing required API cloudbuild.googleapis.com. Enabling now...
✔  functions: required API cloudfunctions.googleapis.com is enabled

Error: HTTP Error: 400, Billing account for project 'xxxxxxxxxxxx' is not found. Billing must be enabled for activation of service(s) 'cloudbuild.googleapis.com,containerregistry.googleapis.com' to proceed.
```

##3. 解決概要
Cloud FunctionsのNode.js対応バージョンは10 or 12(Blaze従量課金生)
そのため、現時点の解決方法はNode.jsのバージョンを下げる必要がある。
**しかし、今後は使用できなくなる為、暫定的な対応になる。**
>公式引用
>>Node.js 8（2020 年 6 月 8 日に非推奨） Node.js 8 関数は、2020 年 2 月 15 日以降はデプロイできなくなります。すでにデプロイされている Node.js 8 関数は、2021 年 3 月 15 日をもって実行できなくなります。Node.js 8 ランタイムに関数をデプロイしている場合は、Node.js 10 ランタイムにアップグレードすることをおすすめします。

##4. 解決方法
`functions/package.json`を修正する。

```json:functions/package.json
  "engines": {
    "node": "8"
  }
```

##5. 参考記事
[Firebase 公式ドキュメント](https://firebase.google.com/docs/functions/manage-functions#upgrade-node10)
[stack overflow](https://stackoverflow.com/questions/62852071/cloud-functions-deployment-requires-the-pay-as-you-go-blaze-billing-plan)
PHP、Laravel学習　２

# ポートフォリオ作成
ここからポートフォリオ作成に入ります。

献立を考えてくれるWebアプリケーションを開発したいです
私は料理が好きで、よく作るのですがレパートリーがたくさんあるにもかかわらず
いざ何かを作ろうとすると、かなり悩んでしまいます
私は料理を買い物からするので、スーパーに行ったは良いものの、そこで買い物をしながら
悩んでしまったり、いつも作っている物の繰り返しになってしまいます。


# 解決したい問題
１、たくさんレパートリーがあるはずなのに忙しい中で料理をしようと思うとそれを思うように
引き出すことができない問題

２、料理の種類が和食、洋食、中華...等、いざ作ろうと思うと混ざってしまったりする問題

３、献立を考えている時間の削減、スーパーで買い物をする時の効率化

４、似通った料理の連続になってしまう問題（例えば、オムライス→炊き込みご飯→カレーの繰り返し等）

# 欲しい機能

１、献立をランダムで表示してくれる
２、献立に必要な材料の入力、保存ができる
３、献立のレパートリーを入力、保存できる
４、献立をカテゴライズできる
５、献立のカテゴリーを入力、保存できる
６、入力した献立の確認ができる
７、入力したカテゴリーの確認ができる

次回から作っていきます。
n の更新（npmのバージョン管理ツール）＆ typescriptを最新バージョンに更新

###今回やったこと

- npmのバージョン管理ツールnの更新
- typescriptを最新バージョンに更新(3.7.4→4.0.2)

```
mba-2:~ #{myname}$ n list
node/14.5.0
mba-2:~ #{myname}$ n latest

  installing : node-v14.11.0
       mkdir : /usr/local/n/versions/node/14.11.0
mkdir: /usr/local/n/versions/node/14.11.0: Permission denied

  Error: sudo required (or change ownership, or define N_PREFIX)

mba-2:~ #{myname}$ n --stable
12.18.4
mba-2:~ #{myname}$ n --version
6.6.0
mba-2:~ #{myname}$ sudo n stable  #sudoコマンドじゃないとできなかった。
Password:

  installing : node-v12.18.4
       mkdir : /usr/local/n/versions/node/12.18.4
       fetch : https://nodejs.org/dist/v12.18.4/node-v12.18.4-darwin-x64.tar.xz
   installed : v12.18.4

mba-2:~ #{myname}$ n --version
6.6.0
mba-2:~ #{myname}$ node -v
v12.18.4
mba-2:~ #{myname}$ sudo npm update -g npm　#TypeScriptをnpmで最新バージョンに更新する方法
/Users/#{myname}/bin/npx -> /Users/#{myname}/lib/node_modules/npm/bin/npx-cli.js
/Users/#{myname}/bin/npm -> /Users/#{myname}/lib/node_modules/npm/bin/npm-cli.js
+ npm@6.14.8
added 18 packages from 4 contributors, removed 14 packages and updated 43 packages in 13.178s
mba-2:~ #{myname}$ tsc --version
Version 3.7.4
mba-2:~ #{myname}$ npm install -g typescript@stable #stableなんてコマンドはそもそも存在しない。
npm ERR! code ETARGET
npm ERR! notarget No matching version found for typescript@stable.
npm ERR! notarget In most cases you or one of your dependencies are requesting
npm ERR! notarget a package version that doesn't exist.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/#{myname}/.npm/_logs/2020-09-16T14_08_20_183Z-debug.log
mba-2:~ #{myname}$ npm install -g typescript@latest
/Users/#{myname}/bin/tsc -> /Users/#{myname}/lib/node_modules/typescript/bin/tsc
/Users/#{myname}/bin/tsserver -> /Users/#{myname}/lib/node_modules/typescript/bin/tsserver
+ typescript@4.0.2
updated 1 package in 1.814s
mba-2:~ #{myname}$ tsc --version
Version 4.0.2
```

参考にした記事（いつもありがとうございます）
---
https://qastack.jp/programming/39677437/how-to-update-typescript-to-latest-version-with-npm
https://stackoverflow.com/questions/39677437/how-to-update-typescript-to-latest-version-with-npm
エラー内容を調べても解決できない時に確認したいこと

![nekocyan458A4183_TP_V.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/674912/488d0299-0b63-7d7b-6a39-d4e5e1bd8fdd.jpeg)


エンジニアになって最初の１ヶ月、エラーが発生したらとにかく調べる習慣を付けました。

調べてどうしても解決できそうにない時には聞くようにしています。

以前、あるエラーで３時間くらい悩み、色々試した結果、

”バージョンが違っていた”　ことがありました。

バージョンが違っていて、使用しているパターンが使えない可能性があるので、検索して見つけた記事が、バージョンいくつのものなのかを確認すると良いかもです。
OpenCVでエッジを抜き出す(ラプラシアン、ソーベル、キャニー）

# 機械学習に使う画像の前処理
コンピュータに「その画像に何が写っているか」を理解させるためには検出対象の輪郭を描き、そこから特徴を見つけ出すというプロセスが多く取られます。

その輪郭を描く部分をPython+OpenCVで3つの方法で行った結果をこの記事では掲載します。

# 元画像
加工元となる画像は2つ用意しました。

自然と人間です。
![nature.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/19695/23b99319-1b87-defe-55e7-4a1e6b05ffb4.jpeg)

![lady.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/19695/06692529-bf09-69c2-f505-be08ac118cc9.jpeg)

# コード
この程度です。

```python:edge.py
import cv2

img = cv2.imread('xxxxxxx.jpg')

# エッジ検出
edge_laplacian = cv2.Laplacian(img, -1)#ラプラシアン
edge_sobel = cv2.Sobel(img, -1, 0, 1)#ソーベル
edge_canny = cv2.Canny(img, 10.0, 200.0)#キャニー

# ファイル書き出し
cv2.imwrite('laplacian.jpg', edge_laplacian)
cv2.imwrite('sobel.jpg', edge_sobel)
cv2.imwrite('canny.jpg', edge_canny)
```

# 出力結果
## 自然
ラプラシアン↓
![laplacian.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/19695/e423041d-fb77-2e3d-95fa-c7f209b9f8df.jpeg)
ソーベル↓
![sobel.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/19695/f7f0435a-8d38-b433-6b72-c0abf1251b99.jpeg)
キャニー↓
![canny.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/19695/8d9edddd-4b0d-9956-89cc-da6208195e2c.jpeg)

## 人間
ラプラシアン↓
![laplacian.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/19695/4e5aa268-cf0c-d776-da20-ea85542f80f5.jpeg)
ソーベル↓
![sobel.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/19695/5990d821-7b59-576a-1e53-956f2d63094d.jpeg)
キャニー↓
![canny.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/19695/e97a9b2f-9e25-e9a6-22df-5476eb035f3c.jpeg)
Ruby学習4

#メソッドとか色々4

現在、Ruby技術者認定試験silverを取得するべく勉強中です。
言語に対する理解がまだまだなので、基本的な事からアウトプットしていきます。

##オブジェクトID
模擬問題から抜粋

```ruby
foo = [1,2,3]
bar = foo
baz = foo.dup #オブジェクトをコピー

bar[3] = 4
p foo
p bar
p baz

=>[1, 2, 3, 4]
  [1, 2, 3, 4]
  [1, 2, 3]
```

変数fooに、barの更新が適用される原理とは。

```ruby
foo = [1,2,3]
bar = foo
baz = foo.dup

p foo.object_id #参照しているオブジェクトidを出力
p bar.object_id
p baz.object_id

=>70275736077180
  70275736077180
  70275736077160
```

fooとbarは同じオブジェクトを参照しているので、barが更新されるとfooもつられて更新される仕組み。
一方、bazはオブジェクトを複製したものなので、参照する対象が違うというわけ。

## splitメソッド
第一引数で指定した文字列を区切り文字として、配列を生成する。

```ruby
servant = "saber,archer,lancer,rider,assassin,caster,berserker"
p servant.split!(/,/)

=> ["saber", "archer", "lancer", "rider", "assassin", "caster", "berserker"]
```
第二引数で数値を指定する事で、配列の要素数を指定する事が出来る。

```ruby
servant = "saber,archer,lancer,rider,assassin,caster,berserker"
p servant.split!(/,/, 3)

=> ["saber", "archer", "lancer,rider,assassin,caster,berserker"]
#3つ目の要素からは区切られずに一纏めにされる。
```

## deleteメソッド(String)
引数で指定した文字をselfから削除する。!をつけると破壊的メソッドになる。

```ruby
puts "0123456789".delete("0-58") #"-"を文字で挟む事で、範囲指定できる(この場合は0から5までの数値)

=> "679"
```

To_Be_Continued...
【Ruby初歩】while文におけるtrueとbreakの役割について

while文の条件式にtrueを設定することで、「処理が停止されない限り、処理をループさせる」ことができる。


```rb:簡単な例

while true #条件式をtrueにすることで、処理が停止されない限り、処理を継続させることができる。
 puts "数字の1または2を入力してください"
  number = gets.to_i #getsメソッドで入力させた文字列を、to_iメソッドで数値に変換し、変数numberへ代入。
 puts "入力された数字" #数値ではなく文字列が入力された場合は、0が表示される。
 puts number
 if number == 1
   puts "入力した数字は#{number}です。" #実行後、２行目に戻る（ループ）
 elsif number == 2
   puts "入力した数字は#{number}です。"  #実行後、2行目に戻る（ループ）
 else
   puts "入力した数字は1または2以外です。終了します。"
   break #1または2以外の数字や文字列を入れた場合は、else文中が実行され、ループが終了(break）する。

 end
end
```

trueであり続ける限り処理が続くわけだから、どこかで止めなければいけない。
Ctrl + Cをコンソール上で入力すれば強制的に止めることはできるが、コードの記述上でそれを行うためには、breakを設定する必要がある。
意外と知られていないGithubの便利なショートカット

## まずはこれ

`shift` + `?`

でショートカット一覧表示
￼
![image](https://user-images.githubusercontent.com/7469495/93344994-4ae70800-f86d-11ea-86df-4aa1c09fe5ae.png)

## リポジトリトップにて

| key | 機能 |
| --- | --- |
| g → i | issue一覧へ |
| g → p | プルリク一覧へ |
| g → a | actionsページへ |
| g → b | プロジェクトページへ |
| g → w | wiki一覧へ |

※ → は、1つめを押した後すばやく2つめを押すという意

## プルリクエストページにて

| key | 機能 |
| --- | --- |
| q | Reviewers サジェストを開く （Re `q` uest Reviewers で覚える） |
| a | Assigner サジェストを開く |
| ~~g → 4~~ | ~~Files changes ページへ（4つめタブへgoで覚える）~~ この機能は廃止された模様 |

## プルリクエスト Files changes ページにて

| key | 機能 |
| --- | --- |
| v | Review changes ボタンを押す |
| c | コミット一覧表示 |
| t | ファイル一覧表示 |

## ファイルビューにて

| key | 機能 |
| --- | --- |
| e | 編集する |

## 全般

| key | 機能 |
| --- | --- |
| s | 検索フォームにフォーカス |


## 余談

最近、腱鞘炎になりかけてしまい、Macトラックパッドを極力使わない、かつ作業効率化するためにまとめてみました

他にも便利なショートカットあればそっと補足お願いいたします
Java クラス変数　クラスメソッドについて

#それぞれの変数、メソッドについて

・インスタンス変数
各オブジェクトに関連づけされているフィールド(変数)の事を指す。
・インスタンスメソッド
各オブジェクトに関連づけされているメソッドの事を指す。

・クラス変数
クラス全体に関連づけされているフィールドの事を指す。
・クラスメソッド
クラス全体に関連づけされているメソッドの事を指す。

###クラス変数定義方法
```java
class Car {
    public static int Car //クラス変数　型名の前にstaticが必要 publicは修飾子
}                 型名 クラス名
```
###クラスメソッド定義方法
```java
class Car {
  public static void show(); //クラスメソッド
                     メソッド名
}
```

#####Carクラスファイルを利用するプログラムでクラスメソッドshow()を呼び出す方法
```
Car.show();
```
###クラスメソッドの特徴
・クラスメソッドはオブジェクトが作成されていなくても呼び出せる。
・クラスメソッド内ではインスタンス変数、インスタンスメソッドにアクセスする事はできない。


余談
メソッド内で宣言した変数はローカル変数といい、宣言したメソッド外では利用する事ができず、値を格納しているのはメソッドが終了するまで。

```java
class Car{
  int num;//ローカル変数
  static int sum;//クラス変数
  void setCar(int a){//ローカル変数
    int a //ローカル変数
  }
}
```
PythonでWebsocketの通知を受け取る



PythonでWebSocket通知を確認したかったので、作成してみた。


### 環境

|OS|Python|
|---|---|
|macOS 10.15.6|Python 3.8.5|

### 準備

websocket-clientをインストールする

```shell

% pip3 install websocket-client
```

### スクリプト

```python

#-*- coding:utf-8 -*-

from websocket import create_connection
import sys
import signal

ws = None
try:
    #コネクションを張る
    ws = create_connection("ws://192.168.0.1/v1/changes")
    #受信したメッセージを表示
    while True:
        recv = ws.recv()
        print(recv)

except:
    print("except")

finally:
    if ws is not None:
        ws.close()
    print("connection close")
````
Figma で San Francisco / SF Pro を使いたい時に Missing Fonts となる場合

Figma で iOS アプリのデザインをしている場合、iOS標準のアルファベットフォントである San Francisco / SF Pro を使用したくなります。

その時に Missing Fonts となって若干詰まったので、そのメモです。

San Francisco フォントについては、["San Francisco フォントを探る"](https://qiita.com/usagimaru/items/da88c0a8793f23633c28)が詳しいです。San Francisco フォントは総称の名前で、Font Familyとして使うときは SF Pro Text または SF Pro Display が使われると言うのがこの記事の核です。

また、以下の内容は Figma の Desktop App を対象としています。WEBブラウザ版の場合は、Font Helperなどのインストールが必要になると思うので、[公式の記事](https://help.figma.com/hc/en-us/articles/360039956894-Use-Local-Fonts-with-Figma-Font-Helper)を参考にしてください。

## まずPC内のフォントの有無を確認する

SF Pro が全く見つからない場合は、まず[公式サイト](https://developer.apple.com/fonts/)からフォントをダウンロードし、PCに登録しましょう。

MacではFontBookというデフォルトのアプリケーションが使用されます。

PCのシステムにフォントが追加されたことを確認したら、次に進みます。

## `SF Pro` ではなく `SF Pro Text` または `SF Pro Display` を使う

`SF Pro`を追加すると、なぜかそれを Figma 上から使えるように見えるため、使ってしまいがちです。

![罠](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/225665/06435d61-0375-3ae9-8be5-44ee82ca7d25.png)

ですが、これは罠です。`SF Pro`を指定し編集しようとすると、Figma上で[Missing Fonts](https://help.figma.com/hc/en-us/articles/360039956994-Manage-Missing-Fonts#:~:text=The%20Missing%20Fonts%20modal%20allows,Style%20for%20each%20missing%20font.)のワーニングが出てきてしまいます。

先ほど紹介した["San Francisco フォントを探る"](https://qiita.com/usagimaru/items/da88c0a8793f23633c28)の記事を読むとわかる通り、`SF Pro`というのもまた総称で、より詳細には`SF Pro Text`または`SF Pro Display`を指定して上げる必要があります。

![San Francisco Font Family](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/225665/a1655885-2952-63bd-fe9d-aa887d74474a.png)

iOSでは、20pt以上では`SF Pro Display`、それ以下では`SF Pro Text`が使用されるようなので、デザイン時にはそれに気をつけて行う必要があります。

以上、San FranciscoフォントをFigmaで使う時の注意点でした。

結構フォントの世界も面白い！
勉強日誌11日目

今日も残業！！
仕事内容だいぶ覚えて楽になってるけどそれでも体力はなくなる！

そそてなぜか落ちる正答率・・・
確認したらスペルミスとかだった。

正答率64％　（前回71％）

useradd -g rrrr user1
プライマリグループ rrrr を指定して、新規ユーザ　user1を作成

/etc/default/useradd
useradd コマンドでオプションを指定せずにユーザを作成するとき使用されるデフォルトの値が格納されているファイル

useradd -D
デフォルトの値を確認できるオプション

usermod -d /home/hoge uuuu
ユーザ uuuu のホームディレクトリを /home/hoge に変更

groupmod
グループの設定を変更したいときに使用するコマンド

passwd -u uuuu
ユーザアカウント uuuu のロック解除

user mod -U user
ユーザアカウント　user　のロックを解除

passwd -l user
ユーザ　user のロック

useradd -G hhhh user
プライマリグループ以外のグループ　hhhh を指定して、新規ユーザuserを指定

useradd -d tttt uuuu
ホームディレクトリ　tttt を指定して　新規ユーザuuuuを作成


正答率63％　（前回68%）

/etc/group
グループアカウントが収められているファイル

id uesr
ユーザ　user のユーザIDや所属グループを表示

id
自分のアカウントのIDや所属グループを確認したい

id -u user
user のユーザIDのみ表示

id -G user
ユーザ　userの所属する全てのグループIDのみを表示したい

groups hhhh
ユーザ hhhh　が所属するグループを確認できるコマンド

getent passwd
ローカルやLDAPサーバで管理しているユーザ情報の一覧を表示

正答率　78％　（前回　70％）

systemctl list-timers
systemdにおいて、全ての有効なtimerユニットを表示

/etc/cron.d
システム用ジョブの実行日時と内容を記述するディレクトリ

/usr/share/zoneinfo
タイムゾーンの情報がバイナリファイルとして格納されるディレクトリ

crontab -r
ユーザーのcronの設定を全て削除するコマンド

LC_TIME
ロケールの設定で、日付や時刻の書式を定義するための環境変数名

LANG
全てのカテゴリに対しロケールのデフォルトの値を設定

iconv -l
文字コードの変換を行うコマンドで、扱える文字コードを表示

/etc/locale.conf
systemdにおける、システム全体のロケール設定ファイル

systemd-run
1時的なtimerユニットの作成

LC_MESSAGES
ロケールの設定で、出力メッセージを定義

0 */2 * * 5,6
金曜日と土曜日に2時間ごとに実行

tzconfig
/etc/localtime /etc/timezone　ファイルを両方同時に変更
DartでString→DateTime型に変換

# 経緯
FlutterでTextFormFieldに入れた日付をDateTime型で取りたかったのでメモ。

# 環境
```
$ flutter doctorDoctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel beta, 1.21.0-9.2.pre, on Linux, locale ja_JP.UTF-8)
 
[✓] Android toolchain - develop for Android devices (Android SDK version 30.0.0)
[✓] Chrome - develop for the web
[✓] Android Studio (version 4.0)
[✓] VS Code (version 1.48.2)
```
こちらに書かれている通り、flutter_localizations(intl)の設定が必要です。
https://qiita.com/ko2ic/items/bd0d20d72c66e8231c5c


# コード例
```dart
import "package:intl/intl.dart";

class Test {
  // "2020/09/16 22:16"みたいな文字列から取る場合
  static final _dateFormatter = DateFormat("y/M/d HH:mm");

  // String→DateTime変換
  DateTime getDatetime(String datetimeStr){
    Datetime result;

    // String→DateTime変換
    try {
      result = _dateFormatter.parseStrict(datetimeStr);

      // (補足)
      // parseStrict()を使うのが大事。
      // parse()だと存在しない日付がいい感じ(?)に計算されて変換された
      // 例)2020/9/32を入れた場合
      // _dateFormatter.parseStrict("2020/9/32"); // 結果→Exception
      // _dateFormatter.parse("2020/9/32"); // 結果→2020/10/2のDateTimeに変換

    } catch(e){
      // 変換に失敗した場合の処理
    }

    return result;
  }
  
}
```
# 所感
`DateFormat.parse()`って需要あるんかな…

#参考
https://qiita.com/ko2ic/items/bd0d20d72c66e8231c5c
https://api.flutter.dev/flutter/intl/DateFormat-class.html
Windowsコマンドプロンプトを起動と共に文字コードをUTF-8に設定する

## 今更感満載な話題ですが

昨今のWebやプログラム界隈では、UTF-8がデフォルトの文字コードとなっている。

にもかかわらず、日本のWindows 10のコマンドプロンプトはデフォルト文字コードShift-JIS。

そんなわけで、コマンドプロンプト上でコマンドラインツールの文字を出力しようとすると文字化けが発生する。

なんとかならんもんかと検索したところ、これで解決。

## これで解決
```bash
$ cmd.exe /K "chcp 65001"
```
コマンドライン起動時にオプションを渡す。

/Kは、コマンドを実行する引数。

Intellijファミリーでは「File | Settings | Tools | Terminal | Application settings | Sell path」に上記のコマンドをそのまま入力すればOK。
Pythonでフィボナッチ数列の関数作成とtree recursion algorithm

code warの課題でフィボナッチ数を求める課題があったのですが、苦戦したので記録がてらout putしてみます。
課題：https://www.codewars.com/kata/529adbf7533b761c560004e5
そもそも、code warsというのはプログラミングの練習が無料でできるサイトという感じなので、興味あれば皆さまやってみると良いと思うのですが、本題からずれるため詳細は各自調べてみてください。

私は、[Tommy blog](https://obgynai.com/)というブログを主に独学でPythonの学習を行っているのですが、
[参照](https://obgynai.com/python-roadmap/)⇦このロードマップを完走した。
このロードマップの課題の中にフィボナッチ数列の作成という記事があるので、回帰関数によるフィボナッチ数列の作成は理解していました。
詳しくは[この記事](https://obgynai.com/fibonacci-sequence/)

```
def fibonacci(n):
    if n in [0, 1]: # nが０または１のとき
        return n
    return fibonacci(n - 1) + fibonacci(n - 2)
```
またこの様にlistを使って書くこともできるようですね。（codewarsの課題から引用）
しかし、このままではnが５０とか１００とか大きい数になってくると時間がかかってしまいます。

それはなぜかと言うと、例えば、n = 100のときはfibonacci(99):point_up: とfibonacci(98):point_up_tone5:をまず記憶し、次にfibonacci(99):point_up:の中ではfibonacci(98):v:とfibonacci(97):v:。その中のfibonacci(98):v:ではfibonacci(98):ok_hand:とfibonacci(97):ok_hand:。。。。（以下略）という風に枝分かれ式に計算が行われていき。同様のことが元のfibonacci(98):point_up_tone5:でも行われるという風になっているからです。

すこし、わかりにくいですね。すみません。
せっかく、fibonacci(97)を求めているのに、別のところでもfibonacci(97)を求めるという非常にもったいない？方法が取られているのです。
これをtree recursion というらしいですね。
生物の進化などで使われる樹形図みたいな感じですかね。
英語ですがわかりやすい図と解説が乗っているPDFがありましたので参考にしてください。[参考PDF](http://www.idc-online.com/technical_references/pdfs/information_technology/Tree_Recursion_in_Python.pdf)
また、このPDFにはこの時間が非常にかかるプログラムを改善する方法が乗っていましたので日本語でわかる様に解説しておきたいと思います。（著作権侵害あれば削除するのでコメントください）

```
def fibonacci(n):
    fib, fib_pre = 1, 0 # nが０または１のとき
    if n == 0 : return fib_pre
    elif n == 1 : return fib
    else:
        for i in range(n-1):
            fib, fib_pre = fib+fib_pre, fib #右辺のfib, fib_preは一つ前のもの。
        return fib
```

賢いですね。こうすれば別のところで同じ数値を計算することがなくなります。
しかし、これだけでは課題のクリアにはなりませんでした。:cry:

まだ、遅いらしいです。

その理由ですが、確かに、数値一つn=1000とかだけを求めるならば、一番簡単なコードが上記のようなものになるのですが、一回にn=1000, n=800, n=900, n=1020とか複数のフィボナッチ数を求めるとなるとさっき、n=1000まで求めたのに使えないやんとなり、もったいないですし、いちいち計算することが時間を余計につかってしまうことになるのです。

そこで、解決法としては辞書型に収納する方法が考えられました。
（まあ、順番通りだしリストでもいいのか。）

```
fib_dct = {0:0, 1:1} #関数よりも前に辞書を定義してしまう。
def fibonacci(n):
  fib, fib_pre = 1, 0 #tree recursion の回避を行うために必要
  if len(fib_dct)>n: #fib_dctに収納されている数がn以上ならすでに計算されているはず。
    return fib_dct[n]
  else:
    if n > 1: #n=0, 1はすでにretrunされているので不要ではある
      i =0 #これもi=0から始まるのでなくても大丈夫だけどわかりにくいからつけた
      for i in range(n-1):　# n = 3のときiは[0, 1, 2]となる
        fib, fib_pre = fib+fib_pre, fib
        if i > len(fib_dct)-3: #ここがむずい。まだ辞書に入っていないものを収納したいけど、初めからlen(fib_dct)は２以上なので、３を引いておかないといけない。
          fib_dct[n] = fib
        i +=1
    return fib_dct[n]
```
こう言う感じになってしまい、めちゃくちゃわかりにくくなってしまいました。
すみません。スマートさがなく。

しかし、この辞書型の考えを使い、辞書を関数の外で定義する必要も内容にスマートにすることができました。（これを残したかったから記事にした。）

```
def fibonacci(n):
    dct = {0:0,1:1} #n=0の時０、n=1のとき1
    def fib(n): #あらたな関数の定義
        if n not in dct: #nが初めて出た時には辞書に収納する
            dct[n] = fib(n-1)+fib(n-2)
        return dct[n]
    return fib(n)
```
これは辞書型に回帰的な関数の使用、さらに中に関数を使っているので少し抽象的になってしまいますが短くてつよいですね。

このような感じです。長文でわかりにくくなってしまいますたが、似た様なことで悩んでいる初心者がいれば参考になれば幸いです。
IAMについて　メモ

#IAMとは

**IAM(Identify and Access Management)**

##ルートユーザー
AWSにアカウント登録すると、ルートユーザーという物が作られる。認証情報として、Eメールアドレスとパスワードを持っている。 

フル権限、請求情報閲覧可能、パスワードの変更可能
※日々の業務では使用しないことを推奨


 **-IAMユーザー**
　AWSアカウント内で個別に作成できるユーザーの情報のこと

　認証する情報を選択する必要がある
　・パスワード
　・アクセスキー


#####IAMグループ
IAMユーザーをひとまとめにした物
権限管理が楽になる



##IAMロール
AWSアカウント内で作成できる認証情報
短期的な認証情報
アクセスキーといった情報を持たない

運用方法
EC2を削除できる権限を持ったロールを作成
それをあるユーザーにこのロールをスイッチできる権限を与えると削除できるようになる。
EC2などにも付けられる。



####MFA(Multi-Factor Authentication：多要素認証)
スマホなどのデバイスを利用して追加で設定できる認証のこと



##IAMポリシー
ポリシーとはJSON形式のドキュメント

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/712812/381875cf-cba3-d75f-e5b7-840d8c7aec83.png)
￼
[カピパラ好きなエンジニアブログより参照](https://capybara-engineer.hatenablog.com/entry/2019/11/29/151835)


###リクエストを評価するポリシー
#####1.Identity-based Polocies(アイデンティティベースのポリシー)
　・管理ポリシー
　　-AWS管理ポリシー
　　-カスタマー管理ポリシー

　・インラインポリシー
　　管理が少し複雑


#####2.Resource-based Policies(リソースベースのポリシー)
　S3などにアタッチするポリシー
　
1と2のポリシーはOR関係

#####3.Service Control Policies(組織SCP)
　IdentiryベースのポリシーとOrganizarionsSCPの両方が許可したものが操作できるAND条件のポリシー

######4.IAM Permissions Boundaries(境界)
　IdentiryベースのポリシーとPermissionsBoundariesの両方が許可したものが操作できるAND条件のポリシー

#####5.Access Control Pollicies(ACLs)
 他のアカウントのプリンシパルがどのリソースにアクセスできるかコントロールできるポリシー

#####6.Session Policies
　IAMロールやペデレーションしたユーザーの一時的なセッションを認証情報をパラメータとして渡すもの