OmniAICreator/Qiita-1.07M huggingface dataset:
rubyで標準入出力からCSVを扱う方法

rubyで標準入出力からCSVを扱う方法

```
require 'csv'
# 標準入力からCSVパース
CSV(STDIN).each do |csv|
  p csv[0]
end

# 標準出力に出力
CSV(STDOUT) do |csv|
  csv << %w(col1 col2 col3)
end
```

https://docs.ruby-lang.org/ja/latest/class/CSV.html

に書いておいてほしいな。。
絶対に解読できない暗号

# はじめに

ワンタイムパッドという暗号をご存じでしょうか？

シーザー暗号やRSA暗号は聞いたことがあるけれども、ワンタイムパッドは聞いたことがないという方が多いのではないかと思います。

ワンタイムパッドは

- 極限までシンプル
- 絶対に解読できない
- 非常に使いにくい

という面白い暗号です。

この記事は、ワンタイムパッドがなぜ解読できないのかをメモしたものです。

# ワンタイムパッドとは

ワンタイムパッド (one-time pad) とは、「メッセージ(平文)と、同じビット長の鍵とのXORを取る」というシンプルな暗号です。
ただし、鍵はランダムなビット列であり、1回 (one-time) しか使ってはいけません。

メッセージを $m$ (message)、鍵を $k$ (key)、暗号文を $c$ (ciphertext) とします。
ワンタイムパッドにおける暗号化は

```math
c = m \oplus k
```

で表されます。例えば $m = 01101101,\, k = 11011001$ のとき $c$ は

```
    m = 01101101
(+) k = 11011001
----------------
    c = 10110100
```

となります。XORは2回行うと元に戻るため、復号化も

```math
m = c \oplus k
```

のように、$k$ とのXORを取る形で表されます。先ほどの例では

```
    c = 10110100
(+) k = 11011001
----------------
    m = 01101101
```

となります。

# ワンタイムパッドの特徴

## ワンタイムパッドは解読できない

ワンタイムパッドは絶対に解読できません。
言い換えれば、ワンタイムパッドにおける暗号文は暗号解読の上で何の情報も提供しません。

確かに直観的には納得できる主張だと思います。
ランダムなビット列とのXORを取るとは、ビットをランダムに反転するということであり、暗号文それ自体も(他者から見た限りでは)ランダムなビット列であるからです。

ところで、実はワンタイムパッドが解読できないことは数学的に証明できます。
後で実際に証明します。

## ワンタイムパッドは使いにくい

ワンタイムパッドはシンプルかつ解読不可能な暗号ですが、実際はほとんど使われていません。
その理由は、非常に使いにくいからです。

ワンタイムパッドでは、メッセージと同じ長さのランダムな鍵を相手に送る必要があります。
しかし、そもそもその鍵はどのように送ればいいのでしょうか？
メッセージと同じ長さの鍵を安全に送ることができるのであれば、そもそも安全にメッセージを送ることができるはずですよね。

他にも、鍵の保存、鍵の生成など、ワンタイムパッドには多くの問題があります。
ただし、大国同士のホットラインなど、機密性が最優先事項である場合は使われることもあるそうです。

# ワンタイムパッドが解読できないことの証明

ワンタイムパッドが解読できないことを、数学的に証明します。
確率に関する基本的な知識を前提とします。

確率変数として、メッセージ $M$ (message), 鍵 $K$ (key), 暗号文 $C$ (ciphertext) を考えます。また各ビット長を $N$ とします。暗号化は

```math
C = M \oplus K \tag{1}
```
で表されます。

ここで何点か確認しておきましょう。

- 鍵 $k$ に対し $K = k$ である確率は $P(K = k) = 2^{-N}$ です。
  これは $K$ が完全にランダムであることによります。

- メッセージ $m$ に対し $M = m$ である確率 $P(M = m)$ は $2^{-N}$ とは限りません。
  メッセージが完全にランダムであるとは限らないからです。

$m$ をメッセージ、$c$ を暗号文とします。目標は、以下の式を示すことです。

```math
P(M = m | C = c) = P(M = m) \tag{2}
```

$P(M = m | C = c)$ は、$C = c$ という条件のもとで $M = m$ となる確率(条件付き確率)です。
$(2)$ は、$C = c$ という条件があってもなくても $M = m$ である確率は変わらない、つまり暗号文は暗号解読の上で何の情報も提供しないということを表しています。

まず条件付き確率の定義から

```math
P(M = m|C = c) = \frac{P(M = m, C = c)}{P(C = c)} \tag{3}
```

です。分子と分母をそれぞれ計算しましょう。分子は

```math
\begin{align}
& P(M = m, C = c) \\
= \quad & P(M = m, K = m \oplus c) \\
= \quad & P(M = m) P(K = m \oplus c) & (\because MとKは独立) \\
= \quad & 2^{-N} P(M = m)
\end{align}
\tag{4}
```

となり、分母は

```math
\begin{align}
& P(C = c) \\
= \quad & \sum_m P(M = m, C = c) \\
= \quad & \sum_m 2^{-N} P(M = m) & (\because (4))\\
= \quad & 2^{-N} \sum_m P(M = m) \\
= \quad & 2^{-N} \\
\end{align}
\tag{5}
```

となります。したがって $(3), (4), (5)$ から

```math
\begin{align}
& P(M = m|C = c) \\
= \quad & \frac{P(M = m, C = c)}{P(C = c)} \\
= \quad & \frac{2^{-N} P(M = m)}{2^{-N}} \\
= \quad & P(M = m)
\end{align}
\tag{6}
```

となり $(2)$ が示されました。

# 最後に

この記事では、ワンタイムパッドが解読できないこと、つまり暗号文が暗号解読の上で何の情報も提供しないということを証明しました。[^1]

これを機に、暗号に興味を持った方は暗号技術について調べてみてはいかがでしょうか。
また、情報と確率の関係に興味を持った方は情報理論について調べてみてはいかがでしょうか。

# 参考文献

- 暗号技術入門 第3版 秘密の国のアリス
- [Proving the semantic security of the One Time pad](https://crypto.stackexchange.com/questions/20748/proving-the-semantic-security-of-the-one-time-pad)

[^1]: ただし、暗号文からメッセージのビット長を推定することはできます。
jQueryでclickイベントのDom取得

# はじめに
jQueryのクリックイベントで発火元のDOMを取得する方法をご紹介します。
コールバック関数が、無名関数`function()`を使う場合とアロー関数`() => {}`を使う場合で異なりますので、その点についてご紹介できればと思います。

## 環境
- ES6
- jQuery3.3.1

イベントの発火元は以下のボタンを想定しております。

```html
<button type="button" class="add-item" data-index="1">追加</button>
```

## 無名関数を使う場合

```javascript
$('.add-item').on('click', function() {
  const value = $(this).data('index');
  console.log(value);
});

// 1
```

```javascript
$('.add-item').on('click', function (event) {
  const value = $(event.target).data('index');
  console.log(value);
});

// 1
```

## アロー関数を使う場合

```javascript
$('.add-item').on('click', (event) => {
  const value = $(event.target).data('index');
  console.log(value);
});

// 1
```

アロー関数では`this`の中身が違う物になります。
詳しくは以下のサイトが詳しく説明してくれていますので、参考にしてみてください。
[【JavaScript】アロー関数式を学ぶついでにthisも復習する話](https://qiita.com/mejileben/items/69e5facdb60781927929)

## 参考
- [jQueryでwebサイト上でクリックした箇所を判別し操作する方法](https://sterfield.co.jp/designer/jquery%E3%81%A7web%E3%82%B5%E3%82%A4%E3%83%88%E4%B8%8A%E3%81%A7%E3%82%AF%E3%83%AA%E3%83%83%E3%82%AF%E3%81%97%E3%81%9F%E7%AE%87%E6%89%80%E3%82%92%E5%88%A4%E5%88%A5%E3%81%97%E6%93%8D%E4%BD%9C%E3%81%99/)
[GCP]API経由でCloud Strageへファイルをアップロードする方法

# はじめに
API経由でCloud Strageへファイルをアップロードする方法をまとめています。

参考URL
https://cloud.google.com/storage/docs/uploading-objects?hl=ja

# アクセストークンの取得手順
## 1. アクセストークンの取得ページへ移動
以下にアクセスします。
https://developers.google.com/oauthplayground/?hl=ja
（OAuth 2.0 Playground のページです）

## 2. アクセストークンを取得したいサービスの選択
以下の画面が表示されたら、以下の順番でクリックします。
　1. Cloud Strage API v1
　2. `https://www.googleapis.com/auth/devstrage.read_write`
　3. Authorize APIs

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/402872/421bd6df-a9f5-c773-cbd5-343f0e3d9951.png)

## 3. アカウントの選択
以下の画面が表示されたら、アカウントを選択したのち、「許可」をクリックします。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/402872/3f87fa9f-9065-f4c9-6fc8-413b3797f717.png)

## 4. アクセストークンの発行
以下の画面が表示されたら「Excange authorization code for tokens」をクリックします。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/402872/1a437221-3112-e764-fb4e-17715ccd21aa.png)

## 5. アクセストークンの表示
以下の画面が表示されたら「Step 2Exchange authorization code for tokens」をクリックしてください。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/402872/813e8cc3-3003-629a-d059-ab9c66d187fa.png)

以下の画面の「Access token」の欄に記載している文字がアクセストークンです。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/402872/fcfd80a9-01a3-d6c4-7eb0-74617aa1824f.png)

# API経由でのファイルアップロード手順
## 1. curlコマンドの組み立て
以下のコマンドを組み立てます。

```shell
curl -X POST --data-binary @[OBJECT] \
    -H "Authorization: Bearer [OAUTH2_TOKEN]" \
    -H "Content-Type: [OBJECT_CONTENT_TYPE]" \
    "https://www.googleapis.com/upload/storage/v1/b/[BUCKET_NAME]/o?uploadType=media&name=[OBJECT_NAME]"
```

入力する内容は以下の通りです。

|変数名|入力する内容|
|:----------|:-----------|
|[OBJECT]|アップロードしたいファイル名|
|[OAUTH2_TOKEN]|先ほど入手したアクセストークン|
|[OBJECT_CONTENT_TYPE]|コンテントタイプ（テキストファイルなら text/plain など）|
|[BUCKET_NAME]|バケット名|
|[OBJECT_NAME]|バケットに保存したあとのファイル名|

## 2. curlコマンドの実行
上記の手順で組み立てたcurlコマンドを実行します。
するとCloud Strageにファイルがアップロードされます。

# 備考
アクセストークンは1時間ほどで有効期限が切れてしまうため、定期的に更新する必要があります。
継続的にAPIを利用するための、リフレッシュトークンを用いたアクセストークンの取得方法は以下にまとめています。

[GCP]継続的にAPIを利用するための、リフレッシュトークンを用いたアクセストークンの取得方法
https://qiita.com/hanzawak/items/7355142f884cb56a4d57
【GAS】翌日が日本の祝日ならSlackに通知

# きっかけ
家に設置してある物理カレンダーが2019年限定祝日「即位礼正殿の儀」に対応しておらず、
本当に祝日か不安となったためです。

#コード仕様
Google が提供している「日本の祝日」カレンダーの内容を GASとSlack の Webhook を利用して Slack に通知と飛ばします。
また、翌日が祝日でない場合は通知は飛びません。

# 参考サイト
以下のサイト手順、コードを参考としました。
コードの著作権は作成者である「スズキアユミ」様となります。
>Slack Bot：毎朝Googleカレンダーの予定を通知してくる秘書ねこBotの作り方 | デザインメモ 2.0
>https://designmemo.jp/creative/bot-googlecalendar-slack.html

# 事前準備
Slack Webhook URL 取得などの一連の手順は参考サイトなどをご参考ください。
最低限、以下の3つは必要となります。

- Slackへの登録
- Slack にて Incoming WebHooks URLを取得
- Googleアカウントの作成

#GASコード
下部にある Webhook URL を記載する箇所は自身で取得した Webhook URL を記載してください。

```public_holiday.gs

function myFunction() {
  
  var list = "";
  var s;
  var calId = "ja.japanese#holiday@group.v.calendar.google.com"; //「日本の祝日」GoogleカレンダーのID
  
  s = listupEvent(calId); // function listupEvent を呼び出し
  if (s != "")  list += "\n■明日の祝日\n" + s; // メッセージの見出し作成

  Logger.log(list);

  if (list != "") {
    var payload = {
      "text" : "おはようございます。\n明日は祝日です。今日一日頑張って明日は気兼ねなく休みましょう！\n" + list, // メッセージの本文
    }

    postSlack(payload);
  }
}

function listupEvent(cal_id)
{
  var list = "";
  var cal = CalendarApp.getCalendarById(cal_id);
  var now = new Date();
  var tomorrow = new Date(now.getFullYear(), now.getMonth(), now.getDate() + 1);
  var events = cal.getEventsForDay(tomorrow);
  
  for(var i=0; i < events.length; i++){
    s = "";
    if (events[i].isAllDayEvent()) {
      s += Utilities.formatDate(events[i].getStartTime(),"GMT+0900","MM/dd  ");
    } else {
      s += Utilities.formatDate(events[i].getStartTime(),"GMT+0900","MM/dd HH:mm");
      s += Utilities.formatDate(events[i].getEndTime(), "GMT+0900","-HH:mm  ");
    }
    s += events[i].getTitle();
    Logger.log(s);

    list += s + "\n";
  }

  return list;
}

function postSlack(payload)
{
  var options = {
    "method" : "POST",
    "payload" : JSON.stringify(payload)
  }

  var url = "https://XXXXXX"; // ★取得した Webhook URL を記載してください。
  var response = UrlFetchApp.fetch(url, options);
  var content = response.getContentText("UTF-8");
}

```

#まとめ
これで明日が祝日なのかという不安からある程度解放されると思います。
ハッピーマンデー制度のおかげで可変的に祝日が動く日本つらい...。
Jupyter notebookでGPUのメモリ解放されていないときの対応

# 目的
Jupyter Notebook上でTensorflow GPUで実行していると、さっき動いたタスクが動かなくなるという状態がちょいちょい起きました
調べて時間がかかった割には簡単なことだったので、私と同じ初心者のために、私のとった解決策をまとめてみました
おそらく当たり前のことでしょうが、私には時間がかかったので

#環境
Windows10
GPU NVIDIA RTX2070 SUPER
Jupyter Notebook 6.0.1
Python 3.7.4
Tensorflow-gpu 1.14.0
#現象
実行実績のあるTensorflowでGPUを使った計算を流そうとするとエラーがでる
具体的には
(0) Internal: Blas GEMM launch failed 
の様なエラーが出る
#試してみた対処方法

再度実行する（もちろんだめ）
Notebookを一度閉じる（効果なし）　
とりあえずOSをリブートすると解消する
#調べて分かったこと

GPUは負荷が少ないのに、メモリがいっぱいいっぱいまで確保されている
簡単な対処法としてはデバイスマネージャーのディスプレイアダプタのドライバをオフ、オンする（一応解決するが、あまりやりたくない）
#根本解決手法
そもそも別のNotebookで計算を流した後に、別の計算を流そうとした際にエラーがでることが気が付き、前の計算のNotebookをJuypter Notebook上でShutdownしてみると、GPUのメモリが解放されたことを確認
結果的にはJupyter Notebookでは計算が終わってもプロセスが残るのでGPUのメモリが解放されないということのようですね
#対処法まとめ
GPUを使った計算でエラーが出た際には、プロセスマネージャーでGPUのメモリを確認し、確保されてしまっている場合には、
１．Notebook上で以前のプロセスをShutdownする
２．それでもだめな場合はデバイスマネージャー上でディスプレーアダプタのドライバをオフ、オンする
３．最後の手段をWindowsをリブート
が対処法となるようです
EC2のLaravel6.0環境でMailgunを使いメール送信する　AWS/Laravel連載(14)

# はじめに

Laravelでメールを送ります。

SMTPサーバがなくても、LaravelではMailgunやPostmark、Amazon SES等を使い簡単に素早くメール配信ができます。
SESは東京リージョンが無いので、今回はMailgunを使います。

<img width="530" alt="local.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/199678/cc417efe-6f49-7813-447d-ed100972de2f.png">

# Mailgunの登録をする

Try Mailgun Nowボタンを押して登録します。
「Add payment info now」：今すぐ支払情報を入力する　のチェックは外しておきましょう。

「Hi ○○, please verify your Mailgun account」というメールが届いているので、リンクを踏んでメールアドレスの認証を行います。

登録段階ではSandboxで１日に３００通のメールしか配信できません。
本来はドメイン登録を済ませると１日１万通まで送れるようになりますが、今回はそのままSandboxで使っていきます。

# EC2にGuzzle HTTPライブラリを入れる

基本的にLaravelの[公式ドキュメント](https://readouble.com/laravel/6.0/ja/mail.html)に沿って進めます。

```powershell
$ composer require guzzlehttp/guzzle
```

上記公式ドキュメントではconfig/mail.phpやconfig/services.phpファイルを更新するよう勧めていますが、Laravelは.envファイルでそのあたりの定数を設定できます。

```php:.env
...
MAIL_DRIVER=mailgun
MAILGUN_DOMAIN=YOUR_MAILGUN_DOMAIN
MAILGUN_SECRET=YOUR_SECRET_KEY
...
```

YOUR_MAILGUN_DOMAINとYOUR_SECRET_KEYには、MailgunのダッシュボードのTry nowの中にあるcurlコマンドを見て値を置き換えます。

YOUR_MAILGUN_DOMAIN
ttps://api.mailgun.net/v3/xxxxx.mailgun.org/messages
のxxxxx.mailgun.org部分を入れます。Sandboxなら、sandbox~~~から始まるはずです。

YOUR_SECRET_KEY
curl -s --user 'api:xxxxx' \
のapi:以降を入れます。

ここまで全て対応すると、mailgunでメール送信ができるようになっています。

# パスワード再発行メールを送信する

今までの連載に沿っていると、php artisan make:authで作った認証機能が実装されているはずです。
ログインしている場合は１回ログアウトし、ログイン画面の「パスワードを忘れた場合」リンクを踏みます。
あとはmailgunに登録したアドレスと同じ自分のアドレスを入れて（あらかじめこのメールアドレスで会員登録が必要）、再発行ボタンを押すとメールが届きます。

# 届いたメールを日本語化する

恐らく英語のメールが届きます。
ローカライズしたいので、元ファイルを調べます。

grepかけると
vendor/laravel/framework/src/Illuminate/Auth/Notifications/ResetPassword.php
にパスワード再発行メールの本文が、

vendor/laravel/framework/src/Illuminate/Notifications/resources/views/email.blade.php 
に最下部の注意事項が

書かれていることが分かります。

vendor/laravel下を直接修正してしまうと、git cloneして別のユーザーが開発した場合に変更点が反映されません（vendor/laravel下はcomposerでインストールされるため）。
ソースコードを見ると多言語対応した書かれ方をしているので、以前と同様にresources/lang/ja.jsonファイルで日本語に対応させます。

```json:resources/lang/ja.json
{
...
    "Hello!": "ご利用ありがとうございます。",
    "Reset Password Notification":  "パスワード再設定のお知らせ",
    "You are receiving this email because we received a password reset request for your account.": "あなたのアカウントでパスワード再発行のリクエストがありました。",
    "This password reset link will expire in :count minutes.": "再設定URLの有効期限は :count 分です。",
    "If you did not request a password reset, no further action is required.": "もしパスワード再発行をリクエストしていない場合、操作は不要です。",
    "If you’re having trouble clicking the \":actionText\" button, copy and paste the URL below\ninto your web browser: [:actionURL](:actionURL)": "\":actionText\"ボタンを押しても何も起きない場合、以下URLをコピーしてWebブラウザに貼り付けてください。\n[:actionURL](:actionURL)",
    "Regards": "よろしくお願いいたします",
...
}
```

※日本語訳は意訳なので、自由に変えてください。

Regards, のカンマがlangじゃなくソースコードベタ書きされているので、
よろしくお願いいたします,
という日本語としては不格好になってしまうのは致し方ないですね…

本日は以上です。

<img width="530" alt="local.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/199678/cc417efe-6f49-7813-447d-ed100972de2f.png">
jHipster自己学習(2)

#jHipsterの画面をいじってみる

jHipsterを触っていて感じたことや、
気になったことなどを個人的にまとめています。
間違った情報などあればご指摘ください。
※むしろ教えて欲しいです。
※MACで開発しています。

##jHipsterの画面の立ち上げる

今回は学習のためReactを選択してプロジェクトを作成し、gitにあげて、いつでも戻せるようにしたところから作業スタートします。

まずは、ヘッダーにに表示されている情報を修正します。
画面表示を確認するために、ルートディレクトリで、下記コマンドを別々のコマンドで実行する。


```
./mvnw
```


```
npm start
```
すると、画面が立ち上がり、プロジェクト作成直後の画面が立ち上がります。
<img width="1090" alt="スクリーンショット 2019-10-22 9.51.59.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/517693/f717913f-fcab-de76-7e8b-e26ce1a9e460.png">

トップ画面に存在する情報を書き換えていきます。

##ヘッダーの文字を修正する

ルートディレクトリからみてsrc配下のファイルを編集します。
※実際にブラウザから読み込まれているのはtarget/www配下のモジュール

mavenのみのビルドの場合、TypeScriptの変更が即時反映されないため、Nodeサーバを立ち上げて、そこへブラウザアクセスして確認します。

<img width="1092" alt="スクリーンショット 2019-10-22 9.57.53.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/517693/30b2570d-8173-a672-6fc2-a2506b36318f.png">

下記ファイルを確認すると、ヘッダ描写に関する情報が乗っているのがわかります。
`src/main/webapp/shared/layout/header/header-components.tsx`

が・・・当該箇所の記述を確認すると、

```html

export const Brand = props => (
  <NavbarBrand tag={Link} to="/" className="brand-logo">
    <BrandIcon />
    <span className="brand-title">
      <Translate contentKey="global.title">Review Comparison</Translate>
    </span>
    <span className="navbar-version">{appConfig.VERSION}</span>
  </NavbarBrand>
);
```

Translateというタグで囲まれているのがわかります。
こちらは、言語設定に応じて描写する情報を変えるためのタグで、jHipsterでプロジェクト作成時になんの言語を選択したのか、によって分岐する様子です。

ここのTranslateを外して、表示しても良いのですが・・・描写するために使用している設定ファイルの方を変更します。

修正する対象ファイルは、
`src/main/webapp/i18n/ja/global.json`です。

header-components.tsx側でタグに振られたキーが、
contentKey="global.title"　
ここに対応する日本文言を変更します。

余談ですが・・・i18nは「Internationalization」の最初が「i」、最後が「n」、間に１８文字アルファベットがあるから、だそうです。
Webで調べました。

```json

{
  "global": {
    "title": "Review_comparison",
    "browsehappy": "<strong>古い</strong>ブラウザーが使われています。より良い体験を得るために<a href=\"http://browsehappy.com/?locale=en\">ブラウザをアップデート</a>してください。",
    "menu": {
      "home": "ホーム",
      "jhipster-needle-menu-add-element": "JHipster will add additional menu entries here (do not translate!)",
      "entities": {
        "main": "エンティティ",
```

"title"に設定されている情報を変更します。
<img width="1093" alt="スクリーンショット 2019-10-22 10.09.44.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/517693/955c9e11-aa35-8009-27a6-58e1f079e23e.png">
ヘッダー文字が変わりました。

まとめると・・・
`src/main/webapp/` 配下に画面描写の情報を持っているファイルがあり、
Translateタグに囲まれている場合(または囲む場合)、contentKeyから参照される日本語文言が表示されます。

日本語文言は
`src/main/webapp/i18n/ja/` 配下に存在するため、そこを変更すると文言が変更できます。

多言語対応がすでに入っていて、国ごとの設定ファイルとして管理する、ということですね。（あまりたくさんのフレームワークを経験してないので、あまり知らない・・・）

##画面レイアウトを変更する
新規作成したmacOS CoreDataアプリでデータが保存されない場合の設定

この記事ではmacOS Catalina 10.15、Xcode 11.1を使用しています。
初心者で、初めての投稿です。

## アプリ終了時にデータが保存されない？
Xcode 11.1を使って、Core Dataのシンプルなテストアプリを作ってみたところ、アプリ終了時にデータが保存されない現象が発生しました。

macOS Catalinaにアップデートする前は問題なく動作した手順だったのですが、Custom macOS Application Target Propertiesに新たな設定が追加されていて、それが影響しているようでした。

追加されていたのは、次の２つのKeyです。Targetの、Infoタブにあります。

|Key|Value|
|:--|:--|
|Application can be killed immeditately when user is shutting down or logging out| YES|
|Application can be killed to reclaim memory or other extraordinary circumstances|YES|

たぶん、このせいで、Quit時に

```Swift:AppDelegate.swift
func applicationShouldTerminate(_ sender: NSApplication) -> NSApplication.TerminateReply {}
```

が呼び出されていないようです。

これらをNOに設定することで、データは保存されるようになりました。

## データの保存場所（App Sandboxの設定）

ただ、データの保存場所が、ライブラリ\Application Supportから、ライブラリ\Containersに変更になっていました。もしかしたらCatalina以前から変更になっていたのかもしれませんが、これは（アプリ名）.entitlementsファイルの設定が

|Key           |Value|
|:-------------|:----|
|App Sandbox   |YES  |

になっているからでした。
RailsにおけるCache戦略について（フラグメントキャッシュ）

ここでは、[フラグメントキャッシュ](https://railsguides.jp/caching_with_rails.html#%E3%83%95%E3%83%A9%E3%82%B0%E3%83%A1%E3%83%B3%E3%83%88%E3%82%AD%E3%83%A3%E3%83%83%E3%82%B7%E3%83%A5)(viewにおけるキャッシュ)についてまとめています。

# 注意： 時間の経過とともにレスポンスが変化するデータのキャッシュについて

[こちらを参照](https://qiita.com/luigiii/items/b5e8bde392f1f256cd7e#%E6%B3%A8%E6%84%8F-%E6%99%82%E9%96%93%E3%81%AE%E7%B5%8C%E9%81%8E%E3%81%A8%E3%81%A8%E3%82%82%E3%81%AB%E3%83%AC%E3%82%B9%E3%83%9D%E3%83%B3%E3%82%B9%E3%81%8C%E5%A4%89%E5%8C%96%E3%81%99%E3%82%8B%E3%83%87%E3%83%BC%E3%82%BF%E3%81%AE%E3%82%AD%E3%83%A3%E3%83%83%E3%82%B7%E3%83%A5%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A6)。


# はじめに覚えておくこと

- `Rails.cache.fetch` このメソッドで、キャッシュのread/writeが両方出来る。
- `<cache_key>` 後述の通り、基本的にRailsが用意しているものを使う。
- `expires_in` キャッシュの有効期限を指定する。

# 実装例

```
<% @products.each do |product| %>
  <% cache product do %>
    <%= render product %>
  <% end %>
<% end %>
```

生成されるキャッシュのキー

```
views/products/1-201505056193031061005000/bea67108094918eeba42cd4a6e786901
```
以下の要素から構成されています。

- views/<テーブル名>
- id
- レコードのupdated_at
- テンプレートツリーダイジェスト（キャッシュされるビューフラグメントの内容から算出されたハッシュダイジェスト。ビューのHTMLが変更された場合にもキャッシュは更新されるので、そのために利用）

## 特定の条件でキャッシュしたい場合

`cache_if`、`cache_unless`を使用可能。

```
<% cache_if admin?, product do %>
  <%= render product %>
<% end %>
```

## コレクションキャッシュ

```
<%= render partial: 'products/product', collection: @products, cached: true %>
```

# ログ

```
Cache read: views/e2a9dc497/top_page/show:e7f6dd0afce2b83daec666e202917715/ja/users/30-20191010012413000000/toppage/show
```

# その他（Railsのデフォルトではないキャッシュについて）

以下は、Rails4で本体から取り除かれて、gem化されたものです。

### ページキャッシュ
- Rails 4本体から取り除かれ、gem化された。[actionpack-page_caching](https://github.com/rails/actionpack-page_caching)を参照。
- 認証が不要なページのキャッシュに使われる。
- nginxなどのwebサーバーによって生成されるページへのリクエストを（Railsスタック全体を経由せずに）キャッシュするメカニズム。

→ ページキャッシュではなく、CDNやリバースプロキシを使うのが一般的。

### アクションキャッシュ
- Rails 4本体から取り除かれ、gem化された。[actionpack-action_caching](https://github.com/rails/actionpack-action_caching)を参照。
- リクエストがRailsスタックにヒットしたときに、before_filterを実行してからキャッシュを返す。認証が必要なページでも有効。
Go言語の便利なところ

#はじめに
長年JAVAをやってきました。JAVAと比較してGoでは便利だと思うのは、まず２点があります。
・変数の値交換
・関数に複数戻り値の定義可能

#変数の値交換
##JAVA例
```java
int a = 10;
int b = 20;

// 一時変数が必要です。
int temp = a;
a = b;
b = temp
```

##Go例
```go
a := 10
b := 20

// 値交換：一時変数不要。バブルソート (bubble sort) の交換処理など
a, b = b, a
```
変数は減らすことでコードは見やすくなります。

##JAVAでは関数の戻り値について
###戻り値がない場合
```java
private void doSomething() {
    // return句省略可
}
```

###戻り値がある場合
```java
private String getSomething() {
    // return句が必須
    return "xxx"; 
}
```

戻りは一回一つしか設定できません。複数戻りたい時はArray、List、Map、INFOクラス作成するなどが必要です。

##Goの関数の戻りについて
###戻り値がない場合 ※戻り値関連記載不要
```go
func doSomething() {
	// doSomething
}
```


###一つ戻り値の場合:　戻りの型だけ定義
```go
func main() {
	result := doSomething()
	fmt.Println(result)
}

func doSomething() string {
	// doSomething
	return "テストです"
}
```

###一つ戻り値の場合:　戻りの型と変数名両方定義
```go
func main() {
	result := doSomething()
	fmt.Println(result)
}

func doSomething() (result string) {
	// doSomething
	result = "テストです"
	return
}
```

###複数戻り値の場合:　戻りの型だけ定義
```go
func main() {
	userName, age, gender := doSomething()
	fmt.Println(userName, age, gender)
}

func doSomething() (string, int, bool) {
	// doSomething
	return "田中", 20, true
}
```

###複数戻り値の場合:　戻りの型と変数名両方定義
```go
func main() {
	userName, age, gender := doSomething()
	fmt.Println(userName, age, gender)
}

func doSomething() (userName string, age int, gender bool) {
	// doSomething
	userName = "田中"
	age = 20
	gender = true
	return
}
```

また、複数戻りに対して「_」で戻り値が使わないようにするという書き方は便利です。

```go
userName, age, _ := doSomething()
```

例えば、JAVAのMapに値を取得する際に、キーの存在しない場合、値はnullの場合は区別できないため、
それぞれのメソッドを利用する必要あります。
存在チェック例：map.containsKey("userName")
値取得例： map.get("userName")

よくあるMapからの取得サンプルコード：

```java
String userName = "";
if (map.containsKey("userName")) {
    userName = map.get("userName")
}
```

Goの場合は、同時に存在チェックの結果を帰ってくるので、便利です。

```go
func main() {
	m := map[string]string{"user1": "1", "user2": "2"}
	value, ok := m["user1"]
        // 存在する場合はok=true   存在しない場合はok=false
	fmt.Println(value, ok)
}
```

Goの便利なところの一例でした。

以上
Lambda関数で使ってるランタイムの数を確認したい

# はじめに

`Node.js 8.10 is EOL, please migrate your functions to a newer runtime version` ということらしい。
Node.js 8って全リージョン合わせてどのくらい使ってたっけ? というときに確認方法のメモを残しておく。

# 結論

事前準備できてる状態で、次の内容のシェルスクリプトを実行する。

```bash
#!/bin/bash
region_list=$(aws ec2 describe-regions|jq -r '.[][].RegionName'|sort)
runtime_list=$(for x in $region_list; do aws --region $x lambda list-functions| jq -cr '.[][]|.Runtime'; done)
key_list=$(echo "$runtime_list" | sort -u)
total=$(echo "$runtime_list"|wc -l)
for x in $key_list; do c=$(echo "$runtime_list" | grep $x | wc -l); p=$(echo "scale=2; 100 * $c / $total"|bc -l); echo "$x: $c ($p%)"; done
```

# 事前準備

### ソフトウェア

AWS CLIとjqの準備が必要だ。
他にも使ってるが、LinuxやMacなら最初からあるだろう。

### 権限

対象ユーザーでは次の権限が必要になる。

```json
{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Sid": "EC2DescribeRegions",
            "Effect": "Allow",
            "Action": "ec2:DescribeRegions",
            "Resource": "*"
        },
        {
            "Sid": "LambdaListFunctions",
            "Effect": "Allow",
            "Action": "lambda:ListFunctions",
            "Resource": "*"
        }
    ]
}
```

# 順を追って実行する

### リージョン一覧を取得する

まずは、 `aws ec2 describe-regions` でリージョン一覧を取得する。
そして、jqでリージョン名だけの一覧に加工しておく。

```bash
region_list=$(aws ec2 describe-regions|jq -r '.[][].RegionName'|sort)
echo "$region_list"
# 例えば、こんな結果が得られる。
#   ap-northeast-1
#   ap-northeast-2
#   ap-south-1
#   ap-southeast-1
#   ap-southeast-2
#   ca-central-1
#   eu-central-1
#   eu-north-1
#   eu-west-1
#   eu-west-2
#   eu-west-3
#   sa-east-1
#   us-east-1
#   us-east-2
#   us-west-1
#   us-west-2
```

### 関数一覧

次に、 `aws --region region-name lambda list-functions` で各リージョンの関数一覧を取得する。
そして、jqでランタイム名だけの一覧に加工しておく。

```bash
runtime_list=$(for x in $region_list; do aws --region $x lambda list-functions| jq -cr '.[][]|.Runtime'; done)
echo "$runtime_list"
# 例えば、こんな結果が得られる。
#   nodejs8.10
#   python3.6
#   nodejs8.10
#   python3.7
#   nodejs8.10
#   python3.7
#   nodejs8.10
#   provided
#   nodejs8.10
#   nodejs8.10
#   nodejs8.10
#   nodejs8.10
#   nodejs8.10
#   provided
#   python3.6
#   python3.6
#   nodejs10.x
#   python3.6
```

### ランタイム名のユニークをとる

次に、ランタイム名だけの一覧からユニークをとる。

```bash
key_list=$(echo "$runtime_list" | sort -u)
echo "$key_list"
# 例えば、こんな結果が得られる。
#   nodejs10.x
#   nodejs8.10
#   provided
#   python3.6
#   python3.7
```

### 数える

最後に、それぞれのランタイムを使ってる関数を数える。

```bash
total=$(echo "$runtime_list"|wc -l)
echo $total
for x in $key_list; do c=$(echo "$runtime_list" | grep $x | wc -l); p=$(echo "scale=2; 100 * $c / $total"|bc -l); echo "$x: $c ($p%)"; done
# 例えば、こんな結果が得られる。
#   nodejs10.x: 1 (5.55%)
#   nodejs8.10: 9 (50.00%)
#   provided: 2 (11.11%)
#   python3.6: 4 (22.22%)
#   python3.7: 2 (11.11%)
```
MachineLearningの基本的な手順ーーCourseraのMachineLeaningを完走したので復習する１ーー

##この記事での表記法
m: examplesの数
n: featuresの数
y: Vector of Actual Values
X: Matrix of Features
θ: Vector of Parameters

```math
y =
\begin{pmatrix}
y^{(1)}\\
y^{(2)}\\
.\\
.\\
y^{(m)}\\

\end{pmatrix}
```

```math
X=
\begin{pmatrix}
X^{(1)}_1\ & X^{(1)}_2 \ & .... \ &  X^{(1)}_n \\
X^{(2)}_1\ & X^{(2)}_2 \ & .... \ &  X^{(2)}_n \\
.\ & .\ & .... \ &  . \\
.\ & .\ & .... \ &  . \\
X^{(m)}_1\ & X^{(m)}_2 \ & .... \ &  X^{(m)}_n \\

\end{pmatrix}
```

```math
\theta=
\begin{pmatrix}
θ_1\\ θ_2\\ θ_3\\ .\\.\\. \\ θ_n

\end{pmatrix}
```

とする。


以降、線形回帰（Liner Regression）を例に機械学習の大まかな流れを記述していく。
# 1.TrainingSetを使ってモデルを作る
##  1-1 とりあえずモデル[仮説hθ(x)]を作る
$ h\theta \left( x\right) =\ \theta X=\theta_{0}x_{0}+\theta_{1}x_{1}+\ldots +\theta_{n}x_{n} $
$ ※​x_{0}=1 $	

```math
h\theta\left( x\right) =
\begin{pmatrix}
h\theta\left( x^{(1)}\right)\\
h\theta\left( x^{(2)}\right)\\
.\\
.\\
h\theta\left( x^{(m)}\right)\\

\end{pmatrix}
```


##1-2 CostFunction J(θ)[仮説の値と実際の値の誤差を算出する関数]を作る 
J(θ)=[仮説hθ(x)により算出された値と実際の値yとの平均二乗誤差 (Liner Regressionの場合)]
$J\left( \theta \right) =\dfrac {1}{2m}\sum ^{m}_{i=1}\left( h\theta \left( x^{(i)}\right) -y^{(i)}\right) ^{2}$



##1-3 CostFunction J(θ)[誤差]が最小になるθを見つける
例.Batch Gradient Descent
Repeat{
$\theta _{j}:=\theta _{j}-\alpha \dfrac {\partial }{\partial \theta _{j}}J\left( \theta \right)$
(simultaneously update for every j=0...n) 
}

 J(θ)が収束する（$\dfrac {\partial }{\partial \theta _{j}}J\left( \theta \right)$＝０になる[極小値をとる]）までθを変化させ続けることで、
CostFunction J(θ)[誤差]がおおよそ最小になるθを見つける。
→hθ(x)を正確にする。

#2 モデルの正確性を新しいDateSet[CrossValidationSet]を用いて検証
##IF モデルが単純すぎると・・・・・
モデルがデータの特徴（分布）を捉えきれていないためUnderfit（high bias）が起こる。
この場合、モデルが単純すぎてデータの特徴を捉えられないところに問題があるため、データを増やしたところで、モデル自体の構造を変えない限り結局問題の解決にはならない。

#####解決策：単純すぎるモデルを複雑にする
・使うfeaturesを増やしてみる。
・polynomial features を作ってみる。

##IF モデルが複雑すぎると・・・・・
TrainigSetにおけるデータにはモデルが綺麗にフィットする。しかし、それは言い換えればフィットしすぎていることでもあり、新しいデータセットにモデルがフィットしない事態が起こる。つまり、Overfit(high varience)はモデルが複雑すぎるゆえに、トレーニングデータセットの特徴を捉えすぎるため起こる。

#####解決策：モデルの複雑性を減らす or データを増やす。
・smaller sets of features
Ruby の shoryuken gem は AWS SQS のリトライ処理をどうやって実現しているのか？ ( Rails ActiveJob の例 ) #AWS #Rails 

shoryukenはAWS SQS の可視性タイムアウトの仕組みを使ってリトライを実現していそうな気がした。
https://github.com/phstc/shoryuken/blob/master/lib/shoryuken/middleware/server/exponential_backoff_retry.rb#L54

```
 sqs_msg.change_visibility(visibility_timeout: next_visibility_timeout(interval.to_i, started_at))
```

AWS SQSではキュー単位ではなく、メッセージ単位での可視性タイムアウト指定というのが出来て。この仕組を使ってるのかな。

>複数メッセージの可視性タイムアウトを設定する (例: メッセージごとに異なるタイムアウト値を設定する) には、ArrayList を作成して、可視性タイムアウト (秒) を設定したメッセージを追加し、メッセージのキュー URL および ArrayList を渡します。

https://docs.aws.amazon.com/ja_jp/AWSSimpleQueueService/latest/SQSDeveloperGuide/sqs-configure-visibility-timeout-queue.html

そうすると ActiveJobで retry を書いておけば shoryuken がその仕組みを使ってくれるため、特にAWS SQS のキュー設定を意識する必要はない気がした。

むしろAWS SQSの仕組みにのっとらない形でリトライを実現していたらびっくりするし、使い物にならないはずだよね。

```rb
class ShoryukenExampleRetryJob < ApplicationJob
  queue_as :default

  class SomeJobError < StandardError; end

  retry_on SomeJobError, wait: 3.seconds, attempts: 3 do |job, exception|
    # リトライが全て失敗した時の処理をここに書く
    puts "SURRENDER!"
  end

  def perform(message)
    puts "PERFORM! #{message}"
    raise
  rescue
    raise SomeJobError.new('Watch out!')
  end
end

```

# Original by Github issue

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








<!-- Update From Qiita API -->

# チャットメンバー募集


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

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





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->
じゃんけんゲームに現れる数学の話

# 概要
Rubyist Magazine 0002号の記事 [Ruby ではじめるプログラミング 【第 1 回】](https://magazine.rubyist.net/articles/0002/0002-FirstProgramming.html)を読みながらじゃんけんゲームを作って遊んでいたら，割り算の余りに着目してプログラムを簡潔にできることに気が付き，実際に簡単にした．

# 詳細
## 割り算の定義
負の整数の割り算の余りを考えるので，念のため割り算の定義を確認しておく．
### 定義
任意の整数 $n,m$（ただし $m\neq0$）に対して $n=mq+r$ かつ $0\leq r<q$ を満たす整数の組 $(q,r)$ がただ一つ存在する．このとき，$q$ を「$n$ を $m$ で割ったときの商」，$r$ を「$n$ を $m$ で割ったときの余り」と呼ぶ．

## じゃんけんと割り算の余り

グーを1，チョキを2，パーを3とする．プレイヤーAとコンピュータBの2人でじゃんけんをするとき，結果は全部で9通りである．下記の表はじゃんけんの各場合について B-A を計算したものである．

|A\B|1|2|3|
|:-:|:-:|:-:|:-:|
|1|0|1|2|
|2|-1|0|1|
|3|-2|-1|0|

プレイヤーAが勝つ場合は (A,B)=(1,2), (2,3), (3,1) の3通りであり，B-A の値は1または-2となっている．ここで $1=3\times0+1$，$-2=3\times(-1)+1$ より，1と-2はともに3で割ったときの余りが1となっている．同様に

- あいこの場合，B-A の値を3で割ったときの余りは0
- プレイヤーAが負ける場合，B-A の値を3で割ったときの余りは2

となっている．[Ruby ではじめるプログラミング 【第 1 回】](https://magazine.rubyist.net/articles/0002/0002-FirstProgramming.html)に記載されているプログラムでは，じゃんけんの9通りの場合をすべて列挙しているが，上記の性質を利用すれば下記のように9通りも書かずに実装することができる．

```ruby:rsp.rb
puts 'じゃんけんゲームを起動します'
scene = 'gamestart'
hand = {1 => 'グー', 2 => 'チョキ', 3 => 'パー'}
sleep 1
win = 0     # 勝ちの数
lose = 0    # 負けの数
draw = 0    # 引き分けの数
while true
    case scene
    when 'gamestart'
        puts '何を出しますか？'
        (1..3).each do |n|
            puts "#{n}: #{hand[n]}"
        end
        puts '9: ゲーム終了'
        puts "[現在の戦績: #{win}勝#{lose}敗#{draw}引き分け]"
        com = rand(3) + 1   # コンピュータの手
        player = gets.to_i  # プレイヤーの手
        case player
        when 1, 2, 3
            scene = 'result'
        when 9
            puts 'ゲームを終了します'
            sleep 1
            exit
        else
            scene = 'nothing'
        end
    when 'result'
        puts "あなたは#{hand[player]}を出した！"
        puts "相手は#{hand[com]}を出した！"
        sleep 1
        if (com - player) % 3 == 0
            puts 'あいこです'
            draw += 1
        elsif (com - player) % 3 == 1
            puts 'あなたの勝ちです！'
            win += 1
        elsif (com - player) % 3 == 2
            puts 'あなたの負けです...'
            lose += 1
        end
        sleep 1
        scene = 'gamestart'
    when 'nothing'
        puts 'あなたは何も出さなかった！'
        sleep 1
        puts 'あなたの負けです...'
        lose += 1
        sleep 1
        scene = 'gamestart'
    end
end
```

# 参考
- [Ruby ではじめるプログラミング 【第 1 回】](https://magazine.rubyist.net/articles/0002/0002-FirstProgramming.html)
router-linkで動的リンクを生成する際の書き方まとめ

###Vue.jsのrouter-linkで動的リンクを生成する際の構文をまとめておきます。

画面上に記事が並んでいて、各記事のボタンを押すとその記事のページに遷移する、そんな機能を作っていると考えてください。各記事のid番号は取得できていて、それを使ってリンクを動的に生成したいとします。
ボタンクリックイベントをどのように実装すれば良いでしょうか？

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/466621/6fb269cd-2f9d-3bd6-b8fa-aea83a2325df.png)


##nameで遷移先を指定する方法

toプロパティを使って遷移先を指定する部分が重要。
>name:router.jsのnameプロパティに一致する値を指定
>params:{〇〇(router.jsで受け取るparameter):各記事のid}

###ボタンクリックイベント
```article.vue
<router-link :to="{name:'detail',params:{id:article.id}}">Read more</router-link>
```

###Router.js
```router.js
routes: [{
    path: '/article/:id',
    name: 'detail',
    component: Article
  }]
```

##pathで遷移先を指定する方法
nameで遷移先を指定する方法とは異なり、router.jsのnameプロパティは不要。

同じくtoプロパティを使って遷移先を指定する部分が重要。
>``(バックコーテーション)で囲んでrouter.jsのpathプロパティに合致する値を記述する。パラメータは${}の中に記述する。

###ボタンクリックイベント
```article.vue
<router-link :to="`article/${article.id}`">Read more</router-link>
```

###Router.js
```router.js
routes: [{
    path: '/article/:id',
    // name: 'detail',
    component: Article
  }]
```
JAVASCRIPTの練習（３）

連休４日目、何とか今日中にプログラムの初版に目途を付ける必要がある。

残りの工程表をザクっと書くと

１）バックエンドからＣＳＶファイルを持ってきて、ＨＴＭＬテーブルを作成する
２）ＨＴＭＬをクリックすると、編集可能になる
３）保存ボタンを押すと、確定、更新したＴＡＢＬＥ内容に従って、ＪＳＯＮファイルを排出する

ＵＩの機能としては、
１）ＰＮＧ図面上にホバーリングすると、拡大、移動ができる　→（完成）
２）FLASKのルーティングで、GETに付与させた文書でルーティングさせる　→　（完成）
※　この記事だけでも、結構有用な情報満載である　→　いつかＰＲしたい

とりあえず、FLASKというフレームワーク、まだまだ奥が深い。。。


さて、問題のJAVASCRIPTであるが、指定ファイルを選んで、これをバックエンドから持ってくるところ
指定ファイルを識別するのに、セッションという考え方がいるみたいだが、
この辺は、まだまだ先伸ばしになるだろう（当面は、ワンユーザー限定）

バックエンドのＣＳＶファイル名は、固定されているという前提で、
ファイルを読み込むところをどうすべきか？


10/22 
今日の作業は、結局，ＣＳＶファイルをＨＴＭＬのテーブルに読むところでつまずいた。

ポイントとしては、ＣＳＶをJQUERYで読みこむ際に、タイムラグが生じて、
オブジェクトとしてツリーが生成する前に、スクリプトが先行してしまうことが原因だった。

最終的に、書き上げたコードは下記となる。

```js
$(function() {
  $(document).on('click','#target tr', function(){
  });
  $(document).on('mousemove','#target tr',function(){
	$(this).css("background-color","#CCFFCC") .css("cursor","pointer")
  });
  $(document).on('mouseout','#target tr',function(){
    $(this).css("background-color","#ffffff") .css("cursor","normal")
 });
});
```

上記のコードは、TABLEの上でマウスのクリック、ホバーオン、マウス外れであるが、
同じような書き方を、ずらっと並べさせられている。

このＯＮメソッドというやつが、ポイントだった。
（これで丸一日、費やした自分ことで、連休中のノルマは達成できなかった。）


明日は、会社に行くが、業務でこれだけの時間を割いていたら、
完全に趣味の仕事と思われて仕方がない
（あたかも、さくっと出来たことにしなければ。。。）
vue.js 何かの処理の後にページTOPへスクロールする

```js:some_component.vue
// 関数を作る
methods: {
  scrollToTop: function() {
    scrollTo(0, 0)
  }
}

// 実行
this.scrollToTop()
```

参考にしました。
https://www.sejuku.net/blog/62930#TOP


```js
scrollTo(x軸左右, y軸上下)

// 右へ20px, 下へ100px移動する
scrollTo(20, 100)
```
チョーめんどい、Windows10 で、日本人がくじけそうになる GitHub 連携

# ハマるハマる超ハマる、なんでこんなに GitHub が遠いのか。
普段 Linux を使っている私としては、SSH + atom + GitHubの連携がうまくいっているので問題ないのですが、
これを Windows10 で使用しようとすると大変に困ってシマウマ。
特にユーザ名が日本語だとダメっぽいといううわさがあります。

## 実験そのいち：atom で頑張ってみる。
atom は言わずと知れたエディタです。これには元々GitHub 連携を見据えた機能があります。
しかし、私がいじってみたら、既存のリポジトリにやさしくない。ログインができない。
おそらくatom の設定をリセットすればきちんとできるのでしょうが(確証はありません)、
そんなめんどくさいことをやっている暇があったら次に行きましょう、次。

## 実験そのに：GitHub desktop を頑張ってみる。
次に思いついたのが、GitHub Desktop を使用してみるということです。
さっそく GitHub Desktop をインストールしてクローンしようとすると…、
・パブリックリポジトリ→クローン出来た
・プライベートリポジトリ→だめっぽい

以下のエラーが出てしまいます。

```
error: unable to read askpass response from ‘C:\Users\私の名前\AppData\Local\GitHubDesktop\app-2.1.3\resources\app\static\ask-pass-trampoline.bat’
```

それとなくググってみると、参考URLのように日本語文字が原因でエラーとなってしまうようです。あぁ、なんということでしょう。

## 実験そのさん：Git for Windows を頑張ってみる。
最後の手段です。Git for Windowsを使いました。結果はまぁまぁなのですが、フォントがしょぼくて「本当にこれでいけるのか？」
というくらいシェルの画面がきたないです。
ちょっとハマったこと。
ssh のデフォルトディレクトリがどこにあるか最初わかりませんでした。
 
```bash
# ssh-keygen -f ~/.ssh/id_rsa_hoge
```

と入力してその場所を探ったところユーザ直下にできるようだったので、そこに必要な秘密鍵をコピーしてきて
クローンするとあら不思議、クローンできちゃいました。

クローンのしかたは、私の過去の投稿を参考にしてください。
https://qiita.com/evakichi/items/929d0136e608c10444b3
https://qiita.com/evakichi/items/abb6dde9df78f049b913


あとは atom で修正しまくって push を試みたのですが、 push/fetch/pull どの動作ひとつとっても
atom 上ではことあるごとにパスフレーズを聞かれます。
長いパスフレーズを使っている私にとってはちょっとめんどくさいですが、まぁ GitHub 連携ができたので良しとして
目をつぶることにしています。

またいい方法ができたら書きます。　　…とほほ。
# 参考URL
https://dajya-ranger.com/software/cannot-use-github-desktop/

#追記
やっぱり日本語ユーザ名が災いしていたもようで、半角英数字だけのユーザ名にしたら Github Desktop が使えるようになりました。
【合格しました】AWS認定ソリューションアーキテクト -アソシエイト試験

AWS認定ソリューションアーキテクト -アソシエイト試験に合格したので、勉強方法などを備忘録的に残しておきます。

#スコア
**755点 / 1000点**で合格しました。
![aws-certified-logo_color-horz_270x45.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/353289/7bb5955d-cbec-a623-82ab-6a58fedf4953.png)

合格に必要な最低スコアは720点なので、ギリギリ合格した感じです。

#受験動機
IoTの仕事に関わるようになり、クラウドの知識が必要になったため、受験しました。

#私のスペック
ネットワークの知識、経験はそれなりにあるつもりですが、サーバーのスキルはほぼありません。
AWSを含めクラウドの知識もほぼありません。

これまでに取得したIT系資格は、こんなところです。
・ネットワークスペシャリスト
・IoTシステム技術検定 中級
・陸上特殊無線技士１級
・CCNA（失効）


#試験内容

| 出題分野|出題比率| 
|:----------------|:---------------|
| 回復性の高いアーキテクチャを設計する|34%|
| パフォーマンスに優れたアーキテクチャを定義する|24%|
|セキュアなアプリケーションおよびアーキテクチャを規定する|26%|
|コスト最適化アーキテクチャを設計する|10%|
|オペレーショナルエクセレンスを備えたアーキテクチャを定義する|6%|

試験の内容は、AWSの各サービスの知識を問うものというわけではなく、
AWS Well-Architectedフレームワークに則った設計ができるかどうかを問うもの。

例えば、
・インスタンスが１つ落ちてもサービスを継続できるアーキテクトの設計
・セキュリティを担保したアーキテクトを構築する
そのにはどうすればよいか？ということを求められます。

また、求めているものが、
・コスト度外視で最高のアーキテクチャを構築するケースなのか？
・限られた予算の中で最善のアーキテクチャを構築するケースなのか？
などの条件によって設計思想が変わってきますので、当然答えも違ってきます。

#勉強方法

###勉強期間
4ヶ月程勉強しました。

###教材
・書籍「[AWS認定資格試験テキスト　AWS認定 ソリューションアーキテクト-アソシエイト](https://www.amazon.co.jp/gp/product/B07R1H87Y1/ref=ppx_yo_dt_b_d_asin_title_o05?ie=UTF8&psc=1)」、
・オンライン学習「[Udemy これだけでOK！AWS認定ソリューションアーキテクト -アソシエイト試験突破講座](https://www.udemy.com/share/101WKkBkQfcFhTQ34=/)」
で勉強しました。
オンラインセミナー(AWS Black Belt)や、ホワイトペーパーはあまり活用しませんでした。

###勉強方法
まずは、書籍を一通り読む（よくわからなくても一通り読む）、
その後、Udemyのレクチャで頭の整理を行い、ハンズオンで実際にAWSを動かしながら学習しました。
ハンズオンで実際にAWSを操作するときは、今、どんな作業をしているのかを構成図を書きながら受講すると、より理解が深まると思います。（↓こんな感じに）
![kousei.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/353289/3e97968a-5afb-4f27-a8a4-008e8efce4db.png)

書籍に１つ、Udemyに３つの模擬試験がついていますので、満点になるまで模擬テストを繰り返しました。
正解を当てるだけでなく、誤った選択肢がなぜ違うのかを説明できるくらいまでやりこんだ方がいいと思います。

#twitter
[AWSのtwitterアカウント](https://twitter.com/awscloud_jp)で、毎週木曜日にソリューションアーキテクト-アソシエイト試験の問題がtweetされます。
AWSは次々と新しいサービスが登場するため、書籍やオンライン学習では網羅されていないものが出題されることもあります。

#模擬試験
受験を申し込むと、30問の模擬試験も受けられるようになります（2,000円）。
私は試験2週間前に受講しました。
スコアは76%、「セキュアなアプリケーションおよびアーキテクチャの規定」が弱いという結果だったので、本受験の前に重点的に勉強しました。
（が、結局、本試験でもそこは弱いままでした...）


#本試験
本試験は、書籍やUdemyの模擬試験よりも難しく感じました。
わかる問題を優先的に解いていき、自信のない問題はフラグを立てておき、最後にじっくり考えましょう。
多少わからないことがあっても、じっくり読めば二択までは絞れるはずです。
そのあとは、違和感がある方の選択肢を外すなど他の試験と同じです。


#最後に
以上、私の受験記でした。
これから受験される方に少しでもお役に立てたら幸いです。
レガシーソフトウェア改善ガイド

[レガシーソフトウェア改善ガイド](https://www.amazon.co.jp/dp/4798145149)の読書メモ。


# レガシーの定義

```
保守または拡張が困難な既存のプロジェクトなら、なんでも「レガシー」と呼ぶ
```

# レガシープロジェクトに対する変更と、それらのメリットとリスク

| 変更点 | メリット | リスク | 必要な行動 |
|:-----------------|:------------------|:-------------------|:-------------------|
| 古い機能の除去 | ・開発が容易になる<br>・性能が向上する | ・まだその機能を使っているユーザーがいるかも | ・アクセスログをチェックする<br>・ユーザーに問い合わせる |
| リファクタリング | ・開発が容易になる | ・過失によるリグレッション | ・コードレビュー<br>・テスト |
| ライブラリのアップデート | ・バグフィックス<br>・性能が向上する | ・ライブラリの振る舞いが変化することによるリグレッション | ・変更履歴を読む<br>・ライブラリのコードをレビューする<br>・主な機能を手作業でテストする |

# どのファイルが最も頻繁に編集されるかと知っておく

```bash
$ git log --since="90 days ago" --pretty=format:"" --name-only | \
 grep "[^\+s]" | \
 sort | uniq -c | \
 sort -nr | head -10
```

# リファクタリングの選択肢

> 経験則として、選択肢は次の順に考慮すべきだ
  
> ①置き換え(サードパーティー制ソリューションの購入)
> ②リファクタリング
> ③リライト

# Webアプリケーションのアーキテクチャを比較

| アーキテクチャ | 技術的な利点 | 技術的な難関 | 組織面の利点 | 組織面の難関 |
|:-----------------|:------------------|:-------------------|:-------------------|:-------------------|
| モノリス的 | ・応答が早い<br>・開発が単純<br>・コードの重複が少ない | ・スケーリングに難あり<br>・コードベースが大きくて複雑<br>・予期せぬ相互作用の危険 | ・単一機能に関する情報伝達のオーバーヘッドが低い | ・失敗の恐れ<br>・複数機能に関する情報伝達のオーバーヘッド |
| フロントエンド+バックエンド | ・FEとBEを個別にスケーリングできる<br>・プレゼンテーションとビジネスロジックの切り分け<br>・BEを再利用し、より多くのFEを構築できる | ・ネットワーク呼び出しの煩雑さ | ・分業化<br>・FEのリリースをBEより頻繁に行える<br>・SOAに進む第一歩 | ・情報伝達のオーバーヘッド<br>・情報のサイロ化<br>・FEとBEの開発が互いにブロックする |
| SOA | ・粒度の細かいスケーリング<br>・アイソレーション(隔離)<br>・カプセル化 | ・運用のオーバーヘッド<br>・レイテシン<br>・サービス発見<br>・トレース/デバッグ<br>・ホットスポット<br>・APIのドキュメントとクライアント<br>・統合テスト<br>・データの断片化 | ・自律性 | ・自律性の範囲に関するジレンマ<br>・仕事が重複するリスク |
| マイクロサービス | ・SOAと同様だが、さらに進化 | ・SOAと同様だが、さらに進化<br>・暗黙的な連結のリスク | ・コンテクスト境界による、さらなる自律性 | ・DevOpsが想定される<br>・プラットフォームチームが必要<br>・考え方に大幅なシフトが要求される |
Fedora30 の Qt5.12 で、qDebug がコンソールに出力されない件

Qt4.8 を使っっていた時は、何の問題もなく qDebug が出力されていたのですが、Qt5.12 を使ってみたところ、出力されず、qInfo を試してみたら出力されるという、謎に数時間はまっていました。

どうやら、Qt の仕様に変更があったらしく、以下のような環境変数を設定する事が必要でした。


それぞれのユーザでの設定

```
$ vim ~/.config/QtProject/qtlogging.ini
```

システム全体の設定

```
# vim /etc/xdg/QtProject/qtlogging.ini
```

ファイルの内容

```
[Rules]
*.debug=true
qt.*.debug=false
```

（参考）
  https://brendanwhitfield.wordpress.com/2016/06/08/enabling-qdebug-on-fedora/
初心者の私が出会った、良い勉強サイトとコードエディター

JavaScriptを勉強するにあたり、こちらの記事が大変参考になりました。

■「初めてのWebアプリ作成！全記録！」
https://qiita.com/InamuraYuta/items/f76c5923f056edc795e5

数ある言語の中で、どの言語を学んでいったら良いか分からず、一旦広く浅く知ろうと思ったところ、プロゲートというサイトがあることが分かりました。
■「Progete（プロゲート）」
https://prog-8.com/languages

さらに、「初めてのWebアプリ作成！全記録！」にて紹介されていたこちらのサイトで、動画を見ながらの勉強が快適に進んでいます。

■「ドットインストール」
https://dotinstall.com/

１つ１つの動画が３分以内に終わるようになっており、説明も端的で余計な言葉もなく進んでいくため、やる前に思っていた以上に快適に講義が受けられました。
私はユーチューブをよく見ますが、１０分を超えるような動画はあまり見ません。１０分以上の動画は、見る前に「長い」と感じてしまって、見るまでの敷居が高いのです。
そんな私が抵抗なく、サクサク動画を見ながら、同じようにプログラムを書く作業を続けていけるのは、この動画の作り方がとても上手だからではないかと思います。
有料版と無料版があるのですが、無料でもこの良さは十分に体験できました。

最後に、プログラムを書くためのコードエディターですが、VS codetというものが一番使いやすく感じました。
■「vs code」（ぶいえすこーど）（Visual Studio Code)
https://azure.microsoft.com/ja-jp/products/visual-studio-code/

私はMacを使用しており、「Atom」というエディターを使用していたのですが、フォルダー作成、ファイル作成から、コードを打っている時の補助機能など、とても使いやすくて良かったです。
「Atom」について、私が使い方をまだ全然把握していないから、ということもあるかと思いますが、しばらくはこのvs codeでやっていこうと思います。
これだけ、プログラマーが押さえておくべき AWS Cloud9 の ショートカット

AWS Cloud9 でプログラミングをする際によく使うショートカットの備忘録です。

# 環境

* mac0S

# これだけは押さえる

## コードエディター

## タブの横移動

いくつもソースコードの窓を開いてプログラムを書くと思いますが、これを覚えると捗ります。

#### 左のタブへ移動
Command + [ 

#### 右のタブへ移動
Command + ] 

## 検索

#### 検索窓を開く
Command + F

#### 次の検索結果へ移動
Command + G

---

追記していきます。
GPSカー その18

#概要

GPSで自動走行する、コンテストがある。
実機を作ってみた。
2017だけど、プロファイルをリストにしてみた。

#写真

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/18104/cef90645-fb0a-bdff-9684-68e8141098e9.png)


#成果物

https://embed.plnkr.co/xOmHYhMPFdt7tLyeSvxw/

以上。
Rails6にmaterializeを導入する

# はじめに

遅ればせながらRails6触り始めました。
Rails6から標準のjsコンパイラがwebpackerに変更になったので、これまで通りにmaterializeを導入してもjs関連のいろいろが機能しません。今回は少し無理やりな方法ですが、「旧バージョンでmaterialieを導入済みで、rails6にアップグレードしてみたorしてみたい」人向けにとりあえず動かす方法の一案です。

なお、これから新規にアプリケーションを作成する場合はこちらの記事が参考になると思います。
[How to install materialize-css on Rails 6.0.0.beta2 using Webpack](https://medium.com/@guilhermepejon/how-to-install-materialize-css-in-rails-6-0-0-beta2-using-webpack-347c03b7104e)

## 1. 準備

検証用に新規アプリケーションを立ち上げ、適当にscaffoldします。
からのGemfileにmaterializeを追加してbundle install

```:Gemfile
# materialize
gem 'materialize-sass'
```

app/assets/stylesheets/application.scssにてmaterializeをインポート

```scss:application.scss
@import 'materialize';
```

適当なviewファイルにinputを設置してみます。

```erb:index.html.erb
<%# 省略 %>
<div class="input-field">
  <input type="text" id="name" name='name'>
  <label for="name">name</label>
</div>
```

## 2. 確認

[![Image from Gyazo](https://i.gyazo.com/2b19b9485a5c39b757d506ab1ccabea4.gif)](https://gyazo.com/2b19b9485a5c39b757d506ab1ccabea4)

上にピュッと移動するラベルが機能しませんね。アプリケーションをrails6にアップデートしたての方は同じような状況ではないでしょうか？

## 3. yarnでmaterialize-cssをインストール

該当アプリケーションのディレクトリに移動して
`$ yarn add materialize-css`
ちょっとRails6っぽいです。

app/javascript/packs/application.jsに以下を追記

```js:application.js
import 'materialize-css/dist/js/materialize'
```

## 4. yarnでjqueryをインストール
[Introducing jQuery in Rails 6 Using Webpacker](https://www.botreetechnologies.com/blog/introducing-jquery-in-rails-6-using-webpacker)こちらを参考にインストール願います。非常によくまとまってるのでペタペタしてるだけで1分程度で完了します。

## 5. 再度確認

[![Image from Gyazo](https://i.gyazo.com/100fc6a26f63ce93497e50452f3aadce.gif)](https://gyazo.com/100fc6a26f63ce93497e50452f3aadce)

ぴょこぴょこ動いてますね。ここでは検証しませんが、その他のjsがらみのmaterialize(dropdownとかcollapsible)も私の環境では動いていることを確認しています。

## 6. 備考

今回は応急処置的な方法ということでgemとyarnで2種類のmaterializeをインストールしているため、ややお行儀の悪い感じがします。冒頭に貼った参考ではcssの読み込みもwebpackにやらせる方法が示されているので、気が向いたらお引越ししていこうかなと思います。

ちなみに、旧バージョンからのアップデートの場合はconfig/webpacker.ymlでwebpackのファイル探索範囲に旧assets下のjavascriptを追加するというのもありです。

```yaml:webpacker.yml
  # Additional paths webpack should lookup modules
  # ['app/assets', 'engine/foo/app/assets']
  resolved_paths: ['app/assets']
```

以上、お困りの方の参考になれば幸いです。

## 7. 参考
[How to install materialize-css on Rails 6.0.0.beta2 using Webpack](https://medium.com/@guilhermepejon/how-to-install-materialize-css-in-rails-6-0-0-beta2-using-webpack-347c03b7104e)
[Introducing jQuery in Rails 6 Using Webpacker](https://www.botreetechnologies.com/blog/introducing-jquery-in-rails-6-using-webpacker)
PHPで過去のツイッター投稿を削除する

#はじめに
古くから使っているTwitterの過去の投稿を、消すことができるプログラムを書いてみました。　レンタルサーバーでPHPを動かしているので、そこの環境を使って記述しています。
##OAuthライブラリの読み込み
PHPのプログラムそのものは、ネットで調べるとすぐに見つけることができました。しかし、そのままでは動きませんでした。TwitterOAuthライブラリが見つからないとのこと。
###TwitterOAuth
TwitterOAuth は、Abraham Williams 氏が開発する PHP から Twitter の REST API を操作することができるオープンソース・ライブラリで、Twitter の一通りの操作を行うことができます。
###ライブラリはどこに？
お名前ドットコムのレンタルサーバを利用しているので、「OAuthライブラリ」はどこかにあるのではと探しましたが見つけられませんでした。また管理権限がないので、PHP のパッケージ管理ツールなどは操作できません。そこで下記から、いただいてきました。
https://github.com/abraham/twitteroauth
このページの右側にある緑のボタン[cron or download]からDownload ZIPでローカルに落とし、解凍後レンタルサーバーのプログラムと同じ位置にセットアップただコピーするだけ）しました。

```PHP
// OAuthライブラリの読み込み
require_once "twitteroauth/autoload.php";
use Abraham\TwitterOAuth\TwitterOAuth;
```
セットアップのフォルダー名は **twitteroauth** にしました。
##トークンとキーの準備
###Twitter Application Management で取得
私はもともと持っていたので、コピペで完了しましたが、初回Twitterへのアクセスには、4つのキーワードが必要になります。
https://apps.twitter.com/

```PHP
// Twitter Application Management で取得
$consumerKey = " ~　~　~ ";
$consumerSecret = " ~　~　~ ";
$accessToken = " ~　~　~ ";
$accessTokenSecret = " ~　~　~ "; 
```
最近のこの取得には　手間がかかるようですが、じっくりやれば問題なく4つのキーワードを得られます。それを" ~　~　~ "にそれぞれ転記してください。
##プログラムの記述
###OAuthオブジェクトの生成

```PHP
//OAuthオブジェクトを生成する
$twitter = new TwitterOAuth($consumerKey, $consumerSecret, $accessToken, $accessTokenSecret); 
```
###削除コマンドの発行
Twitterの投稿一つ一つについている、ステータス情報IDを指定します。（例：919912361440763123）　この部分を変数にして回せば一括削除もできます。

```PHP
// set ID
    $id = 919912361440763123; 
// delete tweet status
    $req = $twitter->post( 'statuses/destroy/'.$id); 

// checking error status
    if($req->errors) {
      $ans = $req->errors[0]->message;
    } else {
      $ans = "削除完了しました";
    };

// result output
    echo $ans.'<br>';
```
もし、IDが間違っていたり、削除済みを指定したなどの場合には　エラーメッセージを表示します。
#戸惑ったところ
ツイッター投稿の削除の方法はいくつかあったのですが、私の環境ではうまく動かなく、なやみながら解決しました。　googleなどで検索される方に役立てばと思い比較を付けます。
##Twitter API statuses/destroy/:id
私の環境ではエラー　**Fatal error: Uncaught Error: Call to undefined method** になりました。

```PHP
//API実行データとして記載する一般的な方法
$req = $twitter->OAuthRequest("https://api.twitter.com/1.1/statuses/destroy/919912361440763123.json","POST",array());
```
これは、下記のようして、すっきりと書け、POSTとして正しく動きました。

```PHP
$req = $twitter->post( 'statuses/destroy/919912361440763123'); 
```
#終わりに
ステータス情報IDを、検索してまとめて削除するプログラムも考えています。できたら公開します。なお、Twitterの制限なのか　一括処理のときには150件以上にならないように工夫がいるようです。
以上
jHipster自己学習(1)


jHipsterを触っていて感じたことや、
気になったことなどを個人的にまとめています。
間違った情報などあればご指摘ください。
※むしろ教えて欲しいです。

##jHipsterでjdlを実行し、Apiを叩いて情報を得る

jdl作成ツールから適当にjhファイルを作成します。

https://start.jhipster.tech/jdl-studio/

<img width="1053" alt="スクリーンショット 2019-10-22 1.32.53.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/517693/a89e3f9f-89b0-9f88-5e47-4a7140ec64a4.png">

それを、作成したjHipsterの src/main配下 に jdlフォルダを作成して配置します。
ファイルはテキストをそのままコピーでも、右上のDLマークから取得でも、どちらでも良いです。
※画像でinit.jhという名前をつけました。

<img width="911" alt="スクリーンショット 2019-10-22 1.36.53.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/517693/6496bcf7-c1e2-f5aa-cb2f-51eb1889a9d0.png">

配置をしたら、下記のコマンドを実行。
DBのScaffold(migrationが正しい？)が行われます。

```実行コマンド
jhipster import-jdl ./src/main/jdl/init.jh
```

<img width="585" alt="スクリーンショット 2019-10-22 1.45.43.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/517693/a3c32dc0-4e6a-e1e7-b95a-8f849a8aa6f3.png">

再度、jhipsterを立ち上げてみる。

```
./mvnw
```
かつ、画面側も立ち上げる。

```
npm start
```

立ち上げて、ログインをした結果、jdlに指定したエンティティが作成されていることが確認できる。

<img width="835" alt="スクリーンショット 2019-10-22 1.51.49.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/517693/e07a02bd-f386-6330-48e8-59605621e279.png">


##最後に、データを作成し、自分が設定したリレーションの情報と、取得結果が正しいかを確認する。

まずはエンティティの画面からテストデータを作成する。

Items
<img width="1281" alt="スクリーンショット 2019-10-22 2.57.51.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/517693/c472d690-ca97-b7e1-59c6-720d3487604c.png">

Tags
<img width="1287" alt="スクリーンショット 2019-10-22 2.59.15.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/517693/5355e652-02f4-b871-0c0b-1013d2e180f4.png">

ReviewReveals
<img width="1287" alt="スクリーンショット 2019-10-22 3.02.14.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/517693/4c0215a7-e175-8769-9c5e-23c815d1217b.png">

グローバルナビの管理＞APIへ

ItemsのGET用APIを叩き、中身を確認する。
<img width="1159" alt="スクリーンショット 2019-10-22 5.16.19.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/517693/a5540967-f491-8703-5c82-263a52e1656e.png">

正常にjsonが取得できていればOK。

##詰まった箇所

API配下の URLへの権限の付与。
エンティティなどの情報も参照権限付与しないと見れないため、
jhipsterのプロジェクトを作成したら、下記ファイルのapi配下参照権限の変更を行った。

SecurityConfiguration.java

```
.antMatchers("/api/**").authenticated()
　→　.antMatchers("/api/**").permitAll()
```


以上です。自習用なので役にたつかわかりませんが。。。
自分作業を書き出しています。
駆け出しエンジニア、基本情報(FE)を受けてみました。

## はじめに
受験時点のステータス(?)はこんな感じ。

・23歳
・入社1年目　
・配属からは4か月弱
・学生でプログラミング経験 → ほぼ無
・5月にITパスポート取得
・言語はJavaScript、Pythonが主

こんなところでしょうか。


## 認識、対策
結果(自己採点)
午前7割、午後5割で不合格でした(;・∀・)

舐めていたと言いますか、認識が甘かったです。
表面的な反省点としては以下の2つ

１．午前対策に時間をかけすぎた
２．午後対策をしっかりやるべきだった

#### 〇午前対策
参考書
[キタミ式イラストIT塾 基本情報技術者](https://www.amazon.co.jp/%E3%82%AD%E3%82%BF%E3%83%9F%E5%BC%8F%E3%82%A4%E3%83%A9%E3%82%B9%E3%83%88IT%E5%A1%BE-%E5%9F%BA%E6%9C%AC%E6%83%85%E5%A0%B1%E6%8A%80%E8%A1%93%E8%80%85-%E5%B9%B3%E6%88%9031-01%E5%B9%B4-%E6%83%85%E5%A0%B1%E5%87%A6%E7%90%86%E6%8A%80%E8%A1%93%E8%80%85%E8%A9%A6%E9%A8%93/dp/4297102110)

700ページ以上あります。
'受かるため' 以上にしっかり情報量がある良本だとどこかで聞いたため、こちらでしっかり学習
実際500ページほどで断念したのですが、かなり理解はしやすいです。

ここまでしましたが、
やっぱり受かるだけなら過去問に解説を書き込み見直すという勉強が最強ですね。
過去問1年分(2回)で合格できたので
本を使わずとも、5年もやればかなり高得点でしょう。


#### 〇午後対策
何でもっと早く準備しなかったんだ。。
午後は、
問1と問2～7の選択が「午前の知識を基に論理的に考えて回答する」試験
問8が疑似言語(ムズ)
問9以降の言語選択問題(ムズ)

はい、試験3日前でこれすらちゃんと認識していませんでした。
疑似言語読めりゃなんとかなるか？！と、仕方ないので問8にしぼってアルゴリズムのお勉強。

正直厳しい、でも楽しい。でも厳しい。。

参考書
[うかる! 基本情報技術者 [午後・アルゴリズム編]](https://www.amazon.co.jp/%E3%81%86%E3%81%8B%E3%82%8B-%E5%9F%BA%E6%9C%AC%E6%83%85%E5%A0%B1%E6%8A%80%E8%A1%93%E8%80%85-%E5%8D%88%E5%BE%8C%E3%83%BB%E3%82%A2%E3%83%AB%E3%82%B4%E3%83%AA%E3%82%BA%E3%83%A0%E7%B7%A8-2019%E5%B9%B4%E7%89%88-%E7%A6%8F%E5%B6%8B%E5%85%88%E7%94%9F%E3%81%AE%E9%9B%86%E4%B8%AD%E3%82%BC%E3%83%9F/dp/453240973X)

複雑なプログラムはまともに読めないので、そういう地頭力を着けるのに良いのかも。
だし、その力が合格に直結するのが午後試験、なイメージ
私的に良本。


あとは、問題長いしとっつきにくいんですが、
1回くらい2時間半計って通した方がいいと思います。
時間が足りないことと、考えれば意外と解けることを実感できるので。

過去問で感覚をつかみましょう、疑似言語は経験が浅ければ勉強で補いましょう。

## 所感
・基本的なインターネットだったりサーバだったり、世のITなるものたちの仕組みを初学者なりに知れた。
　午前対策に時間をかけすぎたと言ったが、あくまで相対的な話で、絶対量は言わずもがな。これからも勉強。

・論理的に考える力が少しでも上がった、またはそのきっかけとなったことに違いない。
　今回ほとんど対策できなかった午後だが、アルゴリズムの本は読み進めたい。力になりそう。

・まずは相手を知ること、試験についての調べが足りないという一番の反省。。

・**結果として'基本'を学ぶきっかけにはなったのかなと。**
　スキルや知識はそうすぐにつくものではないので、習慣的に積み重ねが大事。



参考になる方がいれば幸いです。