OmniAICreator/Qiita-1.07M huggingface dataset:
SQLを理解していることは非エンジニアでも強力な武器となる！？　

# ＜SQLとは?＞

**SQL(Structured Query Language)はリレーショナル型データベース(RDB, "リレーショナルデータベース"ともいう)の操作を行うための言語である。**

リレーショナル型データベース（以下RDB）は、Excelのような行と列で構成された２次元の表形式。
RDBでも代表的なのが、MySQL, PostgreSQL, SQliteですね（ちなみに私が使っているのはMySQL）。SQLを理解していれば、１つに限らず複数のRDBを扱えるということ。

　ここではSQLについてまとめていきますが、その前にちょっと余談。「⚪︎⚪︎型データベースという名前ならば、他にもデータベース名があるのでは...?」その通り。

いくつか挙げると、
・階層型データベース（ツリーや枝分かれ状のような形式）
・ネットワーク型データベース（網目になって複雑）

　これらは”コードの冗長・重複”、”データ構造への依存”という問題点があったようで、エンジニアやプログラマーが頭を悩ませていたとか...そこで登場したのがRDBのようです。RDBはこの問題点を見事に解決したのです。

# ＜SQL文＞
DMLとDDMの２種類がある。


## DDM(Data Definition Language)
データを定義するための言語。

### CREATE
・CREATE DATABASE文
```CREATE DATABASE データベース名```
railsの場合、```rake(rails) db:create```

・CREATE TABLE文
```CREATE TABLE テーブル名(カラム名 カラムの型, カラム名 カラムの型, ...※複数可)```
※railsの場合、
```rails g model モデル名```
↓
```rails db:migrate```
をやっていた。

### ALTER
・テーブルにカラムを追加したい場合
```ALTER TABLE テーブル名 ADD カラム名 カラムの型```

・テーブルからカラムを削除したい場合
```ALTER TABLE テーブル名 DROP カラム名```

・テーブルのカラムを変更したい場合
```ALTER TABLE テーブル名 CHANGE 古いカラム名 新しいカラム名 新しいカラムの型```

## DML（Data Manipulation Language）
データを操作するための言語

### INSERT
テーブルにデータを登録する。
・全てのカラムに値を入れる場合
```INSERT INTO テーブル名 VALUES(値1, 値2, 値3)```
・特定のカラムにのみ値を入れる場合
```INSERT INTO テーブル名(カラム名1, カラム名2) VALUES(値1, 値2)```
### UPDATE
```UPDATE テーブル名 SET 変更内容 WHERE 条件```
### DELETE
テーブルにあるデータ（レコード）を削除。
```DELETE FROM テーブル名 WHERE 条件(id = 2)```
この場合、(id = 2)であるレコードを削除する。
### SELECT
テーブルの情報を検索するときに使う。
```SELECT カラム名 FROM テーブル名```



## 検索精度を上げる知識
セレクトと組み合わせることで精度が上がる。
### FROM句
あるテーブルからデータを検索する場合、<FROM句>でどのテーブルかを指定する
```SELECT カラム名 FROM テーブル名```
### WHERE句
条件を指定する場合（特定のカラムの値を引き出す時など）
```WHERE id = 2```　→idカラムが2の値であるレコードを選択する。

※これは**比較演算子や論理演算子**と組み合わせると検索の精度が上がる。
例えば、```FROM テーブル名 age <= 25 AND adress = "東京都"```
→ageが25以下かつadressが東京都のレコードを取得できる。AND演算子があればOR演算子もある。
```WHERE NOT adress = 東京都```　→adressが東京都ではないものを出せる。
```WHERE カラム名 BETWEEN 下限 AND 上限```→そのカラムの範囲を指定することができる（数字限定）。
```WHERE adress IN ("東京都", "神奈川県")```→adressカラムでそれぞれのデータを持ったレコードを出すことができる。
### ワイルドカード (*)
文字の代わりとして使う。SELECT文においては、
```SELECT * FROM テーブル名```　→テーブルの情報を全て選択することとなる。ワイルドだろ〜
### CONCAT関数
文字列を連結させることができる
### AS句
```CONCAT(カラム名1, カラム名2) AS "言葉"```
### DISTINCTキーワード
重複を防ぐ
```SELECT DISTINCT(重複を避けたいカラム名) ```
### GROUP BY句
指定したカラムが同じ値のものを１つにグループ化する。
```SELECT ~ FROM ~ WHERE ~ GROUP BY カラム名（何のカラムでひとまとめにしたいか）```
### COUNT関数
COUNT関数はグループ化されたデータに対して使用することができる。GROU BY句と組み合わせると良い。
```SELECT COUNT(カラム名)```
### JOIN句
他のテーブルの情報も一緒に取得できる。
```FROM テーブル名1
JOIN テーブル名2 ON テーブル名1.カラム名1 = テーブル名2.カラム名2```

# <終わりと参考URL>
とまあ、最後の方は羅列になってしまいましたが、SQL文はプログラミング言語の中でもとても文法チックで暗記が多いと感じました。これを言葉だけで覚えるのはキツいと思うので、実際に手を動かしてみて挙動を体感するのが定着するのに一番の近道になるのではないのでしょうか。自分も今後はそうやっていこうと思います。あとは、データってどんな仕組みで構成されているの?、どうやればデータを扱えるようになるの?など、ITの観点から勉強していくと、実際の今の仕事に役に立つかもしれませんね。そこから情報やセキュリティ関係を勉強すれば、知識もすんなり入ってくるのでしょうか。

＜参考URL＞
http://www.oracle.com/technetwork/jp/articles/index-155309-ja.html#p01d
rails　s後のコマンドについて質問です

ターミナルでrails　sを実行し,Use Ctrl-C to stopと表示されたのですが、その後にrails g controllerを実行しようとenterキーを押しても改行されるだけでコントローラーなどが生成されません。
railsのversionは５.２.４.２です。原因はなんでしょうか。
PHPでFizzBuzzの関数の作成

##はじめに
この記事はPHPの学習を始めた方が関数の学習で行う
FizzBuzzの関数の作成について書いていきます。


##FizzBuzzの仕様
・数値が3の倍数の戻り値は”Fizz”
・数値が5の倍数の戻り値は”Buzz”
・数値が3の倍数であり5の倍数でもある場、戻り値は”FizzBuzz”
・上記のどれも満たさない場合は、その数値自体を戻り値にする

##FizzBuzzの関数の使い方
・最初の下記の1行を記述

```
$max = 100;
```

・1から $max までのループを作り、FizzBuzzの関数を実行
・FizzBuzzの関数の戻り値を表示

##PHP

```test.php

<?php

   $max = 100;
   
   for ($num = 1; $num <= $max; $num++) {
       print fizzbuzz($num);
   }   
   
   function fizzbuzz($num) {
       
       if ($num % 15 == 0) {
          print "FizzBuzz" . PHP_EOL;
        }
       elseif ($num % 5 == 0) {
          print "Buzz" . PHP_EOL;
        }
       elseif ($num % 3 == 0) {
          print "Fizz" . PHP_EOL;
       }
       else {
          print $num . PHP_EOL;
       }
   }

?>

```
条件分岐のif文や繰り返しのfor文などを理解すれば
簡単に使えるように思います。
Swift:Timerの備忘録

##バージョン
・Xcode11.4.1
・Swift5

##概要
SwiftでTimerを使用する。


##コード

```swift:test.swift
var countTimer = 0

//doTimer()を1秒おきに呼び出す
Timer.scheduledTimer(timeInterval: 1.0, target: self, selector: #selector(CountTime.doTimer), userInfo: nil, repeats: true)

//1秒毎の処理（設定時間を引数にする）
@objc func doTimer() {
//時間を1秒おきに加算
countTimer += 1
print(countTimer)
}

//タイマーを停止する処理
self.timer.invalidate()
```

##参考にさせて頂いた記事
[Swift4環境でTimerの使い方と挙動を確認してみた](https://qiita.com/KikurageChan/items/5b33f95cbec9e0d8a05f)
P5.js 日本語リファレンス(deltaTime)

このページでは[「P5.js 日本語リファレンス」] (https://qiita.com/bit0101/items/91818244dc26c767a0fe) の deltaTime関数を説明します。

## deltaTime

### 説明文

システム変数 deltaTime には、前のフレームの開始と現在のフレームの開始の間の時間差がミリ秒単位で格納されています。

この変数は, フレームレートに関係なく一定に保つ必要がある時間依存のアニメーションや物理計算を作成するのに役立ちます。

### 構文

deltaTime

### 例 

```javascript
let rectX = 0;
let fr = 30 // FPSを開始する
let clr;

let rectX = 0; // 矩形のx座標
let fr = 30 // frameRate数
let clr;

function setup() {
  background(200);
  frameRate(fr);
  clr = color(255, 0, 0); // 赤色
}

function draw() {
  background(200);
  // 長方形をx方向に移動します
  // frameRate数が小さいほどdeltaTimeは大きくなり、rectXの増加値も大きくなります。
  rectX = rectX + 1 *(deltaTime / 50);

  if(rectX >= width){
    //画面から外れた場合。
    if(fr === 30){
      clr = color(0, 0, 255); // 青色
      fr = 10;
      frameRate(fr); // frameRate数を10にします
    } else {
      clr = color(255, 0, 0); // 赤色
      fr = 30;
      frameRate(fr); // frameRate数を30にします
    }
    rectX = 0;
  }
  fill(clr);
  rect(rectX, 40, 20, 20);
}
```

### 実行結果
https://editor.p5js.org/bit0101/sketches/XwXvcoPrH

### 著作権

p5.js was created by Lauren McCarthy and is developed by a community of collaborators, with support from the Processing Foundation and NYU ITP. Identity and graphic design by Jerel Johnson.

### ライセンス

Creative Commons(CC BY-NC-SA 4.0) に従います。
【NodeJS】Electron(デスクトップアプリ)入門

###当記事の目的
Electron(デスクトップアプリ)のサンプルを作成。

###NodeJSがインストールされていることを確認。

```
> node -v
v12.16.2
```

###プロジェクト用packege.json作成

```
> npm init
###electronパッケージをインストール
> npm i -D electron
```
###各種ファイル作成
srcフォルダを作成し、その配下にアプリ用ファイルを作成する。
・アプリ用packege.json作成

```json:package.json
{
  "main": "main.js" 
}
```
```javascript:main.js
// アプリケーション作成用のモジュールを読み込み
const {app, BrowserWindow} = require('electron');

// メインウィンドウ
let mainWindow;

function createWindow() {
  // メインウィンドウを作成
  mainWindow = new BrowserWindow({
    webPreferences: {
      nodeIntegration: true,
    },
    width: 800, height: 600,
  });

  // メインウィンドウに表示するURLを指定
  // （今回はmain.jsと同じディレクトリのindex.html）
  mainWindow.loadFile('index.html');

  // デベロッパーツールの起動
  mainWindow.webContents.openDevTools();

  // メインウィンドウが閉じられたときの処理
  mainWindow.on('closed', () => {
    mainWindow = null;
  });
}

//  初期化が完了した時の処理
app.on('ready', createWindow);

// 全てのウィンドウが閉じたときの処理
app.on('window-all-closed', () => {
  // macOSのとき以外はアプリケーションを終了させます
  if (process.platform !== 'darwin') {
    app.quit();
  }
});
// アプリケーションがアクティブになった時の処理(Macだと、Dockがクリックされた時）
app.on('activate', () => {
  // メインウィンドウが消えている場合は再度メインウィンドウを作成する
  if (mainWindow === null) {
    createWindow();
  }
});
```

```html:index.html
<html>
<head>
  <meta charset="UTF-8">
  <title>Hello World!</title>
</head>

<body>
  <h1>初めてのElectron</h1>
  We are using node <script>document.write(process.versions.node)</script>,
  Chrome <script>document.write(process.versions.chrome)</script>,
  and Electron <script>document.write(process.versions.electron)</script>.
</body>
</html>
```

###起動
```
> npx electron ./src
```
###パッケージング
```
> npm i -D electron-packager
```
・Windows

```
> npx electron-packager src SampleApp --platform=win32 --arch=x64 --overwrite
```
・macOS(darwin)

```
> npx electron-packager src SampleApp --platform=darwin --arch=x64 --overwrite
```

![サンプル画面.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/488082/2295ccce-802a-d262-6f07-66321b43336d.png)
fabric.jsを使って、指定画像にcanvas上で手書き実装

# 初めに
ダウンロードやクリア(書いた内容)機能の実装等を含め、すこし迷ったので、そのあたりを含めたサンプルメモ(3.6.3で確認)

ライブラリのjsファイルについては、以下のページのダウンロードリンクから取得
[fabric.jsのメインページ](http://fabricjs.com/)

## フォルダ構成

```
root/
 ├ index.html
 ├ canvas.jpg(表示する画像)
 └ assets/
    ├ main.js
    └ fabric.min.js
```

## ソース
### HTML

``` html:index.html
<!DOCTYPE html>
<html>
<head>
    <script src="./assets/js/fabric.min.js"></script>
    <script src="./assets/js/main.js"></script>
</head>
<body>
    <canvas id="canvas"></canvas>
    <a id="download" href="#">ダウンロード</a>
    <a id="init" href="javascript:void(0)">クリア</a>
</body>
</html>
```

### JavaScript
``` javascript:main.js
// キャンバスの共通オブジェクト
var canvas = null;
// 読み込むファイル名（動的に変えてもＯＫ）
var FILENAME = "canvas.jpg";

window.addEventListener("load", function(){

    // キャンバスの初期設定
    const canvasinit = function(){

        // キャンバス取得
        var canvas = new fabric.Canvas('canvas');
        
        // 手書きモードOK
        canvas.isDrawingMode = true;
        // 手書きの色
        canvas.freeDrawingBrush.color = "#990000";
        // 手書きの太さ
        canvas.freeDrawingBrush.width = 10;

        // 画像読み込み
        var img = new Image();
        img.src=FILENAME;

        // 画像読み込んだときの処理
        img.onload = function(){
            
            // キャンバスサイズを設定()
            canvas.setWidth(this.width);
            canvas.setHeight(this.height);

            // サイズを指定画像に合わせるために読み込み終わったときに、キャンバスに設定する
            canvas.setBackgroundImage(FILENAME, canvas.renderAll.bind(canvas),
                {
                    // キャンバス内の画像サイズを設定
                    scaleX: canvas.width / img.width,
                    scaleY: canvas.height / img.height
                }
            );

        }

        // 描いた内容はクリア、画像はそのまま
        var init = document.getElementById("init");
        init.addEventListener("click", function(){
            // キャンバスクリア
            canvas.clear();
            // 画像を表示(上記onload処理にいく)
            img.src=FILENAME;
        });

    }
    // 初期処理で実行
    canvasinit();

    // ダウンロード処理
    var download = document.getElementById("download");
    download.addEventListener("click", function(){
        
        // ダウンロードファイル名指定
        this.setAttribute("download", "sample.jpg");
        // キャンバスのオブジェクト取得
        canvas = document.getElementById('canvas');
        // base64に変換
        var base64 = canvas.toDataURL("image/jpeg");
        // ダウンロード
        document.getElementById("download").href = base64;

    });

});
```
ダウンロードは、ローカル実行では動かないことがあるのでお気を付けを（多分ブラウザのセキュリティレベルによるものかと）
【NodeJS】Express(Webアプリ)入門

###当記事の目的
Express(Webアプリ)のサンプルを作成。

###プロジェクト用フォルダを作成
```
mkdir myapp
cd myapp
```

###プロジェクト用packege.json作成
```
npm init
```

###Expressパッケージをインストール
```
npm install express --save
```

###インストール済みのパッケージを確認
```
npm list --depth=0
`-- express@4.17.1
```

###各種ファイル作成
myapp ディレクトリーで、app.js というファイルを作成

```javascript:app.js
const express = require('express')
const app = express()

app.get('/', (req, res) => res.send('Hello World!'))

app.listen(3000, () => console.log('Example app listening on port 3000!'))
```
###起動
```
> node app.js
Example app listening on port 3000!
```

###画面
http://localhost:3000/
![サンプルが面.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/488082/42d9a971-28da-bb70-7eea-ced7c6c0f5d0.png)

###参考
Express
https://expressjs.com/
Kerasのkeras.preprocessing.imageの使い方備忘録

keras.preprocessing.imageにある画像の読み込みや操作などを色々試しました。
#画像の読み込み
load_img関数を使用して画像を読むこむことができる。
画像はPIL形式で読み込まれるので、NNの訓練用、予測用などで使う際はnumpyのarray型に変換する必要がある。

```Python:
import keras
keras.preprocessing.image.load_img(
    path, grayscale=False, color_mode="rgb", target_size=None, interpolation="nearest"
)
```
| 引数           |       説明         |   指定方法   |
|:---------------|:------------------|:---------------------------------------------------|
| path           |       画像のパス(絶対でも相対でもいい)                                 |        パスの文字列        |
| grayscale      |     グレースケールの設定だが公式で非推奨であり、color_modeで指定するべき |       True or False       |
| color_mode     |       読み込んだ画像のフォーマットを指定できる。'grayscale','rgb','rgba'があり、**デフォルト**は'rgb'     | 'grayscale' か 'rgb' か 'rgba'|
| target_size    |   読み込む画像の大きさをintのタプルで指定する                           |  ( width , height )  |
| interpolation  |   画像の補完方法。元画像とtarget_sizeに差異があるときに画像を補完する。"nearest", "bilinear", "bicubic", "lanczos", "box", "hamming"の種類の補完方法がサポートされている。**デフォルト**では"nearest" |       "nearest" か "bilinear" か "bicubic" か "lanczos" か "box" か "hamming"|

##実践
```Python:画像の読み込み
from keras.preprocessing.image import load_img
import matplotlib.pyplot as plt

#基本的にはpath,color_code,target_sizeをしておけば良い
#読み込み自体はここだけで完了！
img = load_img("taiju.jpg", color_mode='rgb', target_size=(700,700))
array = img_to_array(img) 
gray_img = load_img("taiju.jpg", color_mode='grayscale', target_size=(28,28))
gray_array = img_to_array(gray_img)

testlist=[]
testlist.append(array)
testlist.append(gray_array)
imglist=[]
imglist.append(img)
imglist.append(gray_img)

#mnistを利用したニューラルネットワークなどで使う際の形式
print("arrayの形式:",array.shape)
print("gray_arrayの形式:",gray_array.shape)
#matplotを使った画像の表示
for i in range(2):
  plt.subplot(1,5,i+1)
  plt.imshow(imglist[i],'gray')
plt.show
```
これを実行すると以下のようになります。
![load_img.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/377692/f0dc2353-a140-69ed-0f9d-54c554442f42.png)
一つ目の画像は**img = load_img("taiju.jpg", color_mode='rgb', target_size=(700,700))**で読んだ画像であり、フルカラーの縦横700pixelの元画像サイズで読み込んでいるため鮮明に表示されています。
二つ目の画像は**gray_img = load_img("taiju.jpg", color_mode='grayscale', target_size=(28,28))**で読んだ画像で、グレースケールに変換されて縦横28pixelに縮小されて表示されています。そのため不鮮明で荒く画像が見えます。
また、**img_to_array**関数を使うことでnumpyのarray型に変換でき、ニューラルネットワークで作成したモデルによる予測などにも活用できます。
5 月 LeetCode 挑戰, W2D3, Find the Town Judge (兩個 Hash Table), in Swift

資料結構與演算法： `Hash Table`

- 挑戰頁面 - [Find the Town Judge](https://leetcode.com/explore/featured/card/may-leetcoding-challenge/535/week-2-may-8th-may-14th/3325/)
- 原題目頁面 - [997. Find the Town Judge](https://leetcode.com/problems/find-the-town-judge/)

## 思考方式

題意要求我們 <strike>玩狼人殺</strike> 找出法官是誰。

而要記錄村民信任哪個鄉民的話，直覺上是拿 hash table 來用。

但是題目提到，法官必須不能信任任何人，因此就必須準備兩個 hash table

- 一個用來記錄某村民被誰信任
- 一個用來記錄某村民信任了誰

而判斷法官的方式就是

- 法官必須被 N - 1 個人信任（ `-1` 是因為不包含自己）
- 法官在信任了誰那個 hash table 不能有紀錄

## 程式碼

``` swift
class Solution {
    func findJudge(_ N: Int, _ trust: [[Int]]) -> Int {
        if trust.isEmpty { return N == 1 ? 1 : -1 }

        var trusted = [Int: Int]()
        var trusting = [Int: Int]()

        for pair in trust {
            trusting[pair[0]] = (trusting[pair[0]] ?? 0) + 1
            trusted[pair[1]] = (trusted[pair[1]] ?? 0) + 1
        }

        for (key, count) in trusted {
            if count == (N - 1) && trusting[key] == nil {
                return key
            }
        }

        return -1
    }
}
```

## 複雜度分析

n 為題目給的 N ，t 為 trust 的長度。

- 時間複雜度： O(t + n)
  - 紀錄時走了 O(t)
  - 尋找法官時走了 O(n)
- 空間複雜度： O(n)
  - 無論是信任還是被信任最大元素會是 n 個

## 執行結果

還滿慘的（笑），還有一個只用一個 hash table 來紀錄的寫法，稍晚再貼上來。

``` text
Runtime: 864 ms (beats 49.20%)
Memory Usage: 21.2 MB
```
P5.js 日本語リファレンス(print)

このページでは[「P5.js 日本語リファレンス」] (https://qiita.com/bit0101/items/91818244dc26c767a0fe) の print関数を説明します。

## print() 

### 説明文

print() はブラウザのコンソール領域に書き込みます。この関数は、プログラムが生成しているデータを確認(デバッグ)するのに役立ちます。この関数は、呼び出しごとに新しいテキスト行を作成します。個々の要素は引用符("")で区切り, 加算演算子(+)で結合できます。

引数なしで print() を呼び出すと, ブラウザの印刷ダイアログを開く window.print() が呼び出されることに注意してください。空白行をコンソールに出力するには print('\ n') と記述します。

### 構文

print(contents)

### パラメタ

- contents  
任意：コンソール領域に書き込む数値、文字列、オブジェクト、ブール値、配列 の任意の組み合わせ

### 例

```javascript
let x = 10;
print('xの値は' + x); //「xの値は10です」と出力します
```


### 著作権

p5.js was created by Lauren McCarthy and is developed by a community of collaborators, with support from the Processing Foundation and NYU ITP. Identity and graphic design by Jerel Johnson.

### ライセンス

Creative Commons(CC BY-NC-SA 4.0) に従います。
P5.js 日本語リファレンス(frameCount)

このページでは[「P5.js 日本語リファレンス」] (https://qiita.com/bit0101/items/91818244dc26c767a0fe) の frameCount関数を説明します。

## frameCount

### 説明文

システム変数 frameCount には、プログラムの開始以降に表示されたフレームの数が格納されています。  setup() 内の値は0であり、描画の最初の反復後は1になります。

### 構文

frameCount

### 例

```javascript
function setup() {
  frameRate(2); // 1秒間に2フレーム表示することを設定
  textSize(30);
  textAlign(CENTER);
}

function draw() {
  background(200);
  // frameCount の値をそのまま画面に描画する
  text(frameCount, width / 2, height / 2);
}
```

### 実行結果
https://editor.p5js.org/bit0101/sketches/LIRpyxZD8


### 著作権

p5.js was created by Lauren McCarthy and is developed by a community of collaborators, with support from the Processing Foundation and NYU ITP. Identity and graphic design by Jerel Johnson.

### ライセンス

Creative Commons(CC BY-NC-SA 4.0) に従います。
outlookメールで自動メッセージbotを作る


outlookを使っている人向けに、自分のPCのメールからスクリプトを使ってメール送信する方法を紹介

#フォルダ内



![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/275572/2d1f2383-847c-c538-1501-392c3fdfaca7.png)



```vb
'01.vbsの中身

Set olkApp = CreateObject("Outlook.Application")
Set objMsg = olkApp.CreateItem(0) ' 0 = olMailItem
objMsg.To = "送り先@gmail.com"
objMsg.Subject = "this is subject"
objMsg.Body = "hi, this mail is automatic by bat"
objMsg.Send 
```

```
#01.batの中身

@echo off

cscript 01.vbs

pause
```


#同じフォルダの中にファイルを入れておけば添付もできる



```vb
'01.vbsの中身

Set olkApp = CreateObject("Outlook.Application")
Set objMsg = olkApp.CreateItem(0) ' 0 = olMailItem
objMsg.To = "送り先@gmail.com"
objMsg.Subject = "this is subject"
objMsg.Body = "hi, this mail is automatic by bat"
objMsg.Attachments.Add "C:\users\desktop\outlook_auto_mail\tenpu.pdf"
objMsg.Send 
```

#あとはタスクスケジューラーでbatファイルを定期的にたたく
例えばRやpythonの分析を定期的に行って、出力したファイルをメールで送る
なんて使い方もできます。

```
#01.batの中身

@echo off

rscript 01.r
python 01.py
cscript 01.vbs

pause
```

#おわり
Bitnamiでバーチャルホストの設定を読み込ませる

Bitnamiに入れたWordpressのバーチャルホスト設定で手間取ったため手順をメモ

# 手順
## 1. Wordpressのconfigの設定
- Wordpressのバーチャルホストのconfigは`/opt/bitnami/apps/Wordpress/conf/httpd-vhosts.conf`に格納されている
- ダミーで入っているデフォルトの中身を書き換える

## 2. Bitnami本体のconfigの設定
- Wordpressのconfigを触るだけでは設定が反映されない。Bitnami本体にもconfigが存在するため、そこでWordpressのconfigを読み込ませる必要がある。なので下記の内容を追記する
 - ちなみに`bitnami-apps-vhosts.conf`は`bitnami-apps-prefix.conf`などとともに同じディレクトリの`bitnami.conf`でさらに読み込まれている

```/opt/bitnami/apache2/conf/bitnami/bitnami-apps-vhosts.conf
# Bitnami applications installed in a Virtual Host
Include '/opt/bitnami/apps/wordpress/conf/httpd-vhosts.conf'
```

## 3. Bitnamiのprefixの無効化
- Include以下をコメントアウトする

```/opt/bitnami/apache2/conf/bitnami/bitnami-apps-prefix.conf
# Bitnami applications installed in a prefix URL
# Include "/opt/bitnami/apps/wordpress/conf/httpd-prefix.conf"
# Include "/opt/bitnami/apps/phpmyadmin/conf/httpd-prefix.conf"
```

## 4. Apacheの再起動
再起動してエラーが出なければOK.

```
sudo /opt/bitnami/ctlscript.sh restart apache
```

# Refference
- [WP Multisite on Amazon Lightsail? - WordPress - Bitnami Community](https://community.bitnami.com/t/wp-multisite-on-amazon-lightsail/48393/8)
- [Help setting up apache2 virtual host config for bitnami wordpress for two sites (Not multisite) - WordPress - Bitnami Community](https://community.bitnami.com/t/help-setting-up-apache2-virtual-host-config-for-bitnami-wordpress-for-two-sites-not-multisite/67427/2)
- [LightSailのWordPressと相乗りさせる方法](https://www.erestage.com/develop/apache/lightsail-wordpress-ainori/)
GCP-ACE試験対策[ワークロードに適したコンピューティング サービスを選択する]

> ワークロードに適したコンピューティング サービスを選択する

今回は、これについて。

<img width="760" alt="スクリーンショット 2020-05-10 17.03.25.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/623009/274f1c4d-3bc3-7e25-446e-a1af0efb1f13.png">

簡単にGCPのコンピューティングサービスをまとめた。

### ComputeEngine
- 汎用的なVMが欲しい場合は、ComputeEngine 
- 幅広いワークロードに適している
- VPCのSubnet上に展開される
- 仮想マシンのため、どの言語でも使用出来る

### Google Kubernetes Engine
- Kubernetesのフルマネージドサービス
- コンテナを使用するワークロードに適している
- Compute Engine上でコンテナがデプロイされている
- マスターノードはコンソール上に表示されない
- オリジナルでStackDriver(オペレーション-ロギング)と統合されている

### App Engine
- WEBアプリのワークロードに適している
- インフラは考慮せず、コードのみのデプロイでアプリケーションを展開出来る
- Standard環境とFlexible環境が存在する


### Cloud Run
- サーバーレスコンテナ
- Knative
- WEBアプリやバッチなど幅広いワークロードに適している
- ０からのコンテナのスケーリングが可能
- HTTPリクエストでキックされる


### Cloud Functions
- FaaS
- イベントドリブンな軽量のワークロードに適している

### サーバーレスの使い分け

みて分かる通り、サーバーレスコンピュートサービスが幾つかある。
これらの使い分けは、下記のフローで判断出来る。
https://cloud.google.com/serverless-options?hl=ja

if event driven
   then Cloud Functions
if need Kubernetes
   then Cloud Run for Anthos
if use any language
   then Cloud Run
if do not use any language AND application deployment
   then App Engine


改めて、各コンピュートサービスの特徴について、まとめる必要がある。
GooglePlayでリリースできなくて詰まった件「完全にブロックされた APK」

GooglePlayでアプリのバージョンアップをしようとするとこんな警告が

```
完全にブロックされた APK

問題:
この APK は、バージョン コードの大きい 1 つ以上の APK で完全にブロックされているため、ユーザーに配信されません。

解決策:
この APK をリリースから削除するか、このリリースに含まれている APK の対象やバージョン コードを確認してください。
```

https://www.hirohomme.com/2019/06/03/%E5%AE%8C%E5%85%A8%E3%81%AB%E3%83%96%E3%83%AD%E3%83%83%E3%82%AF%E3%81%95%E3%82%8C%E3%81%9Fapk/
によると
> バージョンコードを +2（前回 1 に対して、問題のapkは 3 ）にしてしまっていて

とあり、このとき公開中のAPKはバージョン`4`で、更新は`6`だから
たしかにバージョンを2以上増やしているな〜と`5`のAPKに変更しようとしました。

しかし、よく見てみるとすでにアーティファクトライブラリに`5`がある！
しかもこれビルドにミスって公開できないやつ！！！
アーティファクトライブラリでは削除機能もないです。

もしかしてデッドロック！！？
と困り果てて30分ぐらいGooglePlayConsoleを彷徨ってたら、見つけました対処法。

### 対処法
警告の一つ前の画面に戻って、

`維持する Android App Bundle と APK`を見てみると、`4`が維持するAPKになってました。
これを無効にし、また公開前の確認に行きます。

するとバージョンが+2でも公開できる！
これで無事公開できました。

恐らく、リリース履歴のどこかにあればバージョンが2つ以上あがっていても問題がないようです。
それにしても警告の日本語、意味掴みづらい……。
PMP試験に出てくるProject Communications Managementの用語を覚えよう！

# Project Communications Managementとは
プロジェクトコミュニケーション管理のこと

## PMBOKガイドのどこに出てくるのか
PMBOKガイドの`379ページ`の`10.2 MANAGE COMMUNICATION`にでてくるぞ！

## 用語
- Communication channels formula
    - N(N-1)/2  (N=ステークホルダー数)
- Nonverbal Communication
    - コミュニケーションの55%!
- Paralingual
    - 声色や身ぶりなど
- Effective listening
    - 声色や身ぶりなどに注意して話を聞く
    - 内容をより明確にするための質問をする
    - 相手にフィードバックする
- Active Listening
- Acknowledgement of the message
    - 内容は理解した。
- Acceptance of the message
    - 内容を承諾した。
- Messages are `transmitted`
    - メッセージを発信！
- Knowledge is `transferred`
    - 知識が伝播！
- communications management plan
    - 誰がどんな情報が必要か
    - いつ必要か
    - どんな`modality`で必要か

----

よかったよかった
[Unity初級]GetComponentとTransformについて

#概要
transformってコンポーネントなのにGetComponentをつけてないことに違和感を感じて試してみました。
#本文
```cs

        transform.position = new Vector3(3.0f, 3.0f, 3.0f);
```
これはよく見かける形。

```cs

        GetComponent<Transform>().position = new Vector3(3.0f, 3.0f, 3.0f);
```
普段コンポーネントを使うときのようにGetComponentを付けてみても同じ動作をしてくれます。（こっちのTは大文字）

transformはGetComponent<Transform>()の省略形のようです。
PHPのarray_splice関数の挙動を確認する


#array_splice関数とは
`array_splice関数`は、配列の任意の場所に要素を`追加`したり、既存の要素を`置き換え`たり`削除`したりといった処理を行う。

#array_splice関数の構文

```.php
array_splice ( array &$input , int $offset [, int $length = count($input) [, mixed $replacement = array() ]] ) : array

&$input     //操作対象の配列
$offset     //要素の抽出開始位置
$length     //取り出す要素数
$replacement//削除個所に挿入する配列

```

##array_splice関数を使ってみる

```daihyou.php
$data = ['本田', '長友', '香川', '長谷部', '遠藤',];
print_r(array_splice($data, 2, 3, ['久保', '中村', '室谷']));
//Array ( [0] => 香川 [1] => 長谷部 [2] => 遠藤 ) 
print_r($data);
//Array ( [0] => 本田 [1] => 長友 [2] => 久保 [3] => 中村 [4] => 室谷 )
```
2行目のsplice関数の引数をまとめると下記の表になる。

|  |  |意味  |
|---|---|---|
|第一引数  |$data  |捜査対象の配列  |
|第二引数  |2（香川）  |要素の抽出開始位置  |
|第三引数  |3（香川、長谷部、遠藤）  |取り出す要素数  |
|第四引数  |['久保', '中村', '室谷']|削除個所に挿入する配列  |

2行目のsplice関数は戻り値として**置き換えによって除去された要素**
を返す。（置き換え後の値ではないので注意）

4行目の`$data`を`print_r関数`で出力すると、置き換えられている。

#第二、第三引数に負数を指定
`splice関数`の第二第三引数に負数を指定することが出来る。

```.php
$data = ['本田', '長友', '香川', '長谷部', '遠藤',];
print_r(array_splice($data, -3, -2, ['小川', '権田']));
//Array ( [0] => 香川 )
print_r($data);
//Array ( [0] => 本田 [1] => 長友 [2] => 小川 [3] => 権田 [4] => 長谷部 [5] => 遠藤 )
```

第二第三引数に負数を指定した場合、`配列の末尾を-1`として、そこからさかのぼって数えた位置をそれぞれ開始/終了位置とする。
第三引数は、配列末尾から`残す要素の数`を表しているといえる。（2個（長谷部と遠藤）だけ残す）

|  |  |意味  |
|---|---|---|
|第一引数  |$data  |操作対象の配列  |
|第二引数  |-3（香川）  |要素の抽出開始位置  |
|第三引数  |-2（香川）「長谷部、遠藤」  |取り出す要素数（残す要素数）  |
|第四引数  | ['小川', '権田']|削除個所に挿入する配列  |

#引数を省略
引数を省略した場合、`array_splice関数`は指定された要素を削除する。

```.php
$data = ['本田', '長友', '香川', '長谷部', '遠藤',];
print_r(array_splice($data, 3));
//Array ( [0] => 長谷部 [1] => 遠藤 )
print_r($data);
//Array ( [0] => 本田 [1] => 長友 [2] => 香川 )
```
#第三引数に0を指定
第三引数に0を指定すると、`arrat_splice関数`は配列に第四引数に指定した値を挿入する。

```.php
$data = ['本田', '長友', '香川', '長谷部', '遠藤',];
print_r(array_splice($data, 1,0,['興梠', '宇佐美']));
//Array ( ) 
print_r($data);
//Array ( [0] => 本田 [1] => 興梠 [2] => 宇佐美 [3] => 長友 [4] => 香川 [5] => 長谷部 [6] => 遠藤 )
```
上記は厳密にいうと、「2番目から0個の要素を第四引数の内容で置き換えなさい」という意味になる。結果として、2番目の要素の直前に新しい要素が挿入される。

#参考
・独習PHP
<a href="https://www.php.net/manual/ja/function.array-splice.php">・PHP公式リファレンス</a>
mapのkey存在・非存在を確認する

# はじめに
競技プログラミングで`map`を使っていますが、かなり適当に使っていたので少しでも理解するために手元で動かしました。

# バージョン
  
```bash
> g++ --version
g++ (Homebrew GCC 9.3.0) 9.3.0
```

# コード  
  
```cpp
#include <iostream>
#include <map>

int main(){

    std::map<int, bool> mp;

    // 分かる
    std::cout << mp.count(1) << std::endl; // 0 ... ①
    mp[1] = true;
    std::cout << mp.count(1) << std::endl; // 1 ... ②

    // 分からなかった
    bool f = mp[0];
    std::cout << mp.count(0) << std::endl; // 1 ... ③
    mp[1] = false;
    std::cout << mp.count(1) << std::endl; // 1 ... ④

    return 0;
}
```

# 解説

[map::count](https://cpprefjp.github.io/reference/map/map/count.html)
  
## ①
```cpp
std::cout << mp.count(1) << std::endl; // 0 ... ①
```
keyである`1`が非存在なので戻り値は`0`。

## ②
```cpp
mp[1] = true;
std::cout << mp.count(1) << std::endl; // 1 ... ②
```
keyである`1`が存在するので戻り値は`1`。

## ③
```cpp
bool f = mp[0];
std::cout << mp.count(0) << std::endl; // 1 ... ③
```

`mp[0]`にまだ値格納してなくない？と思いました。
[map::operator](http://www.cplusplus.com/reference/map/map/operator[]/)で下記の記載があります。

> If k does not match the key of any element in the container, the function inserts a new element with that key and returns a reference to its mapped value. Notice that this always increases the container size by one, even if no mapped value is assigned to the element (the element is constructed using its default constructor).

```cpp
bool f = mp[0];
```

非存在のキーに対してアクセスがあった場合、デフォルト値が入るとのこと。
つまり、上記の代入時点で`mp[0]`にデフォルト値(`false`)が格納されています。
  
```cpp
std::cout << mp.count(0) << std::endl; // 1 ... ③
```

よって、keyである`0`が存在するので戻り値は`1`。

## ④

```cpp
mp[1] = false;
std::cout << mp.count(1) << std::endl; // 1 ... ④
```

`bool`の俗に言うゼロ値である`false`が代入された時点で、keyが削除されるかと思っていましたが、そんなことはありませんでした。
keyである`1`が存在するので戻り値は`1`。

# まとめ  
  
- `map`はアクセスした時点でキーが存在する
- ゼロ値が格納されたからといってキーが非存在になるわけではない
cert-manager(amd64,arm64)でさくらのクラウドDNSつかえるようにした

# 挫折を乗り越え...
前回[[cert-manager(arm64)でさくらのDNSつかいたかった...](https://qiita.com/SNAMGN/items/4d6a438688bdc70cdc2c)]を投稿致しましたが、なんとかギリギリGWと言い張れなくもないうちにcert-managerのDNS01 - webhook プロバイダのさくらのクラウドDNS実装ができましたので投稿します。
[snmagn/cert-manager-webhook-sacloud](https://github.com/snmagn/cert-manager-webhook-sacloud)

# ご利用にあたって
cert-managerのDNS01のwebhookプロバイダを使用する場合は以下のページが参考になります。
上記リポジトリの[README](https://github.com/snmagn/cert-manager-webhook-sacloud)にも利用の仕方を記載してますので、合わせてご覧ください。
- [Configuring DNS01 Challenge Provider](https://cert-manager.io/next-docs/configuration/acme/dns01/)
- [Webhook](https://cert-manager.io/next-docs/configuration/acme/dns01/webhook/)

# 色々~~苦労した~~面白かったこと
まず、Go言語に今まで触れてこなかったんで、文法やら考え方やらは戸惑いました！
クラスないのに、レシーバってなんぞやとか。今回である程度慣れることができたのは良い経験になったかも。でも、もっと奥が深いみたいなので、別の目標立ててまたなんかやりたいなー。

次はkubernetesに連携するプログラムを作成する際のデバッグ方法が最初分からなくて苦労しました。デバッグログをうまく捌ける様になってからは大分効率よくできる様になりましたが。libsacloud/v2の使用方法も最初分からなくて随分苦労しました。ビルド通る様になってマルチアーキテクチャのdockerイメージの作成に成功したときは感動しましたね。Goとdocker buildxの連携はすげぇ。

最後はkubernetesのRBAC周りのところには引っかかりました。既に実装終わったつもりでいたら、cert-manager-webhook-sacloudのServiceAccountがさくらのクラウドDNSに接続するためのアクセストークン情報を格納したSecretにアクセスできずになぜだ...?と考えたり。
この辺は結局、元のテンプレのhelmチャート通りだと使いづらかったので、roleを追加したり、他にも細々と変更を加えて対応しましたが、この辺も今となっては良い勉強になりました。

こんな苦労しなくても既製のサービス使えばもっと楽なんですけどね！
でも、色々と中身をみながら実装するのは、やはり技術畑の人間としては楽しくてしょうがない...
Error: ENOSPC: System limit for number of file watchers reachedへの対処方法

環境
OS:Ubuntu18.04
Node.js:12.16.1
npm:6.13.4

Linuxで監視できるファイル数の制限を超えると発生するエラー

監視ファイル数を確認する

```
$ cat /proc/sys/fs/inotify/max_user_watches
=> 8192
```

一時的に制限を設定する場合

```
$ sudo sysctl fs.inotify.max_user_watches = 524288
$ sudo sysctl -p
```

永続的に制限を設定する場合

```
$ echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf
fs.inotify.max_user_watches=524288

$ sudo sysctl -p
=> fs.inotify.max_user_watches = 524288
```

参考
https://github.com/guard/listen/wiki/Increasing-the-amount-of-inotify-watchers#the-technical-details
クライアントからMySQLに繋がらない場合の設定

MySQLサーバの構築中に、クライアントPCからMySQLに接続できない事が有ったので、
備忘録のため記事にしました。（※ファイアウォール等のネットワーク環境は問題無しという前提です。）

MySQLのバージョン：8.0.20-0ubuntu0.19.10.1 for Linux on aarch64
状況を図で表すとこんな感じ。
![コメント 2020-05-10 163822.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/520421/d7463468-dfdc-980c-77ae-6b7cc338a48b.jpeg)

使用しているディストリビューションやバージョンにより異なるのかもしれませんが、
MySQLサーバをインストールすると、デフォルトではlocalhostからの接続しか許可していないよいうです。
なので、サーバのターミナルからはmysqlに接続できるが、クライアントからは接続できないという事が発生します。

サーバのターミナルで、`ss -antu`コマンドを打って、待ち受け中のポートを確認してみましょう。
（ssコマンドが無い場合はインストールしてください。Debian系の場合は`sudo apt install iproute2`。）
Local Address:Port が `127.0.0.1:3306` になっており、localhostからの3306ポートしか待ち受けていないことが分かります。
こいつを、全てのIPアドレスからの3306ポートを待ち受けるように変更しなければなりません。
![コメント 2020-05-10 162708.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/520421/f2a3f1b7-49b2-468e-8b31-515659ad2fc6.jpeg)

変更する設定ファイルは、`/etc/mysql/mysql.conf.d/mysqld.cnf` です。
`mysqld.cnf`を開くと下記画像の2か所がコメントアウトされていますので、コメントを外します。
そして、`bind-address`の値が127.0.0.1になっていますので、これを`0.0.0.0`に変更します。
0.0.0.0は、全てのIPアドレスを表す番号です。
![Inkedコメント 2020-05-10 162828_LI.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/520421/4caae826-1d67-0f13-f174-b6e30b9747d7.jpeg)

編集し終えたら、上書き保存して、MySQLを再起動。
Debian系の場合 `service mysql restart`コマンドをたたきます。

再起動後に、もう一度サーバのターミナルで`ss -antu`コマンドを打って、待ち受け中のポートを確認してみましょう。
![Inkedコメント 2020-05-10 163107_LI.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/520421/8b7eeeda-ca66-1994-eb03-d8ff1628a238.jpeg)

`Local Address:Port`が`0.0.0.0:3306`に変わりました。
これですべてのIPアドレスからの3306ポートを待ち受けしてくれるようになりましたので、
クライアントからもMySQLサーバに接続できるようになります。
WindowsTeminal(Preview?)で開くをコンテキストメニューに追加する方法

## 諸注意とおことわり

現状WindowsTerminalには自動で追加される機能がないため自分で設定するが、今後は自動追加が実装されると思われること
また、レジストリを操作する必要があるため、ミスってふっ飛ばしても責任は取れないこと
**かなり端折ってるのでわかってる人だけ読んでくりゃれということ(画面スクショ撮るの思ったよりめんどかったねん……)**

環境は

- Windows 10

  - 1909

- WindowsTerminal

  - 0.11.1251.0

以上のことをあらかじめ明記しておく

## 目的

WindowsTerminalがちゃんと使えるレベルまでが来たらしいので、乗り換えてみようと思ったものの、目下のところ任意のディレクトリにおいて「で開く」が設定されていないため、自分で設定しようというはなし

## やりかた

1. Windowsの設定のアプリから、`アプリ実行エイリアス`でWindowsTerminalのエイリアス`wt.exe`を有効化しておく
1. レジストリエディター `regedit` を立ち上げる
1. 対象のキーは
自分のユーザーだけの場合`HKEY_CURRENT_USER\SOFTWARE\CLASSES`、
全てのユーザーに対する設定としては`HKEY_CLASS_ROOT`
それぞれの下にある`Directory\Background`の`Shell`にキーを追加する。また、フォルダを選択しておいて開くという挙動のために、`Background`と同レベルにある、`Shell`にも次のキーを設定すると良い
1. 右クリックの`新規`から`キー`追加する。キー名は任意で良い
1. 追加したキーの内容（キー選択時に右側に出る`（既定）`のキーのこと）には、実際に右クリックしたときに表示されるメニュー名を指定する e.g) `Windows Terminalで開く`など
1. 更にそのキーに対してサブキーを追加し、名前は`command`とし、そのサブキーには
`C:Users\{ユーザー名}\AppData\Local\Microsoft\WindowsApps\wt.exe new-tab -d "%V"`
と設定する。ただしこれは場合によっては違う可能ことも考えられるので、whereコマンドなどで先にwt.exeの実態がどこにあるのか調べておくと良い。（なお、whereコマンドはPoweShellでは違うコマンドレットにエイリアスされているっぽいので、PowerShel上では`cmd /c where`とやることをオススメする）
ちなみに`%V`はディレクトリを展開するプレースホルダーだそうだ
1. 以上で、右クリックメニューにWindowsTerminalで開くが追加されているはずだ

## 参考にしたぺージ

- [WindowsTerminalのエイリアスについて (@ITより)](https://www.atmarkit.co.jp/ait/articles/2003/09/news021.html)
- [コンテキストメニューに追加する方法](https://qiita.com/tatesuke/items/2b37d1ad52cd0a17abdd)
- [コマンドラインのプレースホルダーについて(Windows レジストリ 解剖記)](https://www.pg-fl.jp/program/winreg/classes.htm#ext_cmdline_placeholder)
- [コンテキストメニューの追加に関する懇切丁寧なぺージ](https://qiita.com/NumLocker/items/f8016f1aed7207b850fb)
PMP試験に出てくるOrganizational Structuresを覚えよう！

# Organizational Structuresとは
組織構造タイプのこと。組織構造によってリソースの確保方法、PMの権限の強弱が変わるぞ！

## PMBOKのどこに出てくるのか
PMBOKガイドの`47ページ`の`Table 2-1`に出てくるぞ！

## 組織構造タイプとPM権限
- Organic / Simple
    - PM権限は弱い
- Functional
    - PM権限は弱い
- Multi-divisional
    - PM権限は弱い
- Matrix - strong
    - PM権限はそこそこ強い
- Matirx - weak
    - PM権限は弱い
- Matrix - balanced
    - PM権限は弱い
- Project-oriented
    - PMは最強権限を与えられる
- Virtual
    - PM権限は弱い
- Hybrid
    - 場合による
- PMO
    - PM権限は強い

----

おのれFunctional Leader！
matplotlibにおいて確率密度関数とヒストグラムを重ねて描写する際の注意点

ヒストグラムと確率密度関数を重ねて描写したいと思ったときに最初きれいに重ねることができなかったのでそのときの解決策をメモとして残す。
#原因
numpy.randomで生成される乱数は生成数によってはヒストグラムの面積が1よりも大きくなってしまうこと。
#解決策
- ヒストグラムを標準化
- 確率密度関数の面積をヒストグラムに合わせる

###ヒストグラムを標準化
```python
import numpy as np
import matplotlib.pyplot as plt
from scipy.stats import norm
n = 2000 #データ数

data = np.random.randn(n)
plt.hist(data, range=(-3, 3), bins=60, alpha=0.5, density=True)
#階級幅0.1　総データ数2000, 縦軸を相対度数密度としたヒストグラム
x = np.linspace(-3, 3, 61)
#0.1刻みの数列を生成
plt.plot(x, norm.pdf(x), c='r')
```

縦軸を度数ではなく相対度数密度とすることで面積を1にした。

```math

階級幅w, 階級n, 度数D_nとした元の面積S\\

S=\sum_{n}D_nw\\

相対度数は\\D_n^R=\frac{D_n}{\sum_{n}D_n}\\
相対密度度数は\\

\begin{aligned}
D_n^{'}&=\frac{D_n^R}{w}\\
&={\frac{D_n}{\sum_{n}D_n}} \times {\frac{1}{w}}\\
&=\frac{D_n}{S}\\
\end{aligned}\\
相対密度度数を用いたヒストグラムの面積S^{'}\\
\begin{aligned}

S^{'}&=D_n^{'}\\
&=\frac{\sum_{n}D_n}{S}\\
&=\frac{S}{S}\\
&=1
\end{aligned}
```

###確率密度関数の面積をヒストグラムに合わせる
```python
import numpy as np
import matplotlib.pyplot as plt
from scipy.stats import norm
n = 2000 #データ数

data = np.random.randn(n)
plt.hist(data, range=(-3, 3), bins=60, alpha=0.5)
#階級幅0.1　総データ数2000, 縦軸を相対度数密度としたヒストグラム
x = np.linspace(-3, 3, 61)
#0.1刻みの数列を生成
plt.plot(x, n*0.1*norm.pdf(x), c='r')
#0.1は階級幅
```
確率密度関数をヒストグラムの面積倍することで面積を合わせた。

```math
確率密度関数f(x), ヒストグラムの総データ数n,階級幅wとする。\\
f(x)は以下の式を満たす\\
\begin{aligned}
\int f(x) dx = 1
\end{aligned}\\
両辺にn\times wをかけることでヒストグラムの面積n\times wにすることができる。\\
よって変換後の確率密度関数f^{'}(x)は\\
f^{'}(x)=n\times w \times f(x)
CSSが二重に読み込まれてしまっている状態の解決

下記のようにcssが重複している状態の際の、解決方法をメモ。

<img width="434" alt="e2cab61830641e9aafa39d226f39ef29.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/635167/a5083f6d-d042-fa4e-b4fb-57ed324334c4.png">


原因はapplication.scssの記述によるもの。

```scss
/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS/SCSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *
 *= require_tree .
 *= require_self
 */
 @import "reset";
 @import "scaffolds";
 @import  "items";
```

Railsにおいて、CSSファイルが読み込まれている理由は、
application.cssファイルに *= require_tree .というコードが、コメントアウトで
記述されているためである。

そのため、SCSSを記載する際に@importを記載すると二重になってしまっていた。
そのため、

```scss
 @import "reset";
 @import "scaffolds";
 @import  "items";
```
この必要なscssの記載のみにすることで回避できました。


上記の違いについては、下記記事が参考になります。

▼requireと@importのそれぞれの仕組みの違い
https://qiita.com/okamoto_ryo/items/1ceaf4ebca2ae3c256bc
GCP-ACE試験対策[料金計算ツールを使用して GCP プロダクトの使用量を計画し、見積もる]

> 料金計算ツールを使用して GCP プロダクトの使用量を計画し、見積もる

今回は、これについて。

こちらかな？ 
[Google Cloud Pricing Calculator](https://cloud.google.com/products/calculator?authuser=3&hl=ja)
諸々入力すると、見積もりが出てくる。

<img width="1054" alt="スクリーンショット 2020-05-10 16.45.34.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/623009/01805d05-b82a-ef8f-3d21-26ec853494fd.png">
PHPの基礎　勉強メモ

#コードを書いてる際に気になったこと。

##session_start
新しいセッションを開始、あるいは既存のセッションを再開する

###参考
https://www.php.net/manual/ja/function.session-start.php

##filter_input
指定した名前の変数を外部から受け取り、オプションでそれをフィルタリングする

###返り値
成功した場合は要求された変数の値、フィルタリングに失敗した場合に FALSE、 あるいは変数 variable_name が設定されていない場合に NULL を返します。
フラグ FILTER_NULL_ON_FAILURE が指定されている場合は、変数が設定されていなければ FALSE、 フィルタリングに失敗したら NULL を返します。

###参考
https://www.php.net/manual/ja/function.filter-input.php



# ドットインストールでの勉強メモ

関数で返り値がない場合は、voidをつける

```
function ($tmp) :void{
   echo 'test';
}
```
DjangoアプリをApache2でデプロイしたら静的ファイルを読まなくなったとき

Djangoアプリをtutorial通り作って本番環境にデプロイしたらCSSや画像ファイルを読まなくなった場合の対処方法をメモします。

このスライドが分かりやすいのでこっちを読んだ方が良いかも
https://tell-k.github.io/djangocongressjp2019/#43

## 1. Djangoの静的ファイルの取り扱い

Djangoでは静的ファイルの扱いが開発中と本番環境で違います。これを切り替えるのがsetting.pyのDEBUG = True/Falseです。

#### DEBUG = Trueのときの/static/

djangoはアプリごとにフォルダ分けして開発するように作られていますので、静的ファイルであるCSSや画像ファイルもアプリのフォルダに置くようになっています。その為、開発中を意味するDEBUG = Trueの間はsetting.pyに書いたSTATIC_URLやSTATICFILES_DIRSで指定したフォルダ以下にある /static/ という名前のフォルダをすべて /static/ というAliasで扱ってくれます。

例えばproject/app1/static/base.css みたいなファイルがあった場合、
http://hoge.com/static/base.css であるものとして扱ってくれます。


#### 本番環境でdjangoが/static/の配信をしない理由

本番環境でこの機能を使ってしまうとメインプロセスに無駄に負荷がかかってしまいますし、脆弱性の原因になり得ますので本番環境ではこの機能を切らないといけません。これを強制する為にApache2などでDjangoアプリをデプロイすると、DEBUG = Falseにしないとサンプル画面しか表示されないようになっています。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/277233/d5ff3be2-02cd-2bea-10fc-0a084b86f538.png" width=50%>

#### DEBUG = Falseのときの/static/

DEBUG = TrueのときはDjangoが/static/というAliasで静的ファイルを提供していましたがDEBUG = Falseになると提供しなくなるので、先程の例で言うとhttp://hoge.com/static/base.css は存在しないという事になります。これをApacheなどで提供してやれば開発中と同じ動作が得られます。

## 2. Apache2の設定手順

python manage.py collectstaticで静的ファイルを1箇所に集めて、集めた場所をApache2が/static/として配信するようにapahce2.confに書きます。<a href="https://tutorial.djangogirls.org/ja/">Django Girls Tutorial</a>でやってるやり方と同じです。

#### 2-1. 静的ファイルを1箇所に集める

以下のようにプロジェクト直下にstaticというフォルダを作って集めてやります。

```:/home/xxxx/django/proj1/
proj1
├── manage.py
├── mysite
│   ├── __init__.py
│   ├── settings.py
│   ├── urls.py
│   └── wsgi.py
├── myvenv
│   └── ...
├── static 静的ファイルを集める場所
│   ├── hoge.jpg
│   └── base.css
└── requirements.txt
```

静的ファイルを集める場所(STATIC_ROOT)を指定します。
以下では/home/xxxx/django/proj1/static/がSTATIC_ROOTになります。

```python:proj1/mysite/setting.py
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
```

collectstaticsコマンドを実行するとSTATIC_ROOTのPATHに静的ファイルを集めてくれます。

```terminal:terminal
cd /home/xxxx/django/proj1
python manage.py collectstatics
```

#### 2-2. 静的ファイルの場所をapache2.confに追加

/home/xxxx/django/proj1/static/base.css をhttp://hoge.com/static/base.css として扱いたいのでフォルダにAliasを付けてアクセス許可(Require all granted)します。

```:/etc/apache2/apache2.conf
Alias /static/ /home/xxxx/django/proj1/static/
<Directory /home/xxxx/django/proj1/static>
    Require all granted
</Directory>
```
設定を変更したのでApache2を再起動します。

```terminal:terminal
sudo /etc/init.d/apache2 restart
```

#### 2-3. 上手くいかない場合

collectstaticsは単にファイルをコピーするだけなので、STATIC_ROOTにファイルがコピーされているか確認すれば動作の確認が出来ます。

Apache2の登録が上手く出来ていない場合は、Apache2のエラーログに Django wsgi Apache2: 'AH01630: client denied by server configuration' が出る筈です。apache2.confの内容がSTATIC_ROOTと同じになっているか確認してください。

デフォルト設定のままならApache2のエラーログは以下で見られます。

```terminal:terminal
tail -f /var/log/apache2/error.log
```
Mac + Google 日本語入力で 円マークではなくバックスラッシュを入力する設定

右上のアイコンから設定に進んで、設定する

![image](https://user-images.githubusercontent.com/13635059/81466069-8875bd80-9209-11ea-87af-6484cc4d22fa.png)


# Original by Github issue

https://github.com/YumaInaura/YumaInaura/issues/3159











<!-- Update From Qiita API -->

# チャットメンバー募集


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

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





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->
MySQLでGROUP BYしたカラムの値が変わる

以下のような`members`というテーブルがあります。

```sql
SELECT * FROM members;
```

```
+----+--------+------+-------+
| id | name   | age  | adult |
+----+--------+------+-------+
|  1 | ichiro |   11 |  NULL |
|  2 | jiro   |   22 |     1 |
|  3 | saburo |   33 |     1 |
+----+--------+------+-------+
3 rows in set (0.00 sec)
```
年齢と、成人(`age>=20`)なら`1`になるカラムがあるだけの、とても単純なテーブルのようです。

この中に成人が何人いるか`GROUP BY`で集計してみましょう。

```sql
SELECT adult, COUNT(*) FROM members GROUP BY adult;
```

```
+-------+----------+
| adult | COUNT(*) |
+-------+----------+
|  NULL |      129 |
|     0 |        2 |
+-------+----------+
2 rows in set (0.00 sec)
```

...のように、

- `NULL`は1人なのに、129人もいる事になっている
- `1`が2人のはずなのに、`0`が2人という事になっている

という意味不明な結果が得られてしまいました。

## 詳細
どうやら下記の条件を満たすと再現するようです。

- MySQL5.6
    - MySQL5.7では発生せず
- 照合順序が明示されたDBをまたいでViewを貼る
- 数値と`CAST(NULL AS UNSIGNED)`を混同したカラムをGROUP BYで集計する
    - 文字列との混同や、単なるNULLでは起きない
    - GROUP BYを使わなくても起きない

### 再現手順
dockerを使います。
下記のような`docker-compose.yml`を作成します。

```yml:docker-compose.yml
version: "3"
services:
  db:
    image: mysql:5.6
    environment:
      MYSQL_ALLOW_EMPTY_PASSWORD: 1
```
ビルドして中に入ります。

```
$ docker-compose up -d
$ docker-compose run --rm db mysql -u root -h db
```

MySQLに入ったら、まず参照元のデータベースを作成します。

```sql
CREATE DATABASE my_source_db CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci;
USE my_source_db;

CREATE TABLE source_members (
  id   INT PRIMARY KEY AUTO_INCREMENT,
  name VARCHAR(20),
  age INT,
  INDEX(id)
);

INSERT into source_members (name, age) VALUES ('ichiro', 11);
INSERT into source_members (name, age) VALUES ('jiro', 22);
INSERT into source_members (name, age) VALUES ('saburo', 33);
```

次に、問題のViewを作成します。

```sql
CREATE DATABASE my_db CHARACTER SET utf8mb4 COLLATE utf8mb4_general_ci;
USE my_db;

CREATE OR REPLACE VIEW members AS (
  SELECT
    id,
    name,
    age,
    CASE WHEN age >= 20 THEN 1 ELSE CAST(NULL AS UNSIGNED) END AS 'adult'
  FROM my_source_db.source_members
);
```

この状態で、冒頭の`SELECT adult, COUNT(*) FROM members GROUP BY adult`を実行すると発生します。

## 対策案
原因は不明なのですが、`CAST(NULL AS UNSIGNED)`を単なるNULL等に変更すること等で解消するようです。

```sql
CREATE OR REPLACE VIEW members AS (
  SELECT
    id,
    name,
    age,
    CASE WHEN age >= 20 THEN 1 ELSE NULL END AS 'adult'
  FROM my_source_db.source_members
);
```

```sql
SELECT adult, COUNT(*) FROM members GROUP BY adult;
```

```
+-------+----------+
| adult | COUNT(*) |
+-------+----------+
|  NULL |        1 |
|     1 |        2 |
+-------+----------+
2 rows in set (0.00 sec)
```
java.nio.file.AccessDeniedException: glassfish/domains/domain1/logs/server.log.lckとなった時の対応方法

- 環境
    - CentOS Linux release 7.8.2003 (Core)
    - Payara Server  5.194
    - openjdk version "11.0.7"

# 事象 : Payaraを起動しようとしたら怒られた

```bash
$ asadmin start-domain domain1
java.nio.file.AccessDeniedException: /opt/payara5/glassfish/domains/domain1/logs/server.log.lck
    at java.base/sun.nio.fs.UnixException.translateToIOException(UnixException.java:90)
    at java.base/sun.nio.fs.UnixException.rethrowAsIOException(UnixException.java:111)
    at java.base/sun.nio.fs.UnixException.rethrowAsIOException(UnixException.java:116)
    at java.base/sun.nio.fs.UnixFileSystemProvider.newFileChannel(UnixFileSystemProvider.java:182)
    at java.base/java.nio.channels.FileChannel.open(FileChannel.java:292)
    at java.base/java.nio.channels.FileChannel.open(FileChannel.java:345)
    at java.logging/java.util.logging.FileHandler.openFiles(FileHandler.java:511)
    at java.logging/java.util.logging.FileHandler.<init>(FileHandler.java:341)
    at com.sun.enterprise.admin.launcher.GFLauncherLogger.addLogFileHandler(GFLauncherLogger.java:114)
    at com.sun.enterprise.admin.launcher.GFLauncher.setup(GFLauncher.java:227)
    at com.sun.enterprise.admin.servermgmt.cli.StartDomainCommand.createLauncher(StartDomainCommand.java:250)
    at com.sun.enterprise.admin.servermgmt.cli.StartDomainCommand.executeCommand(StartDomainCommand.java:142)
    at com.sun.enterprise.admin.cli.CLICommand.execute(CLICommand.java:340)
    at com.sun.enterprise.admin.cli.AdminMain.executeCommand(AdminMain.java:360)
    at com.sun.enterprise.admin.cli.AdminMain.doMain(AdminMain.java:294)
    at org.glassfish.admin.cli.AsadminMain.main(AsadminMain.java:56)
Waiting for domain1 to start .Error starting domain domain1.
The server exited prematurely with exit code 1.
Before it died, it produced the following output:

Launching Payara Server on Felix platform
Exception in thread "main" java.lang.RuntimeException: the domain directory is not writable.
    at com.sun.enterprise.glassfish.bootstrap.MainHelper.verifyDomainRoot(MainHelper.java:235)
    at com.sun.enterprise.glassfish.bootstrap.MainHelper.findInstanceRoot(MainHelper.java:338)
    at com.sun.enterprise.glassfish.bootstrap.GlassFishMain.main(GlassFishMain.java:90)
```

# 原因 : glassfishディレクトリに権限がないから
[problem to start GlassFish server - Ask Ubuntu](https://askubuntu.com/questions/1038097/problem-to-start-glassfish-server)

## 対応 : glassfishディレクトリの権限を変更する

```bash
# ディレクトリ配下まで再帰的(-R)に権限を変更する
$ sudo chmod -R 777 /opt/payara5/glassfish
[sudo] password for ponsuke: 

# もう一度起動したら起動した
$ asadmin start-domain domain1
Waiting for domain1 to start .......
Successfully started the domain : domain1
domain  Location: /opt/payara5/glassfish/domains/domain1
Log File: /opt/payara5/glassfish/domains/domain1/logs/server.log
Admin Port: 4848
Command start-domain executed successfully.
```
【Rails】デプロイ後に「We're sorry, but something went wrong.」のエラーが出る

Railsでアプリを作成し、AWSにデプロイした際に不具合があるとこんなエラー画面が表示されます。
こいつめっちゃ腹立ちますよね。だってどこがおかしいのかすぐに教えてくれないんですよ。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/608061/601560cd-6af0-02e9-16e8-d74cf9a35d57.png)

#エラー原因の確認方法

しょうがないので自分で何がおかしいのかを確認します。

```Rails:ターミナル
[ec2-user@ip-~~]$ cd /var/www/(アプリ名)/current/
[ec2-user@ip-~~ current]$ less log/production.log
```



ログを見ていくと、下記のようなエラー文を発見


*ActionView::Template::Error (The asset "(画像ファイル名)" is not present in the asset pipeline.):*


今回は画像ファイルの読み込みで何か問題が起きていることを特定します。

#原因
作成中のアプリでは、画像ファイルは下記に保管し、image_tagによって開発環境（ローカル）では問題なく表示されていました。

```Rails:画像ファイル保管先
app/assets/images
```
```Ruby:haml(html)ファイル
= image_tag("ファイル名")
```

ではなぜ本番環境では読み込みができていないのか？
それは**開発環境と本番環境でimagesディレクトリへのパスが異なるためです。**
デプロイを実行すると、アセットパイプラインという機能によって画像ファイルやCSSファイルがコンパイル（圧縮）されます。すると、以下のようにimagesディレクトリへのパスが変化します。

```
アセットコンパイル前(開発環境）
app/assets/images

アセットコンパイル後（本番環境）
public/assets/images
```

#解決方法
HTMLファイルにはasset_pathを、CSSファイルにはimage-urlを適用することで、開発環境でも本番環境でも問題なく画像を表示することができます。

```ruby:HTMLファイル
image_tag asset_path('ファイル名')
#ファイル名には「.jpg」など拡張子を忘れずに！
```

```css:cssファイル
background-image: image-url("ファイル名");
#ファイル名には「.jpg」など拡張子を忘れずに！
```

***
今回は画像の読み込みに関するエラーでしたが、デプロイ時のエラーはEC2インスタンスや
Unicorn, nginx, SQLの再起動などで解消するケースもあるみたいです。
まずは、ログを見に行って原因を特定することが大事ですね。
UIFLOW GPIO at ATOM Matrix

# はじめに
ATOM Matrixを使って、UIFLOWでGPIOを制御してみました。制御対象はGrove PIR Motion Sensorです。

フローはこんな感じ。
![スクリーンショット 2020-05-10 15.27.22.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/634816/1a4c173d-3ab3-3ecc-f841-fedbecbd614a.png)

番号32はATOM Matrixに書いてあったもの。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/634816/6f184a8a-45e3-83c7-32df-bac52d0d97d7.png)

センサー（裏）の接続の様子。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/634816/32de77df-c246-0437-a507-ad0f3a960b53.png)


# 動作
<blockquote class="twitter-tweet"><p lang="und" dir="ltr">ATOM Matrix <a href="https://t.co/t7Ap6r4UdC">pic.twitter.com/t7Ap6r4UdC</a></p>&mdash; HT (@infinite1oop) <a href="https://twitter.com/infinite1oop/status/1259379622078107648?ref_src=twsrc%5Etfw">May 10, 2020</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>


# 参考URL
[ATOM Matrix・ATOM Lite を UIFlow で制御してみる（ #M5Stack ）- Qiita](https://qiita.com/youtoy/items/17739b7f4197a8d3fa4d)
お世話になりました。
M5Stack Basic/Gray + ArduinoHttpClient.h で 'HTTPClient' was not declared in this scope が発生したら

ちゃんと理解できてないけど「なぜか動いた」系エントリーなので、解説を加えていたたげると大変ありがたいと思いつつ、同じようなことで困ってる方がもしいたらと思い公開したエントリーです。

Wi-Fi のみならず Ethernet や GSM(セルラー通信) でも HTTP 通信を簡単に実装できる [`ArduinoHttpClient.h`](https://github.com/arduino-libraries/ArduinoHttpClient) ですが、M5Stack Basic/Gray にて利用しようとすると、以下のようなコンパイルエラーが発生します。

```
C:\Users\USERNAME\Documents\Arduino\libraries\M5Stack\src\M5Display.cpp: In member function 'void M5Display::drawPngUrl(const char*, uint16_t, uint16_t, uint16_t, uint16_t, uint16_t, uint16_t, double, uint8_t)':
Arduino\libraries\M5Stack\src\M5Display.cpp:543:3: error: 'HTTPClient' was not declared in this scope
   HTTPClient http;
   ^

Arduino\libraries\M5Stack\src\M5Display.cpp:545:7: error: 'WiFi' was not declared in this scope
   if (WiFi.status() != WL_CONNECTED) {
       ^

Arduino\libraries\M5Stack\src\M5Display.cpp:545:24: error: 'WL_CONNECTED' was not declared in this scope
   if (WiFi.status() != WL_CONNECTED) {
                        ^

Arduino\libraries\M5Stack\src\M5Display.cpp:550:3: error: 'http' was not declared in this scope
   http.begin(url);
   ^

Arduino\libraries\M5Stack\src\M5Display.cpp:553:19: error: 'HTTP_CODE_OK' was not declared in this scope
   if (httpCode != HTTP_CODE_OK) {
                   ^

Arduino\libraries\M5Stack\src\M5Display.cpp:559:3: error: 'WiFiClient' was not declared in this scope
   WiFiClient *stream = http.getStreamPtr();
   ^

Arduino\libraries\M5Stack\src\M5Display.cpp:559:15: error: 'stream' was not declared in this scope
   WiFiClient *stream = http.getStreamPtr();
               ^
```
(M5Stack 0.3.0, 0.3.1 にて確認)

### 原因と回避方法

これは M5Stack-Core-ESP32 に同梱されている `HTTPClient.h` が組み込まれてない事が要因であるため、以下のように

```
#include <M5Stack.h>
#include <HTTPClient.h>  # <= 追加した行
```

と明示することでコンパイルできるようになります。

### 解せぬ点。

よくわからないのが [`M5Stack\src\M5Display.cpp` では `#include <HTTPClient.h>` と指定されている](https://github.com/m5stack/M5Stack/blob/0.3.0/src/M5Display.cpp#L439)ことから、 `#include <M5Stack.h>` の時点で include されても良さそうなのだが、同エラーが発生してしまう。解せぬ。

## あとがき

解せぬよ。

EoT