OmniAICreator/Qiita-1.07M huggingface dataset:
PG::ConnectionBad を解決する！

## はじめに

Railsアプリ開発中に、`rails s`でサーバー立ち上げた際以下のエラーが、、、

```ruby:ターミナル
PG::ConnectionBad (FATAL:  role "root" does not exist):
```
## PG::ConnectionBadってなに？

このエラーが出る原因は色々あるようですが、簡単にいうと**PostgreSQLと接続できませんよ！**ってことみたいです。


### 原因
今回のエラーではrootと言う名前のロールがないのが問題のよう。
※ちなみにPostgreSQLで言う**ロール**とは、ざっくりいうとログイン権限を持つユーザのことです。

## 解決手順
### 結論
`root`という名前のロールを作成して権限を与えるだけ！

### ロールを作成
まずはDBへ接続

```ruby:ターミナル
psql -d postgres
```





rootのロールを作成

```SQL:PostgreSQL
postgres=# CREATE ROLE root WITH LOGIN PASSWORD 'root';
```



続いて`psql`コマンドでロールの情報を表示

```SQL:PostgreSQL
postgres=# \du

                                 List of roles
 Role name |                         Attributes                         | Member of
-----------+------------------------------------------------------------+-----------
 riku10    | Superuser, Create role, Create DB, Replication, Bypass RLS | {}
 root      |                                                            | {}
```

`Role name`が`root`のものが追加されてますね。しかし、この段階ではまだ権限は与えられていません。

### 権限を与える
`Role name`が`riku10`の時のみ、`Create role`の権限がついているため、ユーザネーム`riku10`でDBに接続します。

```ruby:ターミナル
psql -U riku10 -d postgres
```

接続後、権限を付与します。

```SQL:PostgreSQL
ALTER ROLE root SUPERUSER CREATEDB;
```

もう一度`\du`でロールの情報を確認してみましょう。

```SQL:PostgreSQL
postgres=# \du
                                   List of roles
 Role name |                         Attributes                         | Member of
-----------+------------------------------------------------------------+-----------
 riku10    | Superuser, Create role, Create DB, Replication, Bypass RLS | {}
 root      | Superuser, Create DB                                       | {}
```

きちんと権限も付与できていますね。

## さいごに

これで`rails db:migration`を行った後、`rails s`を行うことできちんとサーバーを起動できるはずです。

絶対忘れると思ったのですぐ記事にしました！
この記事が同じように困っている人の助けになれば嬉しいです。
Vitis HLS と Vivado で作った回路を PYNQ を使って FPGA 上で動かすまで ー②シミュレーションをするー

諸事情あり，このページは以下のページに移行しました．
ご愛読ありがとうございます．

https://blog.n-hassy.info/2021/05/vitis-hls-to-fpga-2/
Laravelのコードをワンライナーで実行する

GitHub Actions上でLaravelのコードを実行して設定内容が正しく反映されているか確認したい欲求がありました。

```shell-session
$ php artisan tinker -h
Description:
  Interact with your application

Usage:
  tinker [options] [--] [<include>...]

Arguments:
  include                  Include file(s) before starting tinker

Options:
      --execute[=EXECUTE]  Execute the given code using Tinker
  -h, --help               Display help for the given command. When no command is given display help for the list command
  -q, --quiet              Do not output any message
  -V, --version            Display this application version
      --ansi               Force ANSI output
      --no-ansi            Disable ANSI output
  -n, --no-interaction     Do not ask any interactive question
      --env[=ENV]          The environment the command should run under
  -v|vv|vvv, --verbose     Increase the verbosity of messages: 1 for normal output, 2 for more verbose output and 3 for debug
```

tinkerのオプションを確認すると`--execute`オプションを使うといいみたいです。

```
$ php artisan tinker --execute "dump(config('database.connections.mysql'))"
array:15 [
  "driver" => "mysql"
  "url" => null
  "host" => "db"
  "port" => "3306"
  "database" => "laravel_local"
  "username" => "phper"
  "password" => "secret"
  "unix_socket" => ""
  "charset" => "utf8mb4"
  "collation" => "utf8mb4_unicode_ci"
  "prefix" => ""
  "prefix_indexes" => true
  "strict" => true
  "engine" => null
  "options" => []
]
```

Laravelのconfig関数が実行できて、結果をdumpできました！
そうそう必要な機会はないと思いますが、知っておくと便利なtipsです！
PowerShellでOSのバージョンを取得

以下のコマンドを実行すると、OSの関連の情報が取得できます。

```powershell
# OSの情報を取得
Get-WmiObject Win32_OperatingSystem
```

一覧の中から特定の値を取得したい場合、たとえばVersionだけを取得したい場合はこう。

```powershell
# OSのバージョンを取得
(Get-WmiObject Win32_OperatingSystem).Version
```

Windows10か否かで条件を分岐するなんてときに便利です。

```powershell
# windows10以下なら
if((Get-WmiObject Win32_OperatingSystem).Version -lt 10){
    #警告を出して中断、とかね。
}
```
グローバル変数とローカル変数

#JavaScriptにおけるグローバル変数とローカル変数

`グローバル変数`はプログラムのどこからでもアクセスができる変数のこと
一方、関数の内側で宣言した変数は`ローカル変数`と呼ばれ、どこででも使用できる変数ではない

>
`グローバル変数`や`ローカル変数`の違いと特徴を理解する上では
`スコープ`と呼ばれる概念を理解しておくことが必要とされている

##スコープとは

変数がプログラムの中のどの場所から参照できるのか、ということを決定づけるもの
要約すると`変数が使用可能な範囲`とも言える

---

**グローバル変数ではプログラムのどこからでも参照ができる**ため
全範囲がグローバル変数にとってのスコープ
>
「グローバルスコープ」

**ローカル変数では有効な範囲が限られる**ため
この限られた範囲がローカル変数にとってのスコープ
>
「ローカルスコープ」

##グローバル変数の定義

グローバル変数として定義するには、関数の`外で変数の宣言`を行う

```js:グローバル変数
const x = 1;

function fn() {
    // fn関数のスコープ外から`x`は参照可能
    console.log(x); // => 1
}
fn();
// fn関数のスコープ内から`x`は参照できる
console.log(x); // => 1
```

上記を実行すると関数の外で定義した`const x = 1;`を
**関数内・外共に参照出来た事が確認された**

##ローカル変数の定義

ローカル変数として定義するには、関数を定義し、その`中で変数の宣言`を行う

```js:ローカル変数
function fn() {
    const x = 1;
    // fn関数のスコープ内から`x`は参照可能
    console.log(x); // => 1
}
fn();
// fn関数のスコープ外から`x`は参照できないためエラー
console.log(x); // => ReferenceError: x is not defined
```

上記を実行すると関数内で定義した`const x = 1;`を
**関数内では参照することが可能だったが、関数の外では参照が出来なかった事が確認された**
最初の記事

最初の記事を書いてみます。

こんにちは、Y子です。

新年度なので、情報発信の場を持ちたいと考え、Qiitaにアカウントを作ってみました。
Qiitaに記事を書くのも初めて。こんな感じになるんですね。![Screenshot_2021-04-01 Qiita.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1265690/60d094df-45e7-4eb0-a291-33dd0fe0f5a7.png)

画像も簡単に入れられて感激です。

学んだことを記録していきたいと思います。

よろしくお願いいたします。
スマホで表示した時のみテキストを改行する方法

テキストの改行でPCだとこのままでいいんだけど、スマホだと改行したい時はありませんか？

私はよくあります。
PCではいい感じでできているのに、スマホ表示にしてみるとなんだかブサイクになってしまう。
そんな時に取り入れたいのが、スマホの時だけ改行する方法。

それでは、見ていきましょう！


#スマホの時だけ改行するCSS

まずはHTMLのテキストです。

```index.html
<p>このテキストを、<br class="kai">改行する！</p>
```

クラスのkaiで改行を入れたいと思います。CSSは次の通りです。

```style.css
@media screen and (min-width:640px){
  .kai {
    display: none;
  }
}
```

これで画面サイズが640px以上の時、クラスkaiは表示されません＝スタイルが適用されません。
つまり、スマホで見た時は改行されています。

次は、PCの時だけ改行する方法を見ましょう。HTMLは同じものを使います。

#PCの時だけ改行するCSS

```style.css
@media screen and (max-width:639px){
  .kai {
    display: none;
  }
}
```

これで画面サイズが639px以下の場合に、スタイルが非表示になります。
つまり、スマホページではスタイルが適用されないということです。

以上がデバイスに応じたテキストの改行方法です。
カスタムコネクタをOpenAPI定義からymlファイルをインポートできないのでjson形式に変換する

## カスタムコネクタを触ってみる
Power Apps, Power AutomateカスタムコネクタでAPIでデータ取得して表示したいと思い、OpenAPIの定義をインポートして作れるらしく試してみた
ymlファイルがインポートできなかったのでjsonに変更する流れ

## 作る
カスタムコネクタは複数の作成方法があるらしい。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/462497/39e6f805-a11e-fc2a-efd4-8f4e849f020e.png)
その中にOpenAPIからインポートできるものがあるらしく試す。

### URLからOpenAPIをインポート
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/462497/4d7bfaf6-23c9-bd0a-c6c7-7887a7550cc5.png)
なぜかできないので、ダウンロードしてインポートを試す。
※yaml形式だとできるのがあったので、拡張子の問題なのかもしれない

### OpenAPIファイルをインポート
どうやらこっちはjsonファイルのインポートしか対応してないらしい
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/462497/e12e9370-1920-4ae3-9bfa-f3c1782d3531.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/462497/c7de3104-746c-e9ad-2e34-c2d626860aab.png)

### YAMLからJSONに変換
[SwaggerEditor](https://editor.swagger.io/)でできます。
左上のImport fileからインポートし、Convert and Save as JSONで変換、保存
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/462497/6060bd0c-dc07-4c7a-957b-7f66bbb4e655.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/462497/b5c15954-9bbc-2610-ad53-ac7ad9c21c94.png)
インポートできました！
【特徴量スケーリング】いつも紛らわしい「標準化」と「正規化」の違いを理解する

## はじめに
特徴量スケーリングの手法である**「標準化」と「正規化」について、原理や使い分けなどを解説いたします**。

※プログラミング関係の内容を他にも投稿していますので、よろしければ[こちら](https://qiita.com/oki_kosuke/items/34b1071224953776c211#%E6%8A%95%E7%A8%BF%E4%B8%80%E8%A6%A7)の一覧から他の投稿も見て頂けますと幸いです。

## 標準化と正規化

- **標準化(Standardization)は「平均を0、分散を1とするスケーリング手法」**
- **正規化(Normalization)は「最小値を0、最大値を1とするスケーリング手法」**

ただ、分野によっては標準化や正規化の定義も異なるようなので上記の内容がいつでもどこでも正しいというわけではないので注意が必要です。ややこしいですね…そのあたりに関しては、[こちら](https://arakan-pgm-ai.hatenablog.com/entry/2019/01/07/090000)や[こちら](https://qiita.com/karaage0703/items/f38d18afc1569fcc0418)を参照ください。


図で表すと以下のようなイメージです。（こんなにきれいに分布しているデータはないですが…）

![標準化正規化.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1057114/75f2d817-53bd-0d0d-de44-facac112c5ed.png)

### 標準化
「平均を0、分散を1」にするので、あるデータXは以下のように標準化されます。ただし、X全体の平均をμ、標準偏差をσとします。

```math
\frac{X-μ}{σ}
```

ちなみに(標準偏差)<sup>2</sup>が分散なので、分散が1のとき標準偏差も1となります。[こちら](https://qiita.com/karaage0703/items/f38d18afc1569fcc0418)を参照すると、pythonのライブラリによって分散の定義が異なる（標本分散or不偏分散）ようなのでその点は注意が必要です。なお、標本分散は各データと平均との差の二乗和をnで割るのに対して、不偏分散はn-1で割ります。

### 正規化
「最小値を0、最大値を1」のするので、（それ以外の正規化もあるようです）あるデータXは以下のように正規化されます。ただし、X全体の最大値をX<sub>max</sub>、最小値をX<sub>min</sub>とします。

```math
\frac{X-X_{min}}{X_{max}-X_{min}}
```

### 標準化と正規化の使い分け
標準化を用いる場合

- 最大値及び最小値が決まっていない場合
- 外れ値が存在する場合（外れ値が存在するデータに対して正規化を行うとスケーリングが外れ値に大きく影響されてしまいます）
- 機械学習で回帰モデルを構築する際は一般的に用いられる

正規化を用いる場合

- 最大値及び最小値が決まっている場合
- 画像処理におけるRGBの強さを扱う場合（学習コストを下げる事ができるため）

### そもそもなぜ特徴量スケーリングをするのか？
例えば線形回帰では、各説明変数の値に基づいて重みづけを行います。**各説明変数間で値が大きく異なる場合、重みづけが不均衡に働き、影響度が上手く評価できなかったりモデルの精度が下がったりする恐れがあります。**そのような悪影響を回避するために「標準化」と「正規化」といったスケーリングを行います。[こちら](https://qiita.com/yShig/items/dbeb98598abcc98e1a57)のサイトには例を示して説明がされていました。**ただ、決定木やランダムフォレストなどのtree系の回帰や分類は特徴量のスケーリングは不要とされています。**その理由としては、それらの手法は各説明変数の値の大小を分岐条件としているのでスケールに依存しないからです。

## まとめ
特徴量スケーリングの手法である「標準化」と「正規化」について、原理や使い分けなどを解説いたしました。

- **標準化(Standardization)は「平均を0、分散を1とするスケーリング手法」**
- **正規化(Normalization)は「最小値を0、最大値を1とするスケーリング手法」**

### 参考
- [AI Academy](https://aiacademy.jp/texts/show/?id=555) 
- ["BOKU"のITな日常](https://arakan-pgm-ai.hatenablog.com/entry/2019/01/07/090000)
- [Pythonで基礎から機械学習 「重回帰分析」](https://qiita.com/karaage0703/items/f38d18afc1569fcc0418)
- [機械学習でなぜ正規化が必要なのか](https://qiita.com/yShig/items/dbeb98598abcc98e1a57)
- [Feature Scalingはなぜ必要？](https://qiita.com/ttskng/items/2a33c1ca925e4501e609)
arctan

# arctan
Show how to culculate arctan

## 1. By Taylor Series
Accurate but a bit slow to use in embedded system

```arctan.js
let arctan = (x, taylorSeriesSize = 10) => {
  const pow = (x, n) => {
    if (n === 0) return 1;
    if (n === 1) return x;
    if (n % 2 === 0) {
      return pow(x * x, n / 2);
    } else {
      return x * pow(x * x, (n - 1) / 2);
    }
  };
  const n2n1 = (n) => 2 * n + 1;
  const x2n1 = (n) => pow(x, n2n1(n));
  const minus1n = (n) => (n % 2 === 0 ? 1 : -1);
  const sigma = (n, xk) => [...Array(taylorSeriesSize).keys()].map(xk).reduce((xk0, xk1) => xk0 + xk1);
  const pi = Math.PI;

  let tan_rad;

  if (x >= 1) {
    tan_rad = pi / 2 - sigma(taylorSeriesSize, (n) => minus1n(n) / (n2n1(n) * x2n1(n)));
  } else if (x <= -1) {
    tan_rad = -pi / 2 - sigma(taylorSeriesSize, (n) => minus1n(n) / (n2n1(n) * x2n1(n)));
  } else {
    tan_rad = sigma(taylorSeriesSize, (n) => (minus1n(n) * x2n1(n)) / n2n1(n));
  }

  return (tan_rad / pi) * 180;
};
```

## 2. Suggested in Stack Overflow
Fast but inaccurate (e.g. arctan2(1.732) outputs 51°)

```.js 
let arctan2 = (x) => {
  const pi = Math.PI;
  const abs = Math.abs;
  const rad = (pi / 4) * x - x * (abs(x) - 1) * (0.2447 + 0.0663 * abs(x));
  return (rad / pi) * 180;
};
```

## Comparision
Compare required time in milliseconds

```.js
let time = (fn) => {
  const t0 = performance.now();
  fn();
  const t1 = performance.now();
  console.log(t1 - t0);
};
time(() => arctan(1.7320508))
time(() => arctan2(1.7320508))
```
Javaでオセロゲームを作る

Tech academy サイト参考にJava復習したかったので、オセロゲームを作ろうとしました。

https://techacademy.jp/magazine/22228

Board.javaクラスファイルと
Othello.javaの実行ファイル作成。

だが実行するとシンボルを見つけられませんとのエラーが出る。


シンボルエラーもTech Academyサイトで復習した

https://techacademy.jp/magazine/46766#sec2

が、何故Othelloでエラーが出るのか不明という状態
Slack未経験者必見！もの凄く簡単にSlackにお問い合わせ内容を送信する方法

こんにちは、アッキーです。

今回はJavascriptとSlackを連携させてみたいと思います。

お問い合わせなどのお知らせ通知を作ります。

#はじめに#

Slackでの会員登録を行ってください。

また、Webhook用のURLは各自で取得してください。

取得方法が分からない方は下記の記事が参考になると思います。

・[SlackのWebhook URL取得手順](https://qiita.com/vmmhypervisor/items/18c99624a84df8b31008)

それでは説明していきます！

#入力フォームの値を取得#

今回は入力フォームから値を取得し、その値をSlackで確認します。

まずは、入力フォームの値を取得。

```JavaScript
const name = document.querySelector('#name').value
const email = document.querySelector('#email').value
const description = document.querySelector('#description').value
```

#Payloadの作成#

次は、Slackに送信する際にどのようなお問い合わせが来たかが一目でわかるようにpayloadの作成を行います。

```JavaScript
const name = document.querySelector('#name').value
const email = document.querySelector('#email').value
const description = document.querySelector('#description').value

const payload = {
  text: 'お問い合わせが来ました\n'
    + 'お名前: ' + name + '\n'
    + 'メールアドレス: ' + email + '\n'
    + '問い合わせ内容\n' + description
}
```

#Slackへ送信#

最後に``fetch``メソッドでSlackへ送信します。

```JavaScript
const name = document.querySelector('#name').value
const email = document.querySelector('#email').value
const description = document.querySelector('#description').value

const payload = {
  text: 'お問い合わせが来ました\n'
    + 'お名前: ' + name + '\n'
    + 'メールアドレス: ' + email + '\n'
    + '問い合わせ内容\n' + description
}
const url = 'WebhookのURL'
  fetch(url, {
      method: 'POST',
      body: JSON.stringify(payload)
  }).then(() => {
      // 成功
  }).catch(() => {
      // 失敗
})
```

実際にSlackへの送信が成功した場合、通知がきてお問い合わせの内容が見れます。

このようにしてSlackへ送信することができます！

ちなみにSlackはブラウザ版だとほとんどの場合、通知が来ないのでデスクトップ版をダウンロードすることをおススメします。

いかがだったでしょうか？

意外と簡単！

以上、「Slack未経験者必見！Slackにお問い合わせ内容を送信する方法」でした！

Thank you for reading
Flutter環境構築まとめ

## 基本的には公式ドキュメントを参照
https://flutter.dev/docs/get-started/install/macos

## 英語で訳わかんねぇよ！って方は、こちらの記事を参照しましょう。
https://zenn.dev/kboy/books/ca6a9c93fd23f3/viewer/5232dc
**※バージョンアップで変わる可能性もあるので、
わからないなりに公式ドキュメントを見つつ、
日本語記事を参考にするというのがオススメです。**

## 補足

ここからはエラーだったり、

環境構築する際に役に立つものをまとめておきます。

* [Finderからpathをコピーする方法](
https://tcd-theme.com/2020/11/mac-file-path.html?gclid=EAIaIQobChMIgJvY94Hc7wIVlJvCCh08UQrqEAAYASAAEgJFjPD_BwE)
* 「Warning: CocoaPods not installed. Skipping pod install.」とエラーが出る
    * [Flutterでの「Warning: CocoaPods not installed. Skipping pod install.」エラー対応備忘録](https://zenn.dev/qst/scraps/fd0a0cf8fed966)
    * そもそもCocoaPods入ってなくない？？
        * [CocoaPods導入手順](https://qiita.com/ShinokiRyosei/items/3090290cb72434852460)

* iosエミュレーターを認識してくれない

```
$ sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
```
上記を入れると認識するようになる。

* [Homebrewのインストール](https://qiita.com/zaburo/items/29fe23c1ceb6056109fd)
* zshが入ってない
    * [zshとは？インストール方法を超丁寧に解説](https://suwaru.tokyo/%E3%80%90mac-linux%E3%80%91zsh%E3%81%A8%E3%81%AF%EF%BC%9F%E3%82%A4%E3%83%B3%E3%82%B9%E3%83%88%E3%83%BC%E3%83%AB%E6%96%B9%E6%B3%95%E3%82%92%E8%B6%85%E4%B8%81%E5%AF%A7%E3%81%AB%E8%A7%A3%E8%AA%AC/#anc_13)




他に何か困ったことがあればコメントもらえれば追記します。
最新版　MacにXAMPPを導入する手順


初めましてyumaです。

Laravel6の環境を構築するにあたりXAMPPを導入して欲しいと会社から指示があった為、MacにXAMPPを導入します。
MacにはMAPPの方が良いみたいですが、僕と同じようにMacにXAMPPを導入する方もいると思うので参考になれば幸いです。

という事でまずはXAMMPをインストール
https://www.apachefriends.org/download.html
![スクリーンショット 2021-03-31 22.26.47.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1263774/02e93188-c55e-07f6-8503-5a88c3bd18cf.png)
Macは上記の上から３番目、8.03/PHP 8.03 164Mbをダウンロードしましょう。(2021/04/01現在)

ダウンロードが完了したらsourceforgeのサイト
https://sourceforge.net/projects/xampp/files/
へ飛びます。

「XAMPP Mac OS X」、「8.0.3」、「xampp-osx-8.0.3-0-installer.dmg」の順にクリック
下記参照
![スクリーンショット 2021-03-31 22.27.40.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1263774/1ae16963-143d-a85f-d891-fdc737712641.png)
![スクリーンショット 2021-03-31 22.27.51.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1263774/bff3c62c-c225-b63a-af4b-c8a862b8d5f4.png)
![スクリーンショット 2021-03-31 22.28.04.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1263774/93c6658c-1e59-0ae9-653f-3b0a6a3f5264.png)
ダウンロードが完了したら左下のダウンロードしたファイルをクリック

するとこのような画像がでます。
![スクリーンショット 2021-03-31 22.30.02.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1263774/4d50255b-3faf-970d-75a4-a6cf6c98213c.png)
そしてXAMPPのアイコンをダブルクリック。
そして開くをクリック。
![スクリーンショット 2021-03-31 22.30.45.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1263774/5cbab50e-8f4b-7059-d6b4-dd4eeee2ef58.png)
名前とパスワードを入れたらOKをクリックするとインストールダイアログが出てくるので下記の画像が出てくるまでNextをクリック。
するとブラウザが開きます。
![スクリーンショット 2021-03-31 22.33.41.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1263774/399af87a-f64a-1ba1-fda4-a84a3efd13e1.png)
こちらは閉じてOK
![スクリーンショット 2021-03-31 22.34.23.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1263774/b38c82ed-4ac1-b9b1-69bb-930565f711d4.png)
Nextをクリックでダウンロードが始まります。
少し時間がかかりました。

インストールが完了したらFinishをクリックで終了。
![スクリーンショット 2021-03-31 22.43.53.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1263774/0601c74e-1ad9-7003-cc84-83c95f07c434.png)
LaunchPadの「XAMPP（その他）」というフォルダに「manager-osx」というアプリを開くと起動できます。
（毎回パスワードを求められます）
![スクリーンショット 2021-03-31 22.46.13.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1263774/7c22dbfb-eed1-c12c-d7d2-916da9bed46b.png)

以上で完了です。
【Flutter】 Dart 2.12で追加されたlateについて

# `late`とは
`late`はDart 2.12から追加されたキーワードで、2つのユースケースがあります。

- 遅延初期化
- 宣言後に初期化されるnon-nullable変数の宣言

詳しくは[公式Doc](https://dart.dev/guides/language/language-tour#late-variables)を参照ください。

# 活用例

## 変数宣言時の`this`へのアクセス

`late`で修飾した変数は、宣言時に`this`にアクセスできます。

```dart
class User {
  User({required this.firstName, required this.lastName});

  final String firstName;
  final String lastName;
  late String fullName = '$firstName $lastName';  // ('${this.firstName} ${this.lastName}')
}
```

## 不要なこともある高コスト変数の宣言

使用されない場合もある、初期化にコストがかかる変数を`late`で宣言しておくと、その変数が使用されない場合は初期化もされないのでコスト削減できます。
以下の例では`temperature`が使われない場合、高コストな`_readThermometer()`は呼ばれません。

```dart
late String temperature = _readThermometer(); 
```

## Null Safety有効化時のUnit Test
Unit Testを書く時に、`setUp()`で各`test`の前に変数を初期化するという処理をすることがあると思います。
以下のコードはNull Safety有効化前は正常に動きます。

```dart
import 'package:flutter_test/flutter_test.dart';

void main() {
  List<Book> books;
  BookManager bookManager;

  setUp(() {
    books = [Book(title: 'A'), Book(title: 'B'), Book(title: 'C')];
    bookManager = BookManager(books);
  });

  group('create', () {
    test('BookManager has 4 books after create', () {
      bookManager.create(title: 'D');
      expect(bookManager.books.length, 4);
    });
  });
}
```

しかし、Null Safetyを有効にすると以下のエラーが発生します。
Null Safety有効化前は`books`や`bookManager`は暗黙的にnullableになっていましたが、Null Safetyを有効化後はnon-nullableになるため初期化をしなければならないためです。

```
The non-nullable local variable 'books' must be assigned before it can be used.
Try giving it an initializer expression, or ensure that it's assigned on every execution path.
------------------------------------------------------------------------------------------------
The non-nullable local variable 'bookManager' must be assigned before it can be used.
Try giving it an initializer expression, or ensure that it's assigned on every execution path.
```

`late`をつけた正常に動くコードは以下のようになります。
これはユースケースの「宣言後に初期化されるnon-nullable変数の宣言」に当たります。

```dart
import 'package:flutter_test/flutter_test.dart';

void main() {
  late List<Book> books;         // lateを追加
  late BookManager bookManager;  // lateを追加

  setUp(() {
    books = [Book(title: 'A'), Book(title: 'B'), Book(title: 'C')];
    bookManager = BookManager(books);
  });

  group('create', () {
    test('BookManager has 4 books after create', () {
      bookManager.create(title: 'D');
      expect(bookManager.books.length, 4);
    });
  });
}
PHP fopen(), fgets(), feof(), fcloseとfile_get_contents()と file()の使い分けについて

#file関係の関数の使い分け
###①fopen(), fgets(), feof(), fclose
上記は基本セットで使う。
fopenで取得するテキストファイルを指定。
fgetsでそのファイルの1行分の文字列を取得
fcloseでファイルを閉じる
feofは1行ずつ取得するfgetsをwhileでループし全文取得するときに最後の文まで取得する時の条件式で使用する。

###②file_get_contents
①をまとめて実行するイメージ
引数を増やして設定をより細かく指定出来る。


###①と②共通事項
テキストファイルの文字列を文字列として（１行ずつまたは全文）取得出来る


###③file()
テキストファイルを1行ごとに配列に格納して取得する


###上記使用例

file.php

```php
<?php 

$file = fopen('file.txt','r');
while(feof($file)===false){//!feof($file)と同じ（falseの間続けますよ）の意味
    echo fgets($file);
}
fclose($file);
//結果
/*
fopen,fgets,feof,fclose]と「file_get_contents」と「file()」の違いについて調べます
fopenで対象のファイルを開き、rを指定して読み込み。fgetsで1行ずつ取得しfcloseでファイルの読み取りを辞めます。
file_get_contentsでは文字列としてテキスト全文を読み込みます。この関数でfopen, fgets, fcloseをまとめて行うイメージです
file()では読み込んだテキストを1行ごとに配列に格納します。
*/

echo file_get_contents('file.txt');//結果はfopen-fcloseの方法と同じ


var_dump(file('file.txt'));//1行ごとに配列に格納して取得可能
//結果
/*
array(5) {
  [0]=>
  string(102) "「fopen,fgets,feof,fclose]と「file_get_contents」と「file()」の違いについて調べます
"
  [1]=>
  string(154) "fopenで対象のファイルを開き、rを指定して読み込み。fgetsで1行ずつ取得しfcloseでファイルの読み取りを辞めます。
"
  [2]=>
  string(158) "file_get_contentsでは文字列としてテキスト全文を読み込みます。この関数でfopen, fgets, fcloseをまとめて行うイメージです
"
  [3]=>
  string(83) "file()では読み込んだテキストを1行ごとに配列に格納します。
"
  [4]=>
  string(45) "早速エディタで試して見ましょう"
}
*/

```

file.txt

```
「fopen,fgets,feof,fclose]と「file_get_contents」と「file()」の違いについて調べます
fopenで対象のファイルを開き、rを指定して読み込み。fgetsで1行ずつ取得しfcloseでファイルの読み取りを辞めます。
file_get_contentsでは文字列としてテキスト全文を読み込みます。この関数でfopen, fgets, fcloseをまとめて行うイメージです
file()では読み込んだテキストを1行ごとに配列に格納します。
早速エディタで試して見ましょう
```

まとめて見たらスッキリした。
opacityをうまく調節できない人へ

#対象
progateの道場などで、仕様書の通りにopacityの値を選んでいるはずなのにうまくいかない人
#考慮してみること
外側のブロックと、その中のブロックにopacityを重ね掛けしていないのかどうか
#解説
例えば、外側のブロックに
```
opacity:0.7;
```
そのブロックの内側のブロックにも
```
opacity:0.8;
```
を記述してしまうと、内側の部分は0.7×0.8=0.56の透過度になってしまいます。
これを防止するために、透過度を異なる部分を作りたい場合は包含するブロックを作るのではなく、
２つのブロックに分けて、透過度を指定すればいいと思います。
#最後に
割としょうもない記事ですが、参考になれば幸いです。
毎度のことですが、先駆者さまのアドバイス、指摘を待っています！
よろしくお願いします。
Xplentyで固定長の文字列を扱う

今回のブログでは、Xplentyで固定長のフィールドを扱う必要がある場合のTipsについて紹介します。

#固定長の文字列をフィールドごとに分割するには?
Selectコンポーネントで以下のように設定可能です。
式：Substring(フィールド,開始位置,終了位置)
使用例：
`SUBSTRING('aaaaa00000あああああ11111',0,5)` > 'aaaaa'
`SUBSTRING('aaaaa00000あああああ11111',5,10)` > '00000'
`SUBSTRING('aaaaa00000あああああ11111',10,15)` > 'あああああ'

#固定長の文字列を生成するには？
Selectコンポーネントで以下のように設定可能です。
式：SPRINTF('%08d',数値)
使用例：

|式 |結果|説明|
|: |:   |: |
|SPRINTF('%08d',1)| 00000001|8桁 (左を桁数分０で詰める）|
|SPRINTF('%05d',10)` | '00010' |5桁 (左を桁数分０で詰める）|
|SPRINTF('%5s','あ') |'____あ' |5桁 (左を桁数分半角スペースで詰める）|
|SPRINTF('%-10s','あ')| 'あ_________'|10桁 (右を桁数分半角スペースで詰める）|

例外： 「１」 > 「10000」のように右にゼロを追加して詰めることはできません。
数値を桁数に応じて10,100,1000、10,000倍するなどの対応が必要です。

また、もし想定している桁数を超えたデータが入ってくるような場合、CASE文とLength関数、SUBSTRING関数を使用して、超過分の文字列を切り捨てることができます。
**5桁を超える場合の制御例：**
`CASE WHEN Length(field1) > 5 THEN SPRINTF('%-5s'(SUBSTRING(field1,0,5)) ELSE SPRINTF('%-5s',field1) END`
データベース設計をする際に重要なのはエンティティ (entity)の洗い出し

#本記事について
プログラミング初心者がデータベース設計周辺について学んだので、その備忘録として載せております。

どうかお手柔らかにお願いいたしますm (- -)(_ _)ペコリ

#DB設計とは　
・DBの表を設計すること　

・考えるポイント　
テーブルやカラム、アソシエーション（テーブル同士の関連づけ）

##エンティティとは
・データを指す

・データベースのテーブルのこと

・機能ごとの総まとめと言える。

・データで扱われるデータ自体のこと

・何かの実体のこと

・ER図で出てくる箱のこと。

##エンティティの抽出
→テーブルの洗い出しということ

データのことを全てさす。

##データベース設計をする際に重要なのはエンティティの洗い出し
・データが登録される時に着目する。
→登録されるたびにデータベースへ保存が行われる。
　その度にテーブルに記録されエンティティができる。

##モデリング
・テーブル同士を混同せないことがモデリング

・エンティティを分類わけや関連づけして、テーブル同士を混同させないようにしてて図などに表記する。

・モデリングされ分類わけされたテーブルをさらに詳細な設計を行う。

##正規化
データベースの構造を効率的でシンプルなものにする。

第一正規化はレコードを増やすことで解決できる。

第三正規化は重複する情報を切り出し、関連付ける。（アソシエーション）
重複するデータもなくなりエンティティ（テーブル）もジャンルで分離されているため管理もしやすい

##制約
制約とはデータベースにおいてカラムに設定できるもの。データがテーブルへと保存される際に制限をかけることができる。データを扱う際に制限をかける。

##NOT NULL制約
テーブルの属性値に空の値（NULL）が入らないように制限されている制約。
空の値を入らないようにしているので、エラーが生じるのを防いでいる。


##一意性制約
テーブル内で重複するデータを禁止する制約
同じユーザー名やemail等が保存できなくなる。任意に決めることができる。

##主キー制約
そのデータが空にならず、かつ重複ないようにすること。
NOT NULL制約 + 一意性制約
（Railsではテーブルを作成する時に自動生成される。

##外部キー制約
外部キーの対応するデータが必ず存在しなくてはいけない制約
params等で外部からデータを保存や引き渡しなどができないとなればidでの判別できるレコードの関連付けができない。データの引用ができない。


##チェック制約
値が保存される際に条件を満たしているかチェックできる制約
ユーザーネームが６文字以下となる条件は認めないということで、そのデータは保存されない。

##ER図
データベースのテーブルなどを図で表したもの

一目でテーブル間の関係を把握することができる。

##まとめ
開発やマーケティングの方々が集まりアプリケーションの仕様について決めた要件定義から、開発になる大枠となる部分を設計する。開発の設計の中にも、開発の必要となる内容をまとめる、開発の大枠を決める基本設計と開発にできるかの落とし込みの部分の詳細設計に分かれる。今回は詳細設計であるデータベース設計について。データベース設計で肝となる部分はエンティティの管理やエンティティ同士のアソシエーションの部分である。具体的にはエンティティの抽出が重要となりその方法がモデリングと制約。モデリングでテーブルの正規化（体系立ててテーブルが管理されていること）その正規化されたテーブルを制約を設けてエラーが出ない形にする。エンティティ内に空の値が出ない、重複する要素が出ない、外部サーバであるテーブルからデータを取得できない引き渡せない、保存するデータに制約を設けるなどを行う。こういうエンティティの管理や制約、アソシエーションの部分を体系的にまとめるER図を作成し開発を進める。


以上です。
「Python」def __init__は初期化メソッド

##背景
pythonを書いてて`def __init__(self, 引数2, 引数3..)`に出くわす度に、こいつに名前あったよな、なんだっけとなるので、自分が覚えるために書き残します。
##内容

```sample.py
def __init__(self, 引数2, 引数3..):
```
~~↑こいつは「コンストラクタ」と呼ばれるらしい。~~コメント頂いたように正確にはコンストラクト処理における初期化メソッド。クラスを定義するときに良く出てくるやつ。いっつも名前を忘れてしまう。

インスタンス生成時に呼び出されるメソッドで、そのインスタンスで扱う変数の初期化に使われる。

こうして自分で書けば忘れないはず。きっと。たぶん。
縦位置を揃えるコーディングスタイルに最近こだわりはじめた話

# 緒言

以前はいい加減に対処していたが、最近になって気をつけ始めたマイコーディングルールがある。

「縦位置を揃える」だ。

これだけで随分と目に優しいコードとなることに最近ようやく気がついた次第。具体例をここに書き置いておこうと思う。
なお、言語はperlを想定している。他の言語では通用しない部分があるかもしれない。

# 演算子の位置を揃える

```
$v_short_name = 0;
$v_long_name = 0;
$variable_with_very_long_name = 0;
```

ではなく、

```
$v_short_name                 = 0;
$v_long_name                  = 0;
$variable_with_very_long_name = 0;
```

# コンマの位置を揃える

```
do_something(0, 1, 2, 3);
do_something(0, 100, 200, 300);
do_something(10000, 0, 0, 0);
```

ではなく、

```
do_something(    0,   1,   2,   3);
do_something(    0, 100, 200, 300);
do_something(10000,   0,   0,   0);
```

# 3項演算子の：と？の位置を揃える

```
$a = ($flag)?"a very long string":"another very long string";
```

ではなく、

```
$a = ($flag)
   ? "a very long string" 
   : "another very long string";
```

# 総括

エディタの支援機能もあるが、限界がある。perlは元々がフリースタイル風味であるため、実際には問題あるコードが普通に「問題なし」判定となりがちなのだ。

たとえば関数に与えるパラメータの数が想定と全然違っていてもエラーにはならない。しかし、上記のスタイルを心がけていれば、目視でかなりのミスがカバーできる。
バリデーションエラーが表示されない問題

思いのほかハマってしまったので、同じような問題に遭遇した誰かの手助けになればと思い残します。



/_error.html.erb

```ruby
<% if family.errors.any? %>
  <div class = "alert">
    <ul>
      <% family.errors.full_messages.each do |message| %>
        <li><%= message %></li>
      <% end %>
    </ul>
  </div>
<% end %>
```

/フォーム

```ruby 
<%= render "error_form", family: @family %>

  <%= form_with model: @family, url: :family_families do |form| %>
    <%= render "form", form: form %>
  <% end %>
</div>
```

色々試してみます。

```ruby
[5] pry(main)> @family.errors.full_messages
=> ["Family nameを入力してください",
 "Given nameを入力してください",
 "Family name kanaを入力してください",
 "Given name kanaを入力してください",
 "Genderを入力してください",
 "Relationshipを入力してください",
 "Addressを入力してください",
 "Password digestを入力してください",
 "Password digestは8文字以上で入力してください",
 "Passwordを入力してください"]
```

しっかりエラー文入ってますね。


googleデベロッパー

```
<form action="/family/families" accept-charset="UTF-8" method="post">
```

local :trueオプションが効いてない場合は表示されないようです。その場合はdata-remote=trueと表示されるはずなので非同期通信になっていないことが確認できます



###結論
contollerのsave!メソッドが原因でした。

・saveメソッド → 保存できない場合falseを返す。
・save!メソッド → 保存できない場合例外ActiveRecord::RecordInvalidが発生する。
Hugo の Front Matter 全部出す

# 環境

`hugo v0.82.0-9D960784+extended windows/amd64 BuildDate=2021-03-21T17:28:04Z VendorInfo=gohugoio`

# 結論

``` example1.html
<ul>
    {{ range $key, $value := .Params }}
        <li>
            {{ $key }}: {{ $value }}
        </li>
    {{ end }}
</ul>

<!--
【出力結果の例】
  draft: false
  iscjklanguage: false
  title: ページのタイトル
  XXX_hoge: 自分で作ったパラメータ
-->
```

# 注意事項

テンプレートで Front Matter を参照する場合、キーは小文字でないと出力されない

``` example2.html
<div>
    <!-- 設定した通りの名前を指定しても出力されない -->
    {{ if isset .Params "XXX_hoge" }}  Fuga  {{ end }}
</div>

<div>
    <!-- 全て小文字にすると出力される -->
    {{ if isset .Params "xxx_hoge" }}  Hoge  {{ end }}
</div>
```

公式ドキュメントにもキーは小文字で保存されると書いてある
https://gohugo.io/functions/isset/

しかし`Params`でテキスト出力する場合は大文字小文字がぐちゃぐちゃでも出力される

``` example3.html
<!-- どちらも出力される -->
<div>{{ .Params.xxx_hoge }}</div>
<div>{{ .Params.XXX_HOGE }}</div>
```

ややこしいのでフロントマターは大文字禁止というオレオレルールで行くことにした
2021 Microsoft Ignite Update Data&AI 編

# Microsoft Ignite 2021 Update!!

2021年3月に行われたMicrosoft Ignite 2021のアップデート(Database/AI/ML/IoT関連)を簡単にまとめておきます。基本的にはBook of Newsに書いてありますのでご参照ください。

https://news.microsoft.com/ignite-march-2021-book-of-news/

# Database
## Azure Cosmos DB
- Azure Synapse Link for Cosmos DBがGA
- Azure Cosmos DB API for Mongo DBがMongo v4.0サポートGA
- 継続的バックアップとポイントタイムリストアがプレビュー、30日以内の任意のポイントにリストア可能
- RBACがプレビュー

## Azure Cache for Redis
- EnterpriseとEnterprise FlashレベルがGA
- アクティブGeoレプリケーションがプレビュー公開、99.999％の可用性

## Azure MI for Cassandra
- 新しいセミマネージドサービスとしてAzure Managed Instance for Apache Cassandraがプレビュー公開
- 今までは完全PaaSのAzure Cosmos DB Cassandra APIもしくは自社管理のVMもしくはオンプレミスマシンでしか利用できなかった
- バージョン管理更新部分などはAzureに委任した上で柔軟性のあるDB利用が可能

## Azure Synapse Analytics
- Azure Synapse Pathwayがプレビュー公開
- SQL Server/IBM Netezza/Snowflake等のデータ定義言語やデータ操作言語ステートメントがAzure Synapse SQLに互換性のあるT-SQL準拠言語に自動翻訳される
- 移行における外注コストを削減可能に

# データガバナンス
## Azure Purview
- Azure Data MapにおいてAWS S3やSAP、Oracle DBのデータをスキャン可能(プレビュー)
- Azure Synapse Analyticsの専用SQLプールとサーバレスSQL Poolにまたがって検索可能
- Synapse Workspaceとの統合によりSynapseのUIから直接Azure Purviewの機能にアクセスできる
- プライベートエンドポイント対応(プレビュー)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/205918/b8327af0-e87a-b1f8-9a31-eeea63681582.png)


# AI(Cognitive系)
## マスク検出
- 空間分析(Spatial Analysis)とFace APIにおいて写っている人物がマスクを着用しているかどうか識別可能に
- Spatial Analysisはエッジ側のソリューションかつ動画を入力として想定
- Face APIはクラウド側でホストしている画像認識API
- コロナ禍における安全な空間づくりを容易に実現

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/205918/c4b58667-5594-4859-7c55-2c7e74583388.png)


## Form Recognizer
- 全世界のパスポートや運転免許などからデータを自動抽出可能に
- データ読み込み可能言語が64種追加で合計73言語対応

 ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/205918/9824724e-6c1d-2ebc-54b0-f99e84eed1bb.png)

## Cognitive Search
- キーワードベースの検索ではなくユーザの意図や文脈を考慮したSemantic Searchがプレビュー公開
- 日本語の対応は未定
- 同意語検索のバックエンド側がアップデートされよりパーソナライズされた検索が可能に
- SharePointコネクタが追加され企業内のSharePointに溜まった資料を容易に検索可能

# Machine Learning
## Azure Machine Learning
- Azure Arcのサポートがプレビュー公開。Azure Arcの対応環境上でモデルのトレーニングが可能となり、余剰のリソースを最大限活用することができる。
- Azure Synapse Analytics上で展開しているSpark PoolをAzure MLにアタッチ可能に。Azure ML上での特徴量エンジニアリングにSpark環境を提供。
- Azure PerceptにAzure MLが統合

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/205918/278d58cc-3e38-8082-0f9b-4c9724466aa2.png)

# IoT
## Azure Percept
- カメラとマイク付きのIoTデバイスおよびそれらのストリーミングデータを分析するソフトがパッケージ化されたAzure Perceptが発表。
- エッジデバイス＋IoT Hub＋Azure MLのようなイメージ
- 各種サービスが統合されているため事前知識不要

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/205918/1a4b6ba8-a327-b19e-7603-ae0a6ee6cbea.png)

## Azure IoT
- Device Update for Azure IoT Hubのプレビュー提供開始。
- あらゆるデバイス向けのプログラムの公開、配布、管理が可能に。
- 更新プログラムのスキャンによるマルウェア検出や、デバイスによる整合性検証の実施にも対応し安全なIoTデバイス環境を保てる。

# 終わりに
雑にまとめているので何か間違いやご指摘等あればコメントください。
rails 定期実行 heroku scheduler

<h1>前提条件</h1>

・ruby 2.6.6
・rails 6.0.3.2
・macOS Catalina バージョン10.15.7
・deviseを使用
・herokuにデプロイ済み

<h1>概要</h1>
 webアプリ作成中に、毎日決まった時間に特定の操作を実行させたいなと思い調べてみた。

[1] gem whenever
・・・というものがあるらしく実装しようと思ったら、herokuではサポートされていないらしい。

[2]  Herokuのアドオン"Heroku Scheduler"
・・・これを利用すれば、設定した時間にrakeタスクを実行させることができるという。

ということで"Heroku Scheduler"の実装手順を記していく。

<h1>addonのインストール</h1>
まずHeroku Schedulerを利用できるようにaddonをインストールします。

```ruby:ターミナル
 heroku addons:create scheduler:standard
```
<h1>Railsでrakeタスクを作成</h1>
Heroku Schedulerで実行させるタスクをRailsで書きます。
`lib/tasks/scheduler.rake`を作成しその中に書いていきます。

```ruby:lib/tasks/scheduler.rake
desc "This task is called by the Heroku scheduler add-on"
task :test_scheduler => :environment do
  puts "scheduler test"
  puts "it works."
end

task :send_reminders => :environment do
  reservations = Reservation.where.not(status: "complete").where(patern: "no")
  reservations.each do |reservation|
    if reservation.end_time - 1.day <= Time.new
      user = User.find_by(id: reservation.user_id)
      reservation.patern = "yes"
      reservation.save
      MessageMailer.send_when_update(user, reservation).deliver
    end
  end
  puts "ended."
end
```

`:test_scheduler`はタスクのテストのためのコード、
`:send_reminders`は私のアプリ内に置き換えたコードです。ここは各自で書き換えてください。

<h1>タスクのテスト</h1>
正常にHeroku Schedulerが実行されているか、ローカルで確認します。

```ruby:ターミナル
heroku run rake test_scheduler

#結果
scheduler test
it works.
```
正常な動作が確認ができたら、
herokuにデプロイし、タスクを実行させるスケジュールを設定していきます。

<h1>ジョブのスケジューリング</h1>
タスクを実行させるスケジュールを設定をしていきます。herokuをwebで直接たたくか、もしくは下のコマンドをターミナルで叩いても開けます。

```ruby:ターミナル
heroku addons:open scheduler
```
![スクリーンショット 2021-04-01 17.31.20.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/701865/11934903-59f1-6acb-b9ce-a3e0db4d2652.png)

`Add Job`を押すと上記のような画面が出てくるので、
どの間隔でタスクを実行させるか、どのタスクを実行させるかを記入します。

ここでの注意点として、Heroku Schedulerは、UTC（世界協定）の時間であるので、日本との時差を考えて、実行したい時間の9時間前に時間を設定しないといけません。

実行させるコマンド ※各自タスク名は変えてください


`bundle exec rake send_reminders`


最後に`Save Job`を押して完了となります。

<h1>参考サイト</h1>
https://devcenter.heroku.com/articles/scheduler

https://qiita.com/1024xx4/items/c269172dda4a8aff8522
Windows 10Xの魅力?

# 記事の通りです
以下の内容で分かると思うが、WindowsのGUIが使いやすくてWindowsを使っている人が多いわけではないので、Windows RTと同様、10Xはデメリットの方が多く感じる。

## UIに関して
Windowsは**大衆にコンピューターオタクに搾取されていることを発信すること**で使いやすさを強調して、Linuxは**無料であること**で手軽さを強調して、macOSは**気品がある優しく美しいUIを採用すること**でITの知識が少なくても使えるPCであることを強調して、Chrome OSは**大衆がITの知識が少なくても使えるPCであること**を強調した。

## コンピューターオタクに関して
Windowsは**大衆に気に入られる**ため敵視して、macOSは**Unix互換**にすることで価値を見出してもらい、Chrome OSはオタクたちが作製した**Linuxを載せることである程度人気**を出した。

## クリエイティブに関して
非常に高価だったmacOSを持つ機体から始められ、Windowsで利用できるようになり、さらに最近ではChrome OSでも利用できるようになり、環境を選ばなくなってきた。

## GUIに関して
1つの操作に対しLinuxは**1つの方法**、Mac OSやChrome OSは**簡単な方法**、Windowsは**無数の方法**を提示する。

## タッチパッドについて
MacBookやChromeBookは非常に優秀でマウス不要(**キーボード+タッチパッド**)。Windowsはマウス必須、Linuxはディストロによって異なると思われるがマウス必須(**キーボード+マウス**)。

## ソフトウェア(アプリ)について
Mac OSはPC独自アプリ以外に、Chrome OSと同様に**Webアプリやスマホやタブレットのアプリが利用**できる。Windowsは**Officeの他、Win 95~xp時代のソフトウェアが豊富で使われる**ことが多い。

## セキュリティーとサポート
Linuxはそもそも利用者が少ないため重要なサーバー以外狙われることが少なく、Mac OSはiOS端末普及の影響などから利用者増加に伴い**野良アプリ(app store以外でのダウンロードアプリ)でのウイルスが大量に増加**し、Chrome OSは**PlayStoreとWebアプリ(拡張機能含む)とLinuxアプリが使える**が、主に**拡張機能とLinuxアプリでの感染**が今のところあるそうですがLinuxは前述の通り狙われることが少なく(さらに幸いなことに個人情報を入れることもないため狙われたとしても最小限で済む)、拡張機能もできることが限られているため基本的には安全性が高く、Windowsは**Defender(純正ウイルス対策ソフト)**があり基本的には問題はないと言われています。またサポートは、Linuxはサポートは**全くなし**(**GPLの規約**を読んでください)、WindowsはMicrosoftによる基本的な**サポートが存在**し、Mac OSはAppleによる**手厚いサポート**が受けられることが多く、Chrome OSはGoogleによる基本的な**サポートがあり**、Google OneやGoogle Workspaceを利用すると手厚いサポートを受けれるらしい[要出典]。

## 最適化
Windowsの場合、昔のハードウェアに最適化されているソフトウェアが多く、PWAもあまり使いやすく感じられない(UWPには最適化されているがあまりにも少ない)。MacOSは最適化されているアプリが多めで、iOSのアプリの1部が使えるらしい。Chrome OSはPWA化で使いやすいものも多く、Androidアプリも使いやすいものも結構ある(MusicoletやJava N-IDEなどはこんなに使い勝手いいのに無料で使えるのと思ったくらい使い勝手がいい)。Linuxはフリーソフトが豊富であるがたまに落ちることがある。

## 神Excelについて
MicrosoftはWindowsでExcelで積極的に勧め、LinuxはCalcで自由にやらせ、AppleはMac OSでNumbersで**生産性を大幅に下げる行為**だとして禁止し、GoogleはChrome OSで同様にGoogleスプレッドシートで生産性を大幅に下げる行為として禁止させた。DXとは非常に相性が悪いので今後減る可能性が高い。

## 連携
iOSはMacOSとAndroidはChromebookとの連携が素晴らしい。Windowsにも1部スマホとの連携機能はある...(10XはOS開発企業が違うので難しそう)

## 結局何が言えるのか
掲示板で言われていたことではマクロや神エクセルや古いソフトがメインらしくそのためWindowsである必要性が高いと言われていたが、10Xではそのようなしがらみから完全に立ち切ることから始まるためChrome OS以上にアプリが少ない上、UIもChrome OS以上に使いやすくすることはかなり難しい(iPad OSに似たUIであり格安PCでは使いずらそう)と考えられているためあえて10Xを買う必要性が薄い。

## どうすればメジャーになれるか
新しくするのに優位であるためには、アプリ作成のための開発者を集めるしかないが、そのためには現状このようなことを同時にしないと難しいであろうと思われる。
1. MindGeekを買収し、Nutaku.com(全年齢版Nutaku/知名度が高い)にMS Storeを統合する。(さらに開発者優位にする)
2. Unixライクカーネルをベースにランタイムを載せる(コンパイラにClangが使えるので最適化がしやすい[さらに新たにコンパイラを開発する必要がない]、開発者が多い、OSSのカーネルが利用できるといったメリットがある)
3. とりあえずコンピューターオタクに素直に謝る
4. C#でMAUIを利用して、iOSとMac OSと10Xのアプリを常に同時に生成できるようにする。
5. Githubとの連携を抜群にする。
6. Windowsの名前で販売する

これらの投資でやっとChromeBookと対等って感じであろう(非常に非現実的...)。

## 最後に
MSさんには、是非とも10Xのプロジェクトを頑張って成功させてもらいたい。陰で応援してます。
wordpress用PHPタグまとめ


#記事一覧などに使うループ処理

```wordpressExample.php
<?php if (have_posts()) : ?> #もし投稿記事がある場合                        
    <?php the_title(); ?> #記事タイトルを表示する
<?php endif ?> #必ずendifで閉じる
```

ループ処理を追加。

```wordpressExample.php
<?php if (have_posts()) : ?> 
  <?php while (have_posts()): ?> #もし投稿記事が複数ある場合
    <?php the_post(); ?> #このthe_postは必ずwhile (have_posts())とセットで使う。使わないと無限ループに
    <?php the_title(); ?> #同上
  <?php endwhile; ?> #必ずendwhileで閉じる
<?php endif ?>
```
上を短縮すると

```wordpressExample.php
<?php if (have_posts()) : ?> 
  <?php while (have_posts()): the_post(); ?> #もし投稿記事が複数ある場合
    <?php the_title(); ?> #同上
  <?php endwhile; ?> #必ずendwhileで閉じる
<?php endif ?>
```

###投稿日付を表示するテンプレートタグ
注意しなければならなことは、<?php the_date(); ?>だけだと、同じ日に投稿した記事が複数あった場合、最新の投稿にしか日付が表示されない。
なので、<?php the_time(); ?>を利用する。(もしくはget_the_date)
<?php the_time(); ?>の引数に'Y/m/d'を追記すると、同上の場合でもきちんと表示がされる。

引数にget_option('date_format')を指定すると、wordpressの管理画面から

#ブログ一覧からブログ記事ページへ

<a herf="post.html">をのpost.htmlを<?php the_permalink(); ?>に変更


#headタグの中をheader.phpへ。footerタグの中をfooter.phpへ移動
①headタグの中身をheader.phpへ。footerタグ(jsの読み込みなど）をfooter.phpへそれぞれ移動させ、共通パーツ化する
②切り取った場所にはそれぞれ<?php get_header(); ?><?php get_footer(); ?>を記述し、読み込めるようにする。
③haederタグのtitleの中は、ページによって変わらないといけないので<title><?php the_title(); ?></title>に変更。
④cssやjsなど各ファイルへのパスを<?php echo get_template_directory_uri(); ?>に置換。
CDNのhttps://は//から始めると httpでもhttpsでもパスが通るように。
`<link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/style.css">`

#他部分も共通パーツ化する
ヘッダーナビゲーションやフッターなどの部分も、共通パーツ化ができる。
includesという共通パーツ専用のフォルダを作成し、中にheader.phpやfooter.phpを作成。
ヘッダーナビやフッターをそれぞれコピペし、<?php get_template_part('')?>タグを使って、パスを通す

```
<?php get_template_part('includes/header')?>
```

#アイキャッチ画像を設定できるようにする
アイキャッチ画像は標準では搭載されないようになっている為、設定できるようにしていく必要がある。
①functions.phpを作成し以下を記述
※ファイル名は必ずfunction"s"

```functions.php
<?php
//アイキャッチ画像を設定できるように宣言。
add_action('init', function() {
    add_theme_support('post-thumbnails');
}); 
```

②それを出力するコードをsingle.phpに追記

```single.php
<?php the_post_thumbnail(); ?>
```
【Python環境構築 Warning】The Python bz2 extension was not compiled. Missing the bzip2 lib?

#【Python環境構築 Warning】The Python bz2 extension was not compiled. Missing the bzip2 lib?

###問題
Python3.9.0でtensorflowが使えず，3.8.6をインストールしようとするが，とにかく警告が消えない．（Python環境の構築はいつだって難しい．）![スク
リーンショット 2021-04-01 15.26.37.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1264667/c0cf58d3-7e8d-6d3c-a12c-c8be7e5bfd5f.png)

###原因
どうにもbzip2とかいう拡張機能が足りないらしい．


###解決策
（参考：https://qiita.com/euphoria108/items/8bced0f3d5a8ad9ce9d2）

```
brew install bzip2
```

なんだか簡単に終わりそうな雰囲気．

そして，こんなのが出てくる．

```
For compilers to find bzip2 you may need to set:
  export LDFLAGS="-L/usr/local/opt/bzip2/lib"
  export CPPFLAGS="-I/usr/local/opt/bzip2/include"
```

言われるがままに以下の2行を~/.bash_profileに追加．

```
export LDFLAGS="-L/usr/local/opt/bzip2/lib"
export CPPFLAGS="-I/usr/local/opt/bzip2/include"
```

もう一回3.8.6をインストール．

```
pyenv install 3.8.6
```

↓結果
![スクリーンショット 2021-04-01 15.50.58.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1264667/eff0cf42-5c05-d2f6-829d-5d113fc20ad2.png)

同じ警告が出る．そんな気はした．

ここで，丸一日くらいウンウンと悩んでいたら，そもそも~/.bash_profileの変更内容が反映されていなかったという初歩的なミス．

ターミナル再起動をかけて，もう一回3.8.6をインストール．

```
pyenv install 3.8.6
```

3.8.6にできた．

###補足

ターミナルを再起動しなくても，これでいけると思う．

```
source .bash_profile 
```

###結論
黒い画面をPython環境構築の時しかまともに使わないとこういうことになるので，普段からターミナルは使っていきたい．
~~データベースを扱うかPythonの環境構築でしか使う場面がない気がする~~


###参考

https://qiita.com/euphoria108/items/8bced0f3d5a8ad9ce9d2
https://qiita.com/OTAGRAMER/items/bbdcc8cc8e7bae7fbe02
SQL SELECT文の処理の流れ

FROM,ON,JOIN：テーブル指定&結合
WHERE：レコードの絞り込み
GROUP BY：グループ化（ 集計対象のキーにした列以外は取得できない）
HAVING：グループ化した後、その集計対象に条件を指定する
SELECT：取得したい列を指定する
ORDER BY ：並び替え
eeprom（24CW128X）複数byte書き込み時に異常なデータが書き込まれることがある

備忘録

# 症状
<!-- 発端や概要を記載 -->
一部のアドレスだけ複数byte書き込み時に異常なデータが書き込まれることがある

```c

uint16_t address = 0x003E;
uint8_t size = 4;
uint32_t data = 0x12345678;
write_eeprom(address, size ,data ); // eepromに書き込む関数

// 実施後同じアドレスのeepromを読み出しても 0x12345678 ではないデータが入っている
```

# 原因
[データシート](http://ww1.microchip.com/downloads/en/DeviceDoc/24CW16X-24CW32X-24CW64X-24CW128X-Data-Sheet-20005772B.pdf)内に、「複数バイト書き込みは最大32バイトまで行えます」のような文章があるが、これは「一度に32バイトまで書き込みが可能」という意味ではなく
「1ページ32バイトの為、ページの初めのアドレスを指定すれば最大32バイトまで書き込みが可能」という意味。（ずっと勘違いしていた）

そのため、ページをまたいでの複数バイト書き込み（上記例のアドレス0x003E/サイズ4byteなど）は実行すると異常な値が書き込まれることになる。

```c

uint16_t address = 0x003E;
uint8_t size = 4;
uint32_t data = 0x12345678;
write_eeprom(address, size ,data ); 
// これで書き込むと 0x003E + 4で0X0042までの書き込みを行うが
// ページ1：0x00 ~ 0x20
// ページ2：0x40 ~ 0x60
// のため、書き込み始めと終わりのページが違っているので
// 不定な動作となり異常なデータが書き込まれることになる
```

# 解決策
ページを超えた書き込みを行う際、前ページと後ページの2回に分けて書込むような処理を追加した。
（アドレスを32で割ったあまり + 書込みサイズが32を超えていたら処理を分岐させるなど）
position: absoluteを中央寄せにする方法

position:absoluteで中央寄せってどうやるんだっけ？
普段使わない方法でスタイルを当てようとすると、思い出せない時がありますよね。

ここでは備忘録も兼ねてposition:absoluteで中央寄せする方法をまとめておきたいと思います。

#まずはHTMLから
HTMLは固定とします。

```index.html
<div class="box">box</div>
```

#左右を中央寄せにする方法

```style.css
.box{
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    /*boxのスタイル*/
    background: red;
    color: white;
    width: 100px;
    height: 100px;
}
```
これで左右は中央寄せになりました。次は、上下を中央寄せにする方法です。

#上下を中央寄せにする方法
```style.css
.box{
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    /*boxのスタイル*/
    background: red;
    color: white;
    width: 100px;
    height: 100px;
}
```

これで上下が中央寄せになりました。次は左右上下中央寄せにしてみましょう。

#上下左右を中央寄せにする方法
```style.css
.box{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    /*boxのスタイル*/
    background: red;
    color: white;
    width: 100px;
    height: 100px;
}
```
もちろんですが、左右の中央寄せと上下の中央寄せを組み合わせるだけですね。

以上が、position:absoluteで中央寄せする方法です。
また、忘れたら見に来てください。
【Vue.js】仮想DOMについてまとめてみた

# はじめに
Vue.jsを学習していく中で「仮想DOM」という概念を知りました。
そもそも仮想DOMとは何なのか、どんなメリットがあるのか調べたのでまとめてみました。

# そもそもDOMって何？
DOMとはDocument Object Modelの略で、**HTMLやXML文書を操作するためのAPI（インターフェイス）**です。
ウェブページとJavaScriptなどのスクリプト言語を繋ぐ橋渡し的な存在です。

仮想DOMと区別するためにリアルDOMと呼ぶこともあります。

## DOMツリーって何？

DOMのモデルは文書をツリー構造で表現します。
`<html>`タグから枝分かれしていき、`<head>`,`<body>`タグ、その中身のタグや要素に分かれていきます。

![viertual_dom.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/643940/6098e4a6-00c6-ba63-faef-ceb8e5795bf8.png)

このDOMツリーの`<html>`,`<body>`といった一つ一つの要素をオブジェクトとして扱い、これらを**Node（ノード）**と呼びます。


# 仮想DOMの発想の原点
ウェーブページの内容はDOMに格納されていて、内容を変更したいときにJavaScriptなどの言語を介して操作することができます。
DOM操作の処理フローは以下のようになっています。

1. DOMツリーを再構築する
2. DOMツリーとCSSOMツリー※を組み合わせてレンダリングツリーを構築する
3. レンダリングツリーでレイアウトを行い、各ノードの位置やスタイルを計算する
4. レイアウト結果をもとに描画する

※ CSSOM: CSS Object Modelの略で、CSS版DOMのようなものです。

レンダリングはブラウザにとってコストの高い処理となるため、できるだけ避けたいフローです。無駄なレンダリングをなくし、効率の良い処理をするためにはどうすれば良いでしょうか。

**変更があった部分のみレンダリングする**

これが実現できれば無駄なレンダリングは起きませんよね。
そこで考えられたのが、仮想DOMという概念です。

# 仮想DOMって何？
簡単にいうと、**リアルDOMを模したJavaScriptのオブジェクト**です。

1. 仮想DOMを2種類用意する
2. 一方の仮想DOMをJavascriptで操作
3. 変更前後の仮想DOMの差分を比較
4. 差分だけをリアルDOMに反映

![スクリーンショット 2021-04-01 15.40.27.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/643940/274906f4-8053-5d50-0ff1-5ba2d18a64e0.png)

上記のようなフローでリアルDOMを操作します。
仮想DOMを用いることで、無駄なレンダリングを避ける以外に

* ロジックとUIが分離できる
* 状態の管理を簡単にできる
* ロジックとUIを繋ぐ処理を簡単にできる

といったメリットがあります。

# リアルDOMと仮想DOMを比べてみよう
ここからは実際にリアルDOMと仮想DOMの処理の違いを見ていきたいと思います。

* 素のJavaScript（リアルDOM）を使う場合
* Vue.js（仮想DOM）を使う場合

今回は簡単なカウントアップ処理で2つを比べていきます。

## リアルDOM（JavaScript）

```index.html
<div id="app">
  <button class="count_up">count up</button>
  <p class="count_num">0</p>
</div>
```

```app.js
const countButton = document.querySelector('.count_up');
const state = { count: 0 };

countButton.addEventListener('click', () => {
    const countContent = document.querySelector('.count_num');
    countContent.innerHTML = ++state.count;
});
```

上記のようなリアルDOMの操作は

* ボタンをクリックすると`p.count_num`が書き変わるという**UI**と、カウントをインクリメントするという**ロジック**が混同している
* UIとロジックを繋ぐ`addEventListener`を使っている。（より複雑になると`addEventListener`が増えがち）

などのデメリットがあります。

## 仮想DOM（Vue.js）

```index.html
<div id="app">
   <button @click="countUp">count up</button>
   <p>{{ count }}</p>
</div>
```

```app.js
new Vue({
    el: "#app",
    data: {
        count: 0,
    },
    methods: {
        countUp: function() {
            this.count += 1;
        }
    }
})
```

リアルDOMの操作に比べると

* UIとロジックが分離できる
* `@click`を使うことでUIとロジックを繋ぐ処理が簡単になった
* 状態の一元管理ができる

といったメリットがあります。

# まとめ
仮想DOMはレンダリングコストの削減だけでなく、UI/ロジックの分離や状態管理の簡略化など、開発の効率を上げる上で必須の概念であると理解しました。

# 参考文献
* [仮想DOMは本当に“速い”のか？ DOM操作の新しい考え方を、フレームワークを実装して理解しよう](https://eh-career.com/engineerhub/entry/2020/02/18/103000#%E3%81%9D%E3%82%82%E3%81%9D%E3%82%82DOMDocument-Object-Model%E3%81%A8%E3%81%AF%E4%BD%95%E3%81%8B)
* [仮想DOMってすげーんだぜ！](https://qiita.com/Gsann/items/e8ca34f5b7bdab4fde11)
* [DOMの紹介 -MDN](https://developer.mozilla.org/ja/docs/Web/API/Document_Object_Model/Introduction)
いきなり出てくるとビビるfor文の条件式の省略した形

##for文とは
for文は処理を何度も繰り返しして行いたいときによく使用する文法です。

for文の例に問題を解いてみましょう。
変数nの中に何か値を入力したら、その数だけ*を出力するプログラムを書いてみました。
for文自体の解説記事ではないのでここの解説は割愛させていただきます。

```c++
int n;
cin >> n;

for(int i = 0;i < n;i++){
   cout << i;
}
```

##条件式の省略されているところ

ここで自分で詰まったのが下の3つです。

```c++
//1つ目
for(;i< n;i++){

}
//2つ目
for(i = 0;;i++){
  
}
//3つ目
for(i = 0;i < n;){
  
}
```

##1
まず一つ目の解説
for文より前で定義していた変数をfor文で繰り返し処理をしたい場合for文の最初の条件を処理することができます。

一番上の例文で書いてみましょう。

```c++
int n;
cin >> n;
int i;//ここであらかじめint iを定義する

//↓の条件式の中でiを使いたかったら省略できます。というか警告がでますね。
for(;i < n;i++){
   cout << i;
}
```

##2
続いて2つ目の処理を解説します。
2つ目の条件式を省略した場合無限大に発散するような処理になります。
この場合0～∞の処理になります。ただしbreakすることで処理を途中中断することが可能です。
メリットは条件の中で範囲を決めれるところですね。
あまり使い勝手はよくない気がします。

```c++
//この場合0～∞の処理になります。ただしbreakすることで処理を途中中断することが可能です。

for(int i = 0;;i++){
   if(i < 5){
      break;
   }
   cout << i;
}
```

##3
3つ目の処理について説明します。
この処理は値が増減しないので、永遠に条件式の1つ目で指定した初期値が永遠に出力されてしますだけになります。
これもあまり使い勝手はよくなさそうですが、処理の中で増減の間隔を変えることができるんですね。

```c++
for(i = 0;i < n;){
  cout << i;
  i++//のように条件の中で増減の間隔をかえれます。
}
```

そんな感じで終わりにしたいと思います。
今回は急いでいたので少し雑に書いてしまいましたがある程度要点は抑えたと思っているので許してください。
Ruby on Rails Tutorial【第６版】 の第10章で起きたエラーと対処

Ruby on Rails Tutorial【第６版】 をテキスト通りにやっていて少しハマった箇所がありましたので共有します。

リスト10.33のテストが通りませんでした。原因は２つありました。

##原因1
リスト10.30でメソッドの定義の順番が逆だったことでリダイレクトが上手くできていませんでした。正しくは以下です。

```ruby:sessions_helper.rb
module SessionsHelper

  #(中略)

  #アクセスしようとしたURLを覚えておく
  def store_location
    session[:forwarding_url] = request.original_url if request.get?
  end
    
  #記憶したURL(もしくはデフォルト値)にリダイレクト
  def redirect_back_or(default)
    redirect_to(session[:forwarding_url] || default)
    session.delete(:forwarding_url)
  end

end
```
##原因2
リスト10.32でuser変数と@user変数を混同して使っていました。リスト9.27の演習でassignsメソッドを使ってテストコードの改善をした人は次のように書いてください。

```ruby:sessions_controller.rb
class SessionsController < ApplicationController
  def new
  end
  
  def create
    @user = User.find_by(email: params[:session][:email].downcase)
    if @user&.authenticate(params[:session][:password])
      log_in @user
      params[:session][:remember_me] == '1' ? remember(@user) : forget(@user)
      redirect_back_or @user
    else
      flash.now[:danger] = 'Invaid email/password combination' # 本当は正しくない
    render 'new'
    end
  end
  
  def destroy
    log_out  if logged_in?
    redirect_to root_url
  end
end
```
segue と VIewControllerの増やし方。

###ViewControllerを追加して、新しいファイル、newViewController.swiftを作成しつなげるには。

![スクリーンショット 2021-04-01 16.21.51.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/606144/c1b469b8-cf61-c0a1-499b-a720f714e24a.png)

アイデンティティー・インスペクター上記の、Classesの中身に、newViewControllerを探し、→を押すと接続完了。その際、黄色いアイコンのViewControllerが選択されていて、プルダウンメニューの下の方2追加されている newViewController classを探すことが味噌。