OmniAICreator/Qiita-1.07M huggingface dataset:
javascriptで簡単な電卓を作ってみた（１）

#はじめに
最近Javascriptの勉強を始めて、練習で電卓的なものを作ろうと思ったのでついでに記事を書いてみました。
初投稿ですので読みづらいところとか多いと思います。
最初のこの記事ではHTMLを書いていきます。
JS使うのは次の記事あたりだと思います。
#コード書いてく
まずはHTMLで数値を入力するボタンや計算結果を表示するテキストボックスなどを作成します。
bodyタグの内側だけ書きます。
tableを使って整形していますが、DIVタグとかとCSSを組み合わせたりする方法もあると思います。
id属性などの設定をまだしていないので（こういうところ手際悪い）次回以降細かい所の修正が入ると思います。
数字入力ボタンのonclickだけ指定しておきました。
関数numってやつです。
足し算しかボタンがないですがそこも後で追加します

```html
<input type="text">
<table>
        <tr>
            <td><input type="button" value="7" onclick="num(7)"></td>
            <td><input type="button" value="8" onclick="num(8)"></td>
            <td><input type="button" value="9" onclick="num(9)"></td>
        </tr>
        <tr>
            <td><input type="button" value="4" onclick="num(4)"></td>
            <td><input type="button" value="5" onclick="num(5)"></td>
            <td><input type="button" value="6" onclick="num(6)"></td>
        </tr>
        <tr>
            <td><input type="button" value="1" onclick="num(1)"></td>
            <td><input type="button" value="2" onclick="num(2)"></td>
            <td><input type="button" value="3" onclick="num(3)"></td>
        </tr>
        <tr>
            <td><input type="button" value="0" onclick="num(0)"></td>
            <td><input type="button" value="="></td>
            <td><input type="button" value="+"></td>

        </tr>
    </table>
```

#今回はとりあえず終わり
こんな感じで書くと下のスクショみたいになります。
![2021-04-14_20h59_29.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1322569/71f807a7-ac8c-128b-52f4-59b5226d08a3.png)
まだ見た目だけなので次回以降Javascriptを書いて実際に動くものにしていきます。
（＾ω＾）ノシ
次回:https://qiita.com/xtzi/items/39ead5a6ca83f39d3a86
JWTをlocalStorageに保存してはいけないのか？

#localStorageは危ない？
　いくつかの記事で見かけましたが、localStorageはXSSが発生すると中身を参照できるので、JWTトークンを保存すべきではない。という記事です。確かにAuth0の記事にも、そのようなことが書かれていますね。まあAuth0の記事は、XSSを含め悪意のあるJavascriptで見れないようにしないといけないという論調でしょうか。
　確かに「httpOnly:true」で「secure:true」ならおそらく盗めませんが。

#localStorageはクロスドメインでは参照できないですよね
　調べてみると、当たり前ですがlocalStorageは基本クロスドメインでは読めない。（iFrameとPostMessageを利用してい、参照される側のドメインのスクリプトで渡してやれば別ですが）
　うーん、問題ないんじゃない？

#XSSされたらJWTトークンなていらないですよね
　そもそもXSSでスクリプトが埋め込まれたら、CSRFとかも関係無く好きなリクエストが投げられるのだから、JWTなんか盗まなくっても、自分の口座に現金振り込むリクエストがあればそれでOKですよね。XSSからJWTを守るってなんか本末転倒な気がする。
　XSSが実現した時点で認証は突破されているので、どのようなセキュリティーも意味がないと思うんですが。
　こう考える私は、おかしいんでしょうか？

#Javascript禁止するのが一番では
　XSSがあっても大丈夫というか回避したいのなら、javascriptを禁止してフォームからのPOSTのみの送信にするのが正解では？そうすればXSSはできない。CSRFは成立するので、その対策は必要ですが。問題なのは、サーバー側からクライアントサイドのJavascriptを禁止できないことでしょうか。警告を出してお願いするしかないような。

#それでもjavascriptを使うなら
　重要処理のみサーバー側でAjaxからのコールを禁止（リクエストヘッダの「X-Requested-With:XMLHttpRequest」で判断できそう）、なおかつ利用可能な画面からのリクエストかどうかを「Referer」で判断しておけば、危険な処理はそれが実行できる画面が表示されないとできないので、動作させても利用者が気づくかと思います。（Refererの変更ってJavascriptからで切るんでしょうか？出力させないことはできるようですが変更はできなさそうな）それでもページがバックになったときに実行されるとだめですよね。
　うーん、XSSされても大丈夫な状態が考えられない。やっぱリ基本はXSSされないようにHTMLへの埋め込みはしっかりサニタイズする事では？


#この記事について
　そもそもの発端はSPAの認証を記事にした後に、XSSとCSRFの対策でセキュリティーについて考えてネットを彷徨って見つけた記事が気になったので書いてみました。たたかれることは覚悟で書いてます（へこむとは思いますが）。異論があれば返事はしかねるかもしれませんがどうぞ。（というか打ちのめされて、記事を引っ込めるかもしれませんが）

#ここまで書いて再度調べてみたら同じ意見があった
　[「おーい磯野ー，Local StorageにJWT保存しようぜ！」](https://zenn.dev/musou1500/articles/6bc49fe0f9d7ed7e20cc)で同じこと考えてました。
　だよねー。
Kali Linux 2021.1 の画面が暗くなるのをどうにかする

kali Linuxを動かしてて、他の作業をしていると真っ暗に・・・。
毎回ログインするのはめんどくさいので設定でスクリーンロックしないように設定します。

使用環境
ホストOS：Mac
仮想化：VirtualBox
仮想OS：kali linux

##流れ
ログイン
↓
設定画面（Power manager）
↓
再起動

##操作
ログイン
![VirtualBox_Kali-Linux-2021.1-vbox-amd64_14_04_2021_20_30_37.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1273608/f512d554-0fac-d4ad-dcf5-203b4eb39295.png)

PwowerManagerを起動する。
![VirtualBox_Kali-Linux-2021.1-vbox-amd64_14_04_2021_20_32_42.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1273608/57490449-0cc6-eb3f-123f-22106f8c1397.png)

![VirtualBox_Kali-Linux-2021.1-vbox-amd64_14_04_2021_20_54_52.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1273608/45d679d4-fe45-5d11-0dd0-58df364a874d.png)
Display pwer management のタブをオフにする。

もしくは、その下にあるスライダー
*Blank after
*Put to sleep after
*Switch off after
をいじる。

再起動しておしまい。
Ruby on Rails 環境構築メモ

## 背景
久しぶりにRailsの環境構築したので自分用のメモです。

## 基本の流れ

・下記記事を参考に進めさせて頂きました。
[【完全版】MacでRails環境構築する手順の全て - Qiita](https://qiita.com/kodai_0122/items/56168eaec28eb7b1b93b)
※Bundlerは2.010以前をインストールする(bundler 2.0.1以降をインストールしているとYou must use Bundler 2 or greater with this lockfile.という厄介なエラーに遭遇することが多々あるため)

・Bundlerのバージョンを変更する場合
[Ruby | bundler を特定のバージョンに切り替えて実行する - Qiita](https://qiita.com/YumaInaura/items/64e5721549e4927ce85f)

・rbenvでインストールするrubyのバージョンを変更する場合
[rbenvでrubyのバージョンを管理する - Qiita](https://qiita.com/hujuu/items/3d600f2b2384c145ad12)


## エラー解決
### Gemをインストール時 undefined method `invoke_with_build_args' for nil:NilClass というエラーが出る場合

・下記記事を参考に解決。
[Yosemiteに変えたらgem installできなくなった件 - Qiita](https://qiita.com/YoshiyukiKato/items/e4f67c588d2943c1253d)

・opensslをうまく参照できていないため上記のようなエラーが発生する。
上記記事内でrbenvを再インストールするよう指示があるが、opensslを参照できていない場合opensslのインストールで止まってしまう。その場合は下記記事を参考にパスを貼り直す必要がある。
[rbenv installがopensslで失敗する - Qiita](https://qiita.com/kazutosato/items/9c4ff7711ca992dd67e5)

・rbenvのインストールは遅いため最大で10分以上かかる可能性がある。
全然進まなくてもエラーではないため注意
[rbenv install 遅くて痺れを切らした話 - Qiita](https://qiita.com/hellhellmymy/items/fccbc17e20323c5c8a8d)

### DBにMySQLを選択し、bundle install時 ld: library not found for -lssl ,  Make sure that  gem install mysql2 -v 〇〇 というエラーが出る場合

・下記記事を参照
[bundle installでmysql2がエラーになる件 - Qiita](https://qiita.com/SAYJOY/items/dd7c8fc7a3647e7ff969)

### サーバー起動時に、Please run rails webpacker:install Error: No such file or directory @ rb_sysopenというエラーが出る場合
・webpackerがインストールできていないのが原因
yarnにpathを通し、bundle exec rails webpacker:installすることで解決

### サーバー起動時に、Unknown database 'pet_reserve_development'というエラーが出る場合

・そもそもDBが存在しないのが原因
MySQLクライアントで作成するよりrails db:createで作成するほうがラク


以上になります。記事を書いてくださった皆さんありがとうございました！
複数ISOを起動できるboot USBを超絶簡単に作る [Ventoy]

# TL;DR
- [特徴]
    - オープンソース （[リンク]）
    - boot USBを作る
    - ISOを直接起動可能
    - 複数のOSを入れることができる
- [導入手段]
    - USBドライブを挿してVentoyのソフトで初期化
    - ISOファイル等をUSBドライブ内の特定の場所に入れるだけで設定完了
        - LinuxだけでなくWindowsも使用可能 （[対応OS]）

# はじめに
システム管理者として以下のOSを起動できるboot USBが必要でした。また、ISOファイルを展開せずに直接起動可能な手段を探していました。

- Ubuntu
- Memtest86+
- SystemRescue
- Windowsインストーラー

# 検討したツール
- Grub2でのmenuentryを手動で設定
    - Linuxのディストリビューションに関しては多くの参考情報があり、実装できましたが、WindowsをISOファイルから直接起動する方法に関しては情報が少なく、実現できませんでした。
    - FAT32の最大容量制限によりISOファイルをUSBドライブの中に入れることができませんでした
- [Multibootusb]
    - 使用しようと思いましたが、メンテナンスが止まっており、メインページのリンクが切れていました。そのことについて調べている最中に見つけた[githubのissue]でVentoyというツールが話題に挙がっていましたので今回用いることになりました。

# 特徴
- GPLv3+
- 起動すると選択画面が出るので、そこから複数のOSを選択可能
- ISOファイルをUSBに入れて直接起動することができる
    - 多くの[ISO]、[ディストリビューション]での動作確認済み
- 4GB以上のISOファイルにも対応
- MBR、GPTに対応
- ISOファイルを入れるパーティションはデフォルトのexFAT以外でFAT32/NTFS/UDF/XFS/Ext2(3)(4)を用いることができる
- BIOS、UEFIに対応
- UEFI Secure Bootに対応

# 導入方法
導入方法に関しては単純であり、そのまま転載となってしまいますので、今回はリンクを載せるだけにとどめておきます。[導入手段]

- アプリケーションでのUSBの初期化後、できたパーティションにISOファイルを入れることで準備完了
- 環境
    - Windowsではexeファイルを用いてboot USBを作成可能
    - LinuxではCLIとGUIの両方を用意

# 起動方法
他のboot USBと同じです。F2,F8,Delete（機種による）などのキーを起動時に連打し、ブートオプションを出します。ブートオプションからこのUSBドライブを選択し、起動します。すると、OSの選択画面が出てきますので、選択をして起動完了です。

# 参考リンク
- [選択画面]
- [ダウンロード]
- [フォーラム]
- [GitHub]

[特徴]: https://www.ventoy.net/en/index.html
[導入手段]: https://www.ventoy.net/en/doc_start.html
[リンク]: https://github.com/ventoy/Ventoy
[対応OS]: https://www.ventoy.net/en/isolist.html
[Multibootusb]: https://github.com/mbusb/multibootusb
[githubのissue]: https://github.com/mbusb/multibootusb/issues/536
[ISO]: https://www.ventoy.net/en/isolist.html
[ディストリビューション]: https://www.ventoy.net/en/distrowatch.html
[選択画面]: https://www.ventoy.net/en/screenshot.html
[ダウンロード]: https://www.ventoy.net/en/download.html
[フォーラム]: https://forums.ventoy.net/
[GitHub]: https://github.com/ventoy/Ventoy
MVCの基本がまだ頭に入っていませんでした：uninitialized constantのエラー

何度ファイルの修正、ルートの確認をしても以下のエラーが出ていました。

![20210414-200020.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/960935/47aefcdf-946b-48d8-b263-a2380f573805.png)

基本に立ち返り
-

items/new.html.erbを見直し、items_contoroller.rbを見直しやっていましたが、何度やっても
items/new.html.erbが表示されません。





uninitialized constantで調べ、
@imotan さんの記事で

>uninitialized constantのエラーをどう解決すべきか

の記事に辿り着きました。@imotanありがとうござます。気づかせていただき感謝！！


Error文
-

uninitialized constantは「定義したクラスを読むことができない」といっている。

でももっと重要なのは
######rails sした直後は実行時点でクラスを読み込んでいないので、app/models/user.rbファイルを探しにいく。app/models/user.rbというファイルがあれば、ファイルをオープンしてクラスを読み込む.しかし、app/models/user.rbというファイルがない、ファイルの中にUserというクラスが定義されていない場合、uninitializedエラーが起きる。


気づき
-

modelを読み込む！！！→itemのテーブルもmodelもないじゃないですか！！！！


解決方法１
-

##uninitiali#zed constantのエラーが出たら

|やるべきこと|
|--------|
|①関連テーブルを確認
|②関連モデルを確認
|③関連マイグレーションファイルを確認


MVCに常に返るって大事。
Cygwinでautogenを呼び出してAC_CONFIG_MACRO_DIRS([config]) conflicts with ACLOCAL.AMFLAGS=-I configっておこられる

Windowsの改行の問題なのでdos2unixで対処

主に Makefile.am が問題のようだ

````sh
find . -name \*.m4|xargs dos2unix
find . -name \*.ac|xargs dos2unix
find . -name \*.am|xargs dos2unix
````

https://stackoverflow.com/questions/47582762/ac-config-macro-dirsbuild-aux-m4-conflicts-with-aclocal-amflags-i-build-aux
SQL 関数

SQL勉強時、関数に関して学びましたが、忘れたりするので個人的な備忘録として勉強内容をまとめて残します。


関数とは：より高度な処理を行いやすくするため、データベースに準備されている多数の命令。
全ての関数は、「呼び出し時に指定した情報(引数)に対して、定められた処理を行い、結果(戻り値)に変換する」

イメージ
　関数名(引数) ⇒　戻り値

●LENGTH関数
文字列の長さを調べてくれる関数。
テーブル列に格納されている文字列の長さを取得したりできる。

例：LENGTH(対象の文字列)

●TRIM関数
文字列の"前後"にある空白を除去してくれる関数。類似の関数として、[LTRIM],[RTRIM]が存在する。
※LTRIMは文字列の左側の空白を除去
※RTRIMは文字列の右側の空白を除去

例：TRIM(対象の文字列)

●REPLACE関数
文字列の一部を別の文字列に置換する関数。

例：REPLACE(対象の文字列,置換前の部分文字列,置換後部分文字列) ⇒置換処理された後の文字列

●SUBSTRING関数
「特定の文字目から特定の文字分」ということを指定して文字列の一部抽出する。

例：SUBSTRING(対象の文字列,抽出開始位置,抽出文字数)

●CONCAT関数
文字列を連結する関数。||演算子や、+演算子でも文字列連結できる。

例：CONCAT(文字列,文字列[,文字列...])
※連結する文字列に１つでもNULLがあれば、戻り値はNULLとなる。

●ROUND関数
指定桁で四捨五入を行う関数。

例：ROUND(対象の数値列,有効とする桁数)
※有効とする桁数が正の場合は小数部の桁数、負の場合は整数部の桁数をあらわす。

●TRUNC関数
指定桁で切り捨てを行う関数。

例：TRUNK(対象の数値列,有効とする桁数)
※有効とする桁数が正の場合は小数部の桁数、負の場合は整数部の桁数をあらわす。

●POWER関数
とある値のべき乗を行う。(※べき乗とは、2乗や３乗など)

例：POWER（対象の数値列,何乗するかを指定する値)

●CURRENT_DATE関数
SQLで現在の日付を取得する関数。
類似で、現在の時刻を取得する関数として"CURRENT_TIME"関数が存在する。

●CAST関数
データの型を変換する関数。

例：CAST(変換する値　AS 変換する型)


●COALESCE関数
複数の引数を受け取り、受け取った引数を順にチェックしてその中から最初に見つかったNULLでない引数を戻り値として返す。という事が出来る関数。

例：COALESCE(列や式1,列や式2,列や式3)
【AWS】AWSのロードバランサ―とは何か

#プログラミング勉強日記
2021年4月14日

#ロードバランサ―(LB)とは
　サーバーへのアクセスを安定させるための装置・仕組みのこと。load(負荷) + Balancer(釣り合いをとるためのもの) という意味の言葉で、負荷分散装置とも呼ばれている。
　ロードバランサ―を使うと、アクセスの安定性が向上し、不具合のある危機を自動的に検知して他のサーバーに振り分けることができるので、システムが落ちることも防げる。

　Webサイトにアクセスがあった場合、通常は1台のサーバーがリクエストのすべてを処理する。しかし、ロードバランサ―を使うとアクセスを複数のサーバーに分割して処理することができる。


#AWSのロードバランサ―
　AWSが提供しているロードバランサ―にはNLB(Network Load Balancer)とALB(Application Load Balancer)、CLB(Classics Load Balancer)の3種類ある。

##NLB(Network Load Balancer)とは
　NLBはトランスポート層でルーティングの決定が行われるので、毎秒数百万の大量のリクエストを処理することができる。動的なマッピングで、効率がいいロードバランサ―。

> トランスポート層とは、通信プロトコル（通信手順/通信規約）の機能や役割を階層構造で整理したモデルを構成する層の一つで、データの送信元と送信先の間での制御や通知、交渉などを担うもの。
(文献:[トランスポート層 【transport layer】 第4層 / layer 4 / レイヤ4 / L4](https://e-words.jp/w/%E3%83%88%E3%83%A9%E3%83%B3%E3%82%B9%E3%83%9D%E3%83%BC%E3%83%88%E5%B1%A4.html))

##ALB(Application Load Balancer)とは
　ALBは名前の通り、アプリケーション層でルーティングの決定を行う。1つのクラスター内で複数のリクエストを処理することができる。NLBと同様に動的マッピングである。


##CLB(Classics Load Balancer)とは
　CLBはトランスポートレイヤーもアプリケーションレイヤーでもどちらでもルーティングを決定できる。CLBは静的なマッピングで、サービスと同じ数だけのコンテナインスタンスが必要なロードバランサ―。


#参考文献
[ロードバランサー（LB）とは？仕組みやDNSラウンドロビンとの違いについて解説](https://www.rworks.jp/system/system-column/sys-entry/16305/)
クロネコヤマトの404ページをJavascriptの標準機能だけでダンボールをこじ開けてみた

# 元ネタ
https://qiita.com/omoshiro_web/items/3fb149ff0a185b82caf2

jQueryを使わずJavascriptの標準機能だけでシンプルにこじ開けてみた。

# Let's こじ開ける
```javascript:こじ開ける.js
document.querySelectorAll('div.box-game-pc div.box-game-item a.box-game-item-link').forEach((a) => {
    a.classList.remove('disabled');
    a.click();
});
```
普段はあまり使わない、これ見よがしなラムダ式。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/72257/f7b468cd-74c1-329b-3653-2b89ad7c43a6.png)

ぱんぱかぱーん

# 全部当たりアニメーション
アニメーションは ``box`` を操作したいので、queryを分ける。

```javascript:全部当たり.js
document.querySelectorAll('div.box-game-pc div.box-game-item').forEach((box) => {
    box.querySelectorAll('a.box-game-item-link').forEach((a) => {
        a.classList.remove('disabled');
        a.click();
    });
    box.style.zIndex = 10000;
    box.classList.add('box-anime-03');
});
```
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/72257/2af5de07-2181-9b70-c1af-05963c458413.png)

# 以上
Rails初学者によるRailsチュートリアル学習記録② 第0章

##目次
- [1. はじめに](#1-はじめに)
- [2. これまでの学習内容](#2-これまでの学習内容)
- [3. Railsチュートリアルを読了して](#3-Railsチュートリアルを読了して)

##1. はじめに
- この記事は、Rails初学者の工業大学三年生がRailsチュートリアルの学習記録を<br>つけるための記事です。
- 筆者自体がRailsやWebについて知識が少ないので、内容の解釈などに<br>間違いがある可能性があります。(その時はコメントで指摘してくださると助かります！)

##2. これまでの学習内容
<a href="https://qiita.com/UtimoriNI/items/ea38368584efe7f2fda8">前回の記事</a>に引き続き、Railsチュートリアルの第8章から第14章の内容を、
キーワードレベルで見返せるように記録しておきます。
#####▶第8章 -ログイン機能を作成する-
- cookiesを使ってセッション機能を作成する
- ログインフォームを作成する
    - フォームへの入力値からユーザを検索する
    - ログインの成功、失敗に応じてメッセージを表示する
- ログアウト機能を作成する

#####▶第9章 -ユーザのログイン情報を記憶する-
- 記憶トークンを生成し暗号化する
- 記憶しているユーザ情報を削除する

#####▶第10章 -ユーザの更新・表示・削除-
- ユーザ情報の更新
    - 情報更新時のバリデーション
    - 更新の成功、失敗に応じた処理
- ユーザが可能な操作の管理
    - ログインしてないユーザが実行できる操作の設定
    - ログインしているユーザが実行できる操作の設定
- ユーザを表示する
    - ユーザ一覧のページネーション
- ユーザを削除する 

#####▶第11章 -新規登録時にアカウントの有効化を要求する-
- ユーザの初期状態を有効化されていない設定をする
    - ヘルパー(組み込み・カスタム)
    - ユーザ登録時にメールを送信する
- メイラーの使い方

#####▶第12章 -パスワードを再設定できるようにする-
- パスワード再設定のメールを送信できるようにする
- データベース内のパスワードを更新する
    - アセットパイプラインとは
    - 名前付きルートの使い方
    - 統合テストの作り方

#####▶第13章 -メッセージの投稿機能の作成-
- 投稿内容のバリデーション
- 投稿とユーザの関連付け
- 投稿の表示
- 画像の投稿

#####▶第14章 -ユーザーのフォロー機能の作成-
- フォローしている、フォローされているという関係をデータモデルで表現する
- 関係性をユーザと関連付ける
- フォローしているユーザの投稿を表示させる

##3. Railsチュートリアルを読了して
学習の流れとして、まず一度読んでから実際に手を動かすという流れを考えていたが、
一通り読んだだけでもこの教材のボリュームを実感できました。

特にこの記事でメモした8章以降の内容は実装する機能がより複雑な物となっており、
データモデルの考え方やテストといったprogateなどの教材では学ぶことのなかった内容は、
読んでいてほとんど理解することができませんでした。
これから実際に手を動かして学習を進めていきますが、学習スピードを保ちながら進められるか非常に不安です:(
carrierwave+Minimagickで利用する、画像リサイズメソッド

# はじめに

ポートフォリオの一覧ページを作成する際に、サイズが違うときれいに並ばないので画像のサイズを投稿時に変更するようにしました。
その際、使うメソッドを迷ったので書いておきます。

種類は４つです。
・ resize_to_fit
・ resize_to_limit
・ resize_to_fill
・ resize_and_pad

# minimagick を導入

まず最初に minimagick を利用するには、imagemagick というパッケージをインストールする必要があります。
docker の alpine を使っているので、apk でインストールします。
Mac 使っている人は brew でインストールしてください。

```ruby:コンソール
apk add imagemagick
```

続いて、Gemfile に minimagick を記載し、bundle install を実行します

```ruby:Gemfile
gem 'minimagick', '~> 4.0'
```

最後に uploader.rb の include CarrierWave::MiniMagick のコメントを外す

```ruby:app/uploaders/image_uploader.rb
class ImageurlUploader < CarrierWave::Uploader::Base
  # Include RMagick or MiniMagick support:
  # include CarrierWave::RMagick
  include CarrierWave::MiniMagick  # ←コメントを外す

　(省略)

end
```

これで画像をリサイズできるようになります。

# resize_to_fit

これが基本的なメソッドです。
縦横比を保持しながら、引数で指定したサイズを変更します

```ruby:app/uploaders/image_uploader.rb
process resize_to_fit: [width,height]
```

# resize_to_limit

縦横比を保持しながら、引数で指定したサイズに収まるようにサイズを変更します。
ただし、引数よりサイズが小さい場合はサイズを変更しない。

```ruby:app/uploaders/image_uploader.rb
process resize_to_limit: [width,height]
```

# resize_to_fill

元画像から第３引数を中心として第１・２引数ののサイズに切り抜きを行う。
縦横比は変更される。

```ruby:app/uploaders/image_uploader.rb
process resize_to: [width,height,gravity]
#(gravity: デフォルトは 'Center'; オプション： 'NorthWest'、 'North'、 'NorthEast'、 'West'、 'C​​enter'、 'East'、 'SouthWest'、 'South '、'SouthEast'）
```

# resize_and_pad

縦横比を保持しながら、引数で指定したサイズに収まるように画像のサイズを変更する。
余白部分の第三引数の色で塗りつぶす

```ruby:app/uploaders/image_uploader.rb
process resize_to: [width,height,background,gravity]
#(background: 'ffffff'のように１６進コードで指定)
#(デフォルトはgif・pngの場合は透明、jpegは白)
```

# 参考

[Github Carrirwave](https://github.com/carrierwaveuploader/carrierwave)
[Github Minimagick](https://github.com/minimagick/minimagick)
[紹介したメソッドのソースコード](https://github.com/carrierwaveuploader/carrierwave/blob/master/lib/carrierwave/processing/mini_magick.rb)
python-pptxのマニュアルにはない何気にニッチなスライドの削除

python-pptxのマニュアルにはない何気にニッチなスライドの削除は以下でできるはずです。
　スライドのリスト作成
　→プレゼンテーションとスライドとの関連削除
　→スライドの削除　という流れ

〜とスライド2枚目(ページ1)のスライド削除〜

※prs等を定義

xml_slides = prs.slides._sldIdLst  
slides = list(xml_slides)

rId = prs.slides.sldIdLst[1].rId
prs.part.drop_rel(rId)

xml_slides.remove(slides[1])

※prs.save(prsのパス)


〜もしくは関数としてスライド2枚目(ページ1)のスライド削除〜

delete_slide(presentation, index)
    xml_slides = presentation.slides._sldIdLst  
    slides = list(xml_slides)
    rId = presentation.slides.sldIdLst[index].rId
    presentation.part.drop_rel(rId)
    xml_slides.remove(slides[index])

※prs等を定義

delete_slide(prs, 1)

※prs.save(prsのパス)

shiracamusさんありがとうございます😊
＜業務未経験者さん向け＞実務で必要な技術力を知ろう！イベントまとめメモ

[Techpitさん](https://www.techpit.jp/)主催のイベントで言っていたことのまとめ！

登壇者(イベント内容コピペ)
鈴木翔大様
東京都在住のフリーランスエンジニア。車両の位置情報を管理する高トラフィックサービスやユーザー数100万人超の大規模サービスなどの開発・運用を経験。得意な技術はRuby on Railsで、rails 含め複数のOSSのコントリビューター。Techpitでは、[Ruby on Railsの教材](https://www.techpit.jp/courses/79)を執筆。
nunulk様
フリーランスのウェブアプリケーションエンジニアとして、近年は主にスタートアップ企業にて、サーバサイド（PHP）およびフロントエンド（JavaScript, TypeScript）のプロダクト開発に携わる。開発以外にも、技術選定、設計、スクラム開発導入、テスト環境の整備など、チームにとって最適な開発プロセスを回せるよう、様々な側面から開発チームを推進している。 Twitterアカウント：@nunulk
Techpitでは、[Laravelの教材](https://www.techpit.jp/courses/92)を執筆。


ここから自分用メモです。ニュアンスが異なっていたり、書ききれていない部分がある可能性がありますm(_ _)m
##【個人学習と現場と異なる事】
・現場ではDBをゼロベースで教えたりする。
・セキュリティ面が会社で開発する時は違う。
△自分が読めればいいだけのコードはチームでの開発の時に苦労する
・ここを直すとここが崩れるのようなコードが複数存在する。
・SaaSやパーティカルサービスなどが複雑になってくる

##【今のうちにやるべきこと】
・個人でプルリクベースで開発する
・可視性については言語の規約やlinterで学習する
・複雑なIF文にはコメントを残しておくなどする
・分からなくても頑張って技術を発信すること
・(説明会や面接ではトップの考えが多いので）、開発ブログなどの会社のブログを見て実態を把握すると、現場の考え方が知れるので、行きたい企業かどうかの判断材料になりやすいかも。
・エラーが起きた時になぜこういう結果になったのかの深堀をする。（動いていいやは△）
・フレームワークのソースコードを読む
・テストを書いておくこと（テスト漏れが多かったりするので、そこのリカバーをしっかりしているか）→PFでエラーが出るとマイナス評価勿体ない

##【企業が未経験採用で見ていること】
・メンタル面を見たりすることが多い
・Dokerへの理解があるか
・デプロイするためのCIへの理解
・運用ツールをその人が使えるか
・SIerだったら、最新の技術よりも。ちょっとコードを変えるくらいの力があるかどうか
・ぱっと見のコードの読みやすさ（インデント・変数の名前など）結構出来ていないので非常に勿体ない。
・PFはその人の独自性を感じれるものか（趣味だったらその人が好きなものとかが分かったりするし、専門知識が分かったりするので）やりたいもの・作りたいものを作れているか
×Twitterコピーサイト→その人の得意な事が分からない。作りたいものが無ければ無いで良いが、ある程度の複雑さは入れてほしい。好きなサービスをパクって作ってみてから考えるも良し。
・未経験の時点でスキルはあまり見ていない。ベースライン＋興味があるか&発信力があるか。
・エンジニアになってやりたいことを赤裸々に話してくれるか
・年齢：SIerは気にしてる。SESとWeb開発系は気にせず、あまりフィルターしていない印象(ベンチャーや若い人が多い会社)。保守管理などの固い会社は気にしていたりする。
Cloudflare Pages、Netlify、Vercel の有料プラン(Pro)の比較

## Proプランの比較

<table>
<tbody>
<tr>
<th> </th>
<th>Cloudflare</th>
<th>Netlify</th>
<th>Vercel</th>
</tr>
<tr>
<th>価格</th>
<td>$20 (チームの人数は関係なし)</td>
<td>$19 / member</td>
<td>$20 / member</td>
</tr>
<tr>
<th>並列ビルド数</th>
<td>5</td>
<td>3 (追加は$40)</td>
<td>1 (追加は$50)</td>
</tr>
<tr>
<th>ビルド制限</th>
<td>5000 builds</td>
<td>1000 minutes</td>
<td>Up to 400 Hrs</td>
<tr>
<th>サーバーサイド機能</th>
<td>なし<br/>(Cloudflare Workerがあるが統合されていない。2021/4/14時点)</td>
<td>あり<br/>(Netlify Functions)</td>
<td>あり<br/>(Serverless Functions)</td>
</tr>
<tr>
<th>帯域</th>
<td>制限なし</td>
<td>400GB/month(then $20 per 100)</td>
<td>1TB/month</td>
</tr>
<tr>
<th>パスワードプロテクション</th>
<td>含まれる(※1)<br/>無料プランでも使える</td>
<td>含まれる</td>
<td>追加で$150必要</td>
</tr>
<tr>
<th>SSO</th>
<td>含まれる(※1)<br/>無料プランでも使える</td>
<td>なし<br/>EnterpriseプランでSAMLが使える</td>
<td>要問い合わせ</td>
</tr>
<tr>
<th>プロダクションのアクセス制限</th>
<td>
  できる(※1)(※2)<br/>
</td>
<td>できない</td>
<td>できない</td>
</tr>
</tbody>
</table>

※1 Cloudflare Accessとの連携によって実現される。
※2 独自調査によるものでドキュメントから確認できたものではありません。Cloudflare Accessの設定からプロダクションのドメインに対して追加で制限をかけることで実現できました。

## 所感

Cloudflare Pagesのコストパフォーマンスが圧倒的です。他のサービスはチーム人数に比例した金額になりますが、Cloudflare Pagesではチーム人数の影響を受けない上に、競合サービスではオプションとして追加費用が必要な機能も追加費用なしで導入できます。

Serverless Functionがないので静的サイトにしか対応できませんが、静的サイトであれば迷わずCloudflare Pagesを選びたくなる安さです。

## 参考

 - [Cloudflare Pages・Vercel ・Netlify の違いや使い分けをまとめる](https://zenn.dev/catnose99/scraps/6780379210136f)
Markdown PDFで Error: Failed to launch the browser process! が発生した際の解消方法

# 概要

- Windowsの環境では問題ないのにWSL2環境でのみVSCode拡張機能`Markdown PDF`がエラーになる現象が発生したのでそれの解決方法の備忘録


## 内容

- エラーメッセージ
  - `Markdown PDF`が内部的にブラウザの機能を使用してMarkdownを変換しているからブラウザがデフォルトでインストールされていないWSL2の環境で本エラーが発生したと思われる
  - [node.js - Error: Failed to launch the browser process puppeteer - Stack Overflow](https://stackoverflow.com/questions/59979188/error-failed-to-launch-the-browser-process-puppeteer)

```log
Error: Failed to launch the browser process!
/root/.vscode-server/extensions/yzane.markdown-pdf-1.4.4/node_modules/puppeteer-core/.local-chromium/linux-722234/chrome-linux/chrome: error while loading shared libraries: libnss3.so: cannot open shared object file: No such file or directory

TROUBLESHOOTING: https://github.com/puppeteer/puppeteer/blob/master/docs/troubleshooting.md
```

## 解決方法

WSL内にブラウザをインストールして拡張機能にPathを設定すればいい

```bash
sudo apt-get install -y chromium-browser
chromium-browser --version
which chromium-browser
```

- `which chromium-browser`で出力されたPathをmarkdown-pdfのPathとして保存する

```bash
"markdown-pdf.executablePath": "/usr/bin/chromium-browser"
```

  - **今回はWSL環境の問題なので`リモート[WSL: Ubuntu]`を選択して設定した**


  ![設定箇所](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/169887/3bc0c3c7-cf61-eb24-e482-85518dcb254f.png)

- その他、Markdownで日本語を使う場合、日本語フォントが入っていないとPDF化した際に文字化けになるのでWSLに日本語フォントをインストールする

```bash
sudo apt-get install -y fonts-ipafont
```


## 参考資料

- [node.js - Error: Failed to launch the browser process puppeteer - Stack Overflow](https://stackoverflow.com/questions/59979188/error-failed-to-launch-the-browser-process-puppeteer)
- [VScodeのMarkdownPDFでPDF出力エラーが出た時の対処法 | FOX通信](https://iranatilark.com/archives/2020/09/11-1910.php)
SQL  CASE演算子

CASE演算子に関して勉強していた際、忘れたりしたので、見直し用や備忘録として。

●CASE演算子：列の値や条件式を評価して、その結果に応じて任意の値に変換することが出来る。パターンは2通り存在する。
　・パターン１
 　　 CASE 評価する列や式 WHEN 値1 THEN 値1の時の返り値
     　　　　　　　　　　(WHEN　値2 THEN 値2の時の返り値)...
                 　　　　　　　　　　 (ELSE デフォルト値)
 　　 　END

　・パターン２
　　　CASE WHEN 条件１ THEN 条件１の時の返り値
　　　　　　(WHEN 条件2 THEN 条件2の時の返り値)...
　　　　　　(ELSE デフォルト値)
　　　　END
Plots.jlで線形計画問題の図的解法をやってみる

##はじめに

最近Juliaを使うようになって、グラフの出力にPlots.jlを使うのですが、いまひとつ思ったようにグラフの出力ができないで微妙に詰まったのでグラフの出力の練習に線形計画問題の図的解法をやってみることにしました。
今回出力するのは直線と直線で囲まれた領域です。

## 線形計画問題

次の問題を解いていきます。
$$
\begin{align*}
      maximize ~ & ~ x_1 + 2x_2, \\\\
  subject ~ to ~ & ~ x_1 + 3x_2 \leq 15, \\\\
                 & ~ x_1 + x_2 \leq 7, \\\\
                 & ~ 2x_1 + x_2 \leq 12, \\\\
                 & ~ x_1, x_2 \geq 0.
\end{align*}
$$

式を変形すると、実行可能領域を図示するのに必要な次の式が得られます。
$$
x_2 = -\frac{1}{3}x_1 + 5 \\\\
x_2 = -x_1 + 7 \\\\
x_2 = -2x_1 + 12 \\\\
0 \leq x_2 \leq f(x_1), ~ s.t. ~ f(x) = 
\begin{eqnarray}
  \begin{cases}
    -\frac{1}{3}x + 5, ~ if ~ x \in [0, 3) & \\\\
    -x + 7 ~ if ~ x \in [3, 5) & \\\\
    -2x + 12 ~ if ~ x \in [5, 6] &
  \end{cases}
\end{eqnarray}
$$

## 実行可能領域の図の出力

```Julia
using LaTeXStrings
using Plots; plots.gr()

function plotRegion!(interval, f)
    Plots.plot!(
        interval,
        f,
        fillrange = 0,
        fillalpha = 0.1,
        c = :grey,
        label = ""
    )
end

function plotFeasibleRegion()
    Plots.plot(
        x -> (-(1/3)x + 5),
        xlims = (0, 8),
        ylims = (0, 13),
        xlabel = L"x_1",
        ylabel = L"x_2",
        label = L"x_2 = -\frac{1}{3}x_1 + 5"
    )
    Plots.plot!(x -> -x + 7, label = L"x_2 = -x_1 + 7")
    Plots.plot!(x -> -2x + 12, label = L"x_2 = -2x_1 + 12")
    plotRegion!(0:3, x -> -(1/3)x + 5)
    plotRegion!(3:5, x -> -x + 7)
    plotRegion!(5:6, x -> -2x + 12)
end

plotFeasibleRegion()
```

![実行可能領域](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/537455/5d2350b7-82e1-ea68-e71a-989818e4a2b9.png)

領域部分は凡例部分に出てほしくなかったので、`label = ""`を指定して凡例部分から消しました。
領域部分の描画は直線の交点が交わる$x_1$を境界にして3つに分割しました。

## 解の導出
最小化する関数を$k = x_1 + 2x_2$と置いて変形すると、$x_2 = -\frac{1}{2}x_1 + \frac{k}{2}$となり、この直線の傾きから直線が$(3, 4)$を通るとき，すなわち$x_1 = 3, x_2 = 4$が$k$が最大となる線形計画問題の最適解であるとわかります。

図示してみます。

```Julia
plotFeasibleRegion()
plot!(x -> -(1/2)x + 11/2, label = L"x_2 = -\frac{1}{2}x_1 + \frac{11}{2}")
```

![実行可能領域と解](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/537455/b7c30ed1-0ef5-d12c-bdb4-51a13d0fa62e.png)

## おわりに
LaTeXStringsの構文ハイライトが変になっていますが気にしないでください。
Julia使いはじめて日が浅いのでコードの中に改善できる点があるかもしれません。
何かありましたらコメントでのご指摘よろしくおねがいします。

## バージョン等
Docker Image [jupyter/datascience-notebook 2eac078be835](https://hub.docker.com/layers/jupyter/datascience-notebook/latest/images/sha256-2eac078be835b6b2311e6cf034ffef355c7addb41313f200dded9ed963055c43?context=explore)
実行にJupyter Notebookを使用

Julia 1.6.0
Plots 1.11.2
LaTeXStrings 1.2.1

## 参考ページ

https://docs.juliaplots.org/latest/

https://hub.docker.com/r/jupyter/datascience-notebook/
QiitaAPIで記事取得／記事投稿

# 目標
・記事情報を取得し、一覧表示する
・記事の投稿が可能
# 使用API
参照元：https://qiita.com/api/v2/docs
##### 記事情報取得API
https://qiita.com/api/v2/users/*username*/items?
##### 記事投稿API
https://qiita.com/api/v2/items?
#実装方法
##Qiitaの設定
・[設定]>[アプリケーション]>[個人用アクセストークン]>[新しくトークンを発行する]でトークンを作成しておく
（取得のためread_qiita、投稿のためwrite_qiitaを選択）
##記事情報取得
通信はaxiosで実施

```
const qlist = await axios.get('https://qiita.com/api/v2/users/'+【ユーザー名】+'/items?',{
                 Authorization: 【作成したトークン】
            })
```

##記事投稿

```
    fetchData() {
     //必要なパラメータをjsonで設定
     //オプションは多数のため、公式ドキュメント参照
      const item = {
          "body": 【投稿内容】,//マークダウン形式で記載が必要
          "coediting": false,//この記事が共同更新状態かどうか (Qiita Teamでのみ有効)
          "private": false//限定共有状態かどうかを表すフラグ (Qiita Teamでは無効)
          "tags": [
            {
              "name": "テスト投稿",//タグ：APIテスト時は投稿が無難
            }
          ],
          "title": 【記事タイトル】,
          "tweet": false//Twitterに投稿するかどうか (Twitter連携を有効化している場合のみ有効)
      }

      axios.post('https://qiita.com/api/v2/items?',item,{
        headers: {
          'Content-Type': 'application/json',
          'Authorization': 【作成したトークン】
        }
      }).then(()=>{
        //成功処理
      }).catch((error)=>{
        //失敗処理
      })
```

#最後に
認証許可（GET /api/v2/oauth/authorize）周りも実装したかったが、
難航したため、調査中
[個人メモ] AWS認定バッジをサイトに埋め込む

#概要
先日AWS認定試験に合格したので、credlyからバッジのお知らせメールが来ておりました。
どうやらサイトにバッジを埋め込めるとのことだったので、
せっかくなので自分のポートフォリオに埋め込んでみました。

#前提
* credlyのアカウントを作成済みであること

#方法
###1. メールのリンクをクリック

こんな感じでメールが届くので「バッジを入手する」をクリックします。
![スクリーンショット 2021-04-14 19.21.59.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/643906/8bce5072-21b4-704d-0f80-4230797fa72b.png)


###2. Accept Badgeをクリックしてバッジを公開OKにする
###3. バッジ個別ページのshareボタンをクリック
###4. 埋め込みコードをコピーしてサイトにペースト
![スクリーンショット 2021-04-14 19.27.41.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/643906/e46feb0c-0bfa-92b8-2a0b-cfe48107c9dd.png)
AWS認定 ソリューションアーキテクト アソシエイト 勉強法①

#実務未経験でも受験可能!!<br>AWS認定 ソリューションアーキテクト アソシエイト 勉強法①<br>「概念理解〜書籍学習」

##参考

####どのAWS資格を受けたらいいのか
参考サイト：https://qiita.com/nakazax/items/20458e146d3d9f2aa615

####ソリューションアーキテクト用の勉強方法
参考サイト:https://qiita.com/fkooo/items/e5284a4ed3c3466ffd41

##受験アカウントの作成(申し込みまではしません)
※AWSアカウントではなく受験アカウントの作成をする
作成後に英語表記での住所登録などが必要になります。
英語表記に自信のない方は[こちら](https://kimini.jp/)で日本語→英語の変換ができます。
登録後に受験方法が選択できるようになります。

###受験方法は２種類
- PSI
- ピアソンVUE

**おすすめはピアソンVUE**です。
PSIからの申し込みの場合、基本的に申し込みは英語です。また本人確認書類にその英語表記の確認書類(パスポートなど)が必要になります。
その点、ピアソンVUEであれば、申し込み段階で日本語と英語を選ぶことができ、本人確認書類も運転免許証などの従来の本人確認書類も使えるため、おすすめです。

これで日程を決めれば受験ができる環境ができたので、勉強を進めて目処が立った時に申し込みます。

##AWSアカウントの作成
こちらの内容については別の記事で執筆済のため、不明の方は[こちら](https://qiita.com/kunrenyouAcount/items/97e0008942aea4e191b4)をご覧ください

##書籍による学習
[合格対策 AWS認定ソリューションアーキテクト アソシエイト](https://www.amazon.co.jp/%E5%90%88%E6%A0%BC%E5%AF%BE%E7%AD%96-AWS%E8%AA%8D%E5%AE%9A%E3%82%BD%E3%83%AA%E3%83%A5%E3%83%BC%E3%82%B7%E3%83%A7%E3%83%B3%E3%82%A2%E3%83%BC%E3%82%AD%E3%83%86%E3%82%AF%E3%83%88-%E3%82%A2%E3%82%BD%E3%82%B7%E3%82%A8%E3%82%A4%E3%83%88-%E5%A4%A7%E5%A1%9A%E5%BA%B7%E5%BE%B3-%E6%97%A5%E7%AB%8B%E3%82%A4%E3%83%B3%E3%83%95%E3%82%A9%E3%83%A1%E3%83%BC%E3%82%B7%E3%83%A7%E3%83%B3%E3%82%A2%E3%82%AB%E3%83%87%E3%83%9F%E3%83%BC/dp/486594043X)
【Python】スケールの異なる時系列データの類似度をMAEで比較する


形が似ているグラフ（時系列データ）を見つけたいときってありますよね．

今回は，スケールが違うけど形は似ている時系列データを見つけるために，スケールを正規化してMAE（平均絶対誤差）で比較する方法を書きます．

#動機

普段は[こちらの記事](https://optrip.xyz/)で株式投資について書いていますが，形が似ている銘柄をスクリーニングしたいと考えました（例えば，コロナショックで大きく変動した銘柄を抽出する）．

形が似ている銘柄をスクリーニングするメリットとして，

・形が同じような銘柄は避け，分散投資に役立てる
・形が同じような銘柄を買い，ひとつの個別銘柄の不調を補う
・形が同じような銘柄の共通点を分析することで投資に役立てる

などがあります．

しかし，株価というものは形が似ていてもスケールがバラバラです．

例えば，以下のUAL（ユナイテッド・エアライン・ホールディングス）とDAL（デルタ航空）はコロナショックで大きく下落したので形は似ていますが，スケールが違うのでスクリーニングするときに何を基準に比較するか困ってしまいます．

![simlar_chart1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1298289/1df010e4-1403-fbec-0c6f-a730e64b9406.png)

そこでこの記事では，スクリーニングの準備のために同じスケールに正規化して比較するコードを用意します．

#株価データの準備
すでに比較したいデータがある場合は，この章は飛ばしてください．

今回は，Pythonのpandas-datareaderでUAL，DAL，AAPLの株価を取得します．
※今回の内容には関係ないですが，取得したらCSVなどに保存することをおすすめします．APIのサーバーの負担になるからです．

```python
import datetime
import pandas_datareader.data as web

start = datetime.date(2018,1,1)
end = datetime.date.today()

ual = web.DataReader('UAL', 'yahoo', start, end)['Adj Close']
dal = web.DataReader('DAL', 'yahoo', start, end)['Adj Close']
aapl = web.DataReader('AAPL', 'yahoo', start, end)['Adj Close']
```

※調整後終値（Adj Close）のみを取得しています．

これらの株価データはpandasのDataFrameで与えられます．

この時点では，以下のデータようなデータになっています．

![simlar_chart1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1298289/1df010e4-1403-fbec-0c6f-a730e64b9406.png)

#正規化する

データの形だけを比較するために，スケールを0~1に正規化します．

正規化には，Min-Max Normalizationを使います．

```math
mmn(x) = \frac{x_i-\min(x)}{\max(x)-\min(x)}
```

pandasのDataFrameは，以下で正規化できます．

```python
def mmn(ticker):
    mmn = (ticker - ticker.min()) / (ticker.max() - ticker.min())
    return mmn

ual = mmn(ual)
dal = mmn(dal)
aapl = mmn(aapl)
```

これで，以下のようにデータが0~1に正規化されていると思います．

![simlar_chart2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1298289/5dcf1574-d8d5-6f39-c523-c6e246d633b3.png)

UALとDALの株価の形が似ていることが分かりやすくなりました．

#MAEで比較する

最後に，類似度を定量的に計算します．

類似度には平均絶対誤差(MAE)を使うことにします．

```math
MAE = \frac{1}{N}\sum_{i=1}^{N}|x_{1i} - x_{2i}|
```

今回の場合，MAEは小さいほど似ている形のデータ系列といくことになります．MAEが0だと完全に一致していることになります．

MAEは以下で計算できます．

```python
from sklearn.metrics import mean_absolute_error

MSE_dal_ual = mean_absolute_error(dal, ual)
MSE_ual_aapl = mean_absolute_error(ual, aapl)
MSE_aapl_dal = mean_absolute_error(aapl, dal)
```

```
MSE_dal_ual =  0.08767186335370042
MSE_ual_aapl =  0.5756471586956278
MSE_aapl_dal =  0.5380791440469056
```

UALとDALが似ていることが確認できました．

#むすび
今回はそのま比較しましたが，移動平均を取ってからMAEで比べたほうが傾向で比較できるかもしれません．その場合は，TA-Libを使うと簡単に移動平均が作れるのでおすすめです．

https://optrip.xyz/?p=2621


では後日，本記事の内容を使って「似た形の株価チャートをスクリーニング」したいと思います．
Rubyで特殊フォルダのパスを取得する方法

# 前書き
Windowsには特殊フォルダとして知られる「既知のフォルダ」がいくつかあり
そのパスは環境によってはデフォルトとは別であることもあります。
例: `Program Files`やユーザーディレクトリやデスクトップなど

これらを取得する方法として`SHGetKnownFolderPath`があります。

# ソース

```ruby:specialdir.rb
require 'fiddle/import'
require 'fiddle/types'

module Shell32
  extend Fiddle::Importer
  dlload 'shell32.dll', 'Ole32.dll'
  include Fiddle::Win32Types
  # HRESULT SHGetKnownFolderPath(
  #   REFKNOWNFOLDERID rfid,
  #   DWORD            dwFlags,
  #   HANDLE           hToken,
  #   PWSTR            *ppszPath
  # );
  extern "DWORD SHGetKnownFolderPath(PDWORD id, DWORD flgs, HANDLE token, char** path)"
  extern "void CoTaskMemFree(void* pv)"
  module_function def wcscpy!(s)
    buf = []
    0.step(by: 2) do |i|
      a,b = s[i], s[i+1]
      c = a | b << 8
      break if c == 0
      buf.concat([a, b])
    end
    buf.pack("C*").force_encoding("UTF-16LE")
  end
  module_function def GetKnownFolderPath(id, flg = 0)
    ppstr = Fiddle::Pointer.new(0).ref
    ret = SHGetKnownFolderPath(id, flg, 0, ppstr)
    fail ArgumentError, "SHGetKnownFolderPath return E_INVALIDARG" if ret == 0x80070057 # E_INVALIDARG
    fail "SHGetKnownFolderPath return 0x#{ret.to_s(16)}" if ret != 0
    str = ppstr.ptr
    # 返ってきたppstrから文字列を取り出しCoTaskMemFreeで解放
    wcscpy!(str).encode("UTF-8").tap{ CoTaskMemFree(str) }
  end
end
```

例えばLocalLowを取得する場合は

```ruby:locallow.rb
# {A520A1A4-1780-4FF6-BD18-167343C5AF16}
FOLDERID_LocalAppDataLow = [0xA520A1A4, 0x1780, 0x4FF6, 0xBD,  0x18, 0x16, 0x73, 0x43, 0xC5, 0xAF, 0x16].pack("L<S<S<C8")
puts locallow = Shell32.GetKnownFolderPath(FOLDERID_LocalAppDataLow)
# => C:\Users\{ユーザー}\AppData\LocalLow
```

# 反省点
- `wcscpy!`にエラー落ち・無限ループの危険がある。(そもそもこの実装は原始的すぎてなんとも・・・)
- モジュール名が`Shell32`なのに`Ole32`のapiも呼び出している。
- windows以外の場合にエラー・警告を出した方が親切
- というか、外部モジュールにした方が100万倍楽
「ネットワークがおかしいんですけど」ハンドブック

#これはなに？
社内ネットワークで問題が起こった時に、私が調査する観点を書き出してみた。
各組織、各人のやり方はあると思いますが、何かの参考になれば。
\#無線に明るくないため、無線は割愛

#調査概要
##レイヤー
L1 -> L3(L4) -> L2 -> L7 の順番で見る。

- 何はなくとも物理層。障害の大半はここ。
- 次いで IPアドレス周りやフィルタ。

各レイヤーで見ることは後半で。

##切り分け観点
- 問題が起こっているのは一人か？複数か？
    - 複数の場合どの単位か？島、セグメント、など。
- 問題は一時的？常時？
    - 一時的なら何と相関するか？トラフィック量、日時、など。
- 今まで使えていたのか？新たに使おうとしてだめなのか？
- 物理障害？論理障害？
- どこまで疎通できるのか？
    - デフォルトゲートウェイ(デフォゲ)？ISPのルータ？8.8.8.8？

##調査に使う代表的なコマンド/ツール
- ```ifconfig``` ```ipconfig```
    - 端末の IPアドレス設定など確認
- ```netstat``` ```route```
    - 端末のルーティングテーブル確認
- ```ping```
    - どこまで疎通できるか
    - ICMP のエラーメッセージは宝物
- ```traceroute``` ```tracert```
    - どこまで疎通できるか
    - パケットが届いていないのか、ICMP エラーを返さない設定なのかは判断つかないので、インターネット上は参考程度に
- ```arp```
    - 実存確認
    - IPアドレス被り確認
- ```tcpdump``` wireshark
    - 端末でのパケット確認
    - 適切な場所で pcap を取得できれば、解決に近づく

##知識
- TCP/IP の正しい挙動
    - 正しい挙動との差分を見ることで、事象を把握する

#L1調査
###障害が物理セグメントに紐づく
- 物理ミスがないか確認する
    - HUBなどの電源が抜かれてないか
    - ポート挿し間違え
    - ケーブル (ストレート/クロス)
        - AutoMDI/MDIX は、autoネゴじゃないと効かないので注意
    - メタルケーブルは 100m まで
- ポート挿し替え、ケーブル入れ替えてみる
    - ポート/ケーブル不良がないか切り分ける
        - ケーブルの内部断線、接触不良はよくある
- half でリンクアップしてる？
    - autoネゴと固定のインタフェースを接続すると、auto側が half でリンクアップする
    - 通信はできるがエラーが頻発する
    - 機器によって(Catalystなど)は 1G/half の実装がなくて、auto と 1G/full固定を接続しても 1G/full でリンクアップする機器もある

###障害が端末単体
- 同上

#L3/L4調査
###障害が論理セグメントに紐づく
- ルータ調査
    - インタフェース設定確認
        - IPアドレス/マスクが正しい？
        - IPアドレスかぶりしてない？
        - エラーパケット発生頻度はどうか？
    - ルーティングテーブル確認
        - デフォゲある？
    - ping をうつ
        - 自身のIPアドレス
        - デフォゲ
        - 対向ISPルータ
        - 8.8.8.8
    - フィルタリング
        - ルータのACL
        - Firewallのポリシー
            - 上二つは、設定変更というトリガーがあるはずなので、気づきやすい
        - 端末のパーソナルファイアウォール、iptables
    - 各種リソース
        - NATテーブル
        - トラフィック
            - 理論上WireSpeed以上はでない
        - セッションテーブル
            - FW や SLB など L4 以上みる機器の場合

###障害が端末単体
- インタフェース設定確認
    - ```ipconfig /all``` ```ifconfig -a```
        - IPアドレス/マスクが正しい？
        - IPアドレスが 169.254.x.x？
            - この場合は DHCP の IPアドレス取得失敗
                - ルータ(DHCPサーバ)との疎通？
                - ルータ(DHCPサーバ)の DHCPプール？
    - ルーティングテーブル確認
        - ```route print``` ```netstat -rn```
            - デフォゲある？
            - 個別のルーティングが切られている？
    - 設定問題なかったら、近くから順に ping をうつ
        - 127.0.0.1(loopbackアドレス)
        - 自身のIPアドレス
        - デフォゲ
            - デフォゲが失敗したら、隣の人宛
        - 対向ISPルータ
        - 8.8.8.8
        - 本当に繋ぎたいアドレス
            - ここまでいけば L3/L2 は大抵OK

#L2調査
###障害が物理セグメントに紐づく
- ルータ/SW調査
    - デフォゲの arp が正しく解決できているか
    - MACアドレステーブル確認
        - デフォゲのMACが正しいインタフェースに紐づいているか
    - 対向機器とネイティブVLAN比較
        - タグVLANを使っている場合
            - ネイティブVLANにはタグがつかない
                - ネイティブVLANが違うと認識がずれる

###障害が端末単体
- デフォゲの arp が正しく解決できているか
    - ping した後に(ping は失敗する前提) ```arp -a```
        - 正しく解決できている
        - 違う MACアドレスが解決できている
            - 静的エントリが入っている？
            - 違うネットワークにつながっている？
        - 解決できていない
            - 違うネットワークにつながっている？

#L7調査
- DNS
    - 名前解決確認
        - ```nslookup``` ```dig```
            - 本来のリゾルバ指定
            - オープンリゾルバ (@8.8.8.8) 指定
- HTTP(S)
    - エラーコードある？
    - SSLネゴシエーション？
        - pcap取得してどこで失敗しているか
Python で "n 日前" と基準日から日付を得るメモ

## 背景

"5 days 12 hours ago" みたいな文字列と, 基準日から, 実際の日付を得たい.

ぺろっと文字列渡してよろしく処理してくれるライブラリは無いようです.

## 方法

https://stackoverflow.com/questions/28268818/how-to-find-the-date-n-days-ago-in-python

のように, 自前でパースして, `dateutil` の `relativedelta` で差分計算します.

`re` はめんどいので, `{}` でパースできる `parse` を使います.

https://pypi.org/project/parse/

```py
from dateutil.relativedelta import relativedelta
from datetime import datetime
import parse

def ago_do_date(ago, ref_date):
    p = parse.parse('{} days {} hrs ago', ago)
    print(p)

    delta = relativedelta(days=int(p[0]), hours=int(p[1]))
    print(ref_date - delta)

print(datetime.now())
s = "16 days 16 hrs ago"
ago_do_date(s, datetime.now())
```

```
2021-04-14 18:29:29.754215
<Result ('16', '16') {}>
2021-03-29 02:29:29.754248
```

Voila!
[kintone]プロセスに連動した電子印×帳票出力の便利な使い方[プラグイン]

こんにちは、株式会社ノベルワークスです。
今回の投稿では弊社のkintoneプラグイン「印鑑押印プロセス連携プラグイン」と
株式会社ソウルウェアの「RepotoneU Pro」を組み合わせた便利な使い方をご紹介します。
この２つを組み合わせることによってkintoneのプロセス管理に連動して電子印を添付した
レコードをExcelやPDFの帳票として出力することが可能です。


##<a href="https://www.novelworks.jp/kintone_plugin/stamp_plugin?utm_source=Qiita0416&utm_medium=Qiita0416&utm_campaign=Qiita0416"><strong>印鑑押印プロセス連携プラグイン</strong></a>とは
<a href="https://www.novelworks.jp/kintone_plugin/stamp_plugin?utm_source=Qiita0416&utm_medium=Qiita0416&utm_campaign=Qiita0416"><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/605275/b5739e25-86a5-c7e3-4889-487f5a6a8edc.jpeg" width="30%"></a>
kintoneのプロセス管理に連動して電子印を添付するプラグインです。
30日間無料お試し可能です！

##<a href="https://u.repotone.com/u/pro/"><strong>RepotoneU Pro</strong></a>とは
<a href="https://u.repotone.com/u/pro/"><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/605275/2b070769-7f96-4326-76b0-bc02ac7e48ce.png"></a>

kintoneのデータを簡単にPDFやExcelなどの形式で帳票出力することができるプラグインです。
こちらも30日間無料でお試し可能です！
今回はこの2つの組み合わせて見積書を作成します。
##プラグインを設定します
###①印影登録用のアプリを用意してユーザー毎の印影を登録しておきます。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/605275/f158da84-f77a-6ddf-e818-45af192d7db1.png" width="60%">

###②印影を添付させたいアプリに添付用フィールドを追加します。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/605275/235583e8-5a82-251b-17d2-7a17c5b87e45.png" width="60%">

###③印影を添付させたいアプリのプロセス管理を設定します。
アプリのプロセス管理にてレコードのステータスとプロセスを設定をします。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/605275/346036db-3a29-331a-59f9-96685f8b3d5a.png" width="80%">

###④印鑑押印プロセス連携プラグインのプラグインを設定します。
印影を添付させたいアプリに印鑑押印プロセス連携プラグインを読み込みます。
設定画面を開き、③で設定したプロセスを選択します。
ここで選択したプロセスを動かした時に登録したユーザーの印影が自動添付されるようになります。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/605275/497a4b7e-d256-c6b4-ac18-2dc460be5a42.png" width="80%">

###⑤RepotoneU Proの設定をします。
同じアプリにRepotonU Proも読み込みます。
今回はこのような形式でレコードを見積書として出力するよう設定しました。
どこにどのフィールドの値を表示させるか選ぶことができるので、
追加したフィールドの印影が見積書の赤で囲んだ部分に表示されるよう設定します。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/605275/71027e5a-61dc-7f93-d91d-90fa96d5eab6.png" width="80%">
##使ってみる
設定が完了したらレコードを登録し、ステータスを変更します。
プロセスに連携してさきほど登録しておいた印影がフィールドに自動で添付されました。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/605275/a1369562-f8ad-e348-868d-06d0358c863b.gif" width="80%">

見積書を出力します。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/605275/14ddb69a-f9e7-425a-28c7-1ea885bcb55d.gif" width="80%">

先程自動添付された印影もきちんと表示されました！
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/605275/2e056c70-f535-451b-0a8f-205695fa8aab.png" width="80%">



このように印鑑押印プロセス連携プラグインとRepotoneU Proを組み合わせると
社内の承認手続きと帳票作成がkintone内ですべて完結してとっても便利です！
どちらも30日間無料でトライアルできるので是非合わせて使ってみてください！
Google ColaboratoryをVSCodeでssh接続して使えるようにした件について 

# はじめに
最近は技術記事がGoogle Colaboratoryにあわせてサンプルコードを書いてくれることが多く、Colabを使う機会が格段に増えました。そこでGPUが使用制限に達してしまい、Colab proを使おうかと考えていたのですが、それならVSCodeで使えるようにしたいなと思うようになったので調べていたのですが、そもそもSSHというものをなんとなくでしか知らない状態でやっていたので、時間がかかったため、初心者に向けて手順を省略せずに説明しようと思い、本日は紹介をします。

# 準備

ngrokのアカウントを作成します。
https://ngrok.com/

Google Colaboratoryを開きます。
そして以下のコードを1つずつセルにコピーして実行します。

```
import random, string, urllib.request, json, getpass
```
```
# Generate root password
password = ''.join(random.choice(string.ascii_letters + string.digits) for i in range(20))
```
```
# Download ngrok
! wget -q -c -nc https://bin.equinox.io/c/4VmDzA7iaHb/ngrok-stable-linux-amd64.zip
! unzip -qq -n ngrok-stable-linux-amd64.zip
```

```
# Setup sshd
! apt-get install -qq -o=Dpkg::Use-Pty=0 openssh-server pwgen > /dev/null
```

ngrokのサイトにログインし、`Getting Started`->`Your Authtoken`を開き、`Configuration File`の項目にあるtokenをコピーします。

```
# これはコードでなくngrokの画面の説明です
# in ngrok.yml
authtoken: XXXXXXXXXXXXX(ここをコピー)
```
次に以下をColabで実行します。

```
#Run sshd
get_ipython().system_raw('/usr/sbin/sshd -D &')

# ngrokで自分のトークンを確認する
authtoken = "あなたのトークンをここにいれる"
```

```
#Create tunnel
get_ipython().system_raw('./ngrok authtoken $authtoken && ./ngrok tcp 22 &')

!pip install colab_ssh --upgrade
from colab_ssh import launch_ssh# in a separate cell in case you need to restart the service

ngrokToken = "1r395f88TULELKkSEYktSWGLWIT_4g8VkjVdeKHqZybzzWUhd"
launch_ssh(ngrokToken, password="password")

with urllib.request.urlopen('http://localhost:4040/api/tunnels') as response:
  data = json.loads(response.read().decode())
  (host, port) = data['tunnels'][0]['public_url'][6:].split(':')
  print(f'SSH command: ssh -p{port} root@{host}')
```

これでSSH接続のためのColabでの準備は終了です。

# VSCodeでの設定

vscodeを開きます。
`ctrl+p`で検索ウィンドウを開き`config`と入力して .sshにある`config`ファイルを開きます。

一番下の行にColabから出力されたものを貼り付けます。
私の場合はこちらを貼り付けました。(人によって内容は異なります)

```
Host google_colab_ssh
    HostName 6.tcp.ngrok.io
    User root
    Port 11121
```

# SSH接続

左メニューから拡張機能を選択して`Remote - SSH`をインストールします。

左のメニューからリモートエクスプローラー(モニターに><のマークのアイコン)を選択して、上のVをクリックして(セレクトボックスから)`SSH Targets`を選択します。

`google_colab_ssh`を見つけ、`Connect to Host in New Window`をクリック (フォルダーマークに+がかかれたアイコン)します。

新たなウインドウが表示されて、パスワードの入力を求められるので`password`と入力します。 (Colabで設定しました)

左メニューの拡張機能からPythonをインストールします。

左のメニューからフォルダーを開く(青ボタン)を選択して、上部に`/root/`とでるのでOKを押す (これでColabのrootディレクトリをカレントディレクトリにできます)

`ctrl+shift+p`でコマンドパレットを開き、`Jupyter: Create New Blank Notebook`を検索し、選択することで新しいnotebookを作成できます。

試しにセルに以下を入力して、Colabが動くか確認します。

```
print("Hello World")
```
ファイルは保存ボタンを押さないと新規作成されませんので、作成する際には最初に上部メニューの保存ボタンを押して任意のディレクトリに保存してください。

# ターミナルから接続する
ターミナルから接続する場合はColabで出力されるコマンドを入力します。
私の場合は以下のように出力されています

```
SSH command: ssh -p11121 root@6.tcp.ngrok.io
```

sshコマンドがなかったため、私は`apt-get update``apt-get install ssh`を行いました。

コマンドを打った後、ssh接続の確認をとられるので、`yes`と入力してからパスワードを打ち込めば接続ができるかと思います。

# 終わりに
SSH接続など当たり前のようにやっていますが、私のようにやったことないかたも多いのかなと思い、手順を省略せず記事にしてみました。VSCodeの左メニューなどわからないとなったら、調べていただけると簡単にわかるかと思います。


# 参考サイト
https://qiita.com/hazigin/items/c291adf5dc9ccc13d11f
https://webbigdata.jp/ai/post-7248
https://blog.serverworks.co.jp/tech/2020/02/20/vscode-remote-ssh/
Spring boot + PostgreSQL ローカル環境構築手順

[記事はこちらに移動しました。](https://tro555-engineer.com/2022/03/20/spring-boot-postgresql-%e3%83%ad%e3%83%bc%e3%82%ab%e3%83%ab%e7%92%b0%e5%a2%83%e6%a7%8b%e7%af%89%e6%89%8b%e9%a0%86/)
ECS Application sourcebundle validation error: We expected a VALUE token but got: START_OBJECT

(Amazon Linux 2 より前の) Amazon Linux AMI プラットフォームで、Elastic Beanstalk のマルチDocker 環境をECSを使って構築する。

https://docs.aws.amazon.com/ja_jp/elasticbeanstalk/latest/dg/create_deploy_docker_ecs.html

BuildしたDockerイメージをECRにプッシュした際に、以下のようなエラーが発生。

```
ECS Application sourcebundle validation error: We expected a VALUE token but got: START_OBJECT
```

結論から言うと、Dockerrun.aws.jsonの`command`プロパティが配列である必要があるが、Stringになっていた。
以下を参照のこと。

[Weaponizing Haskell \- Part Two: Deployment ~ Bows and Arrows](https://sordina.github.io/blog/2016/03/13/1457864203-weaponizing-haskell-prod-deploy.html#dockerrun-debugging)

抜粋
One of the main issues I had was that my command property for one of my services was a string, but it should have been an array. Docker-Compose allows this, but Dockerrun doesn’t. I ended up reading the ECS Task-Definition Parameters manual with much more scrutiny and realized my mistake. Part of why it took me so long to do so was because of the misleading error message.
micro:bit v2とPCをつないでprocessingで騒音を可視化

共同スペースで活動している際、盛り上がるとどうしてもうるさくなってしまう。
客観的にうるささを判定してprocessingで誰でもが可視化できるように

macとmicro:bit v2のマイクを使って　シリアル通信行った

基本的にはここを参考にさせてもらった。
https://qiita.com/kikpond15/items/e9256ead4779f365a1a3



ここのserial.list()[1];
の部分接続している番号がPCによって違うので変える必要があった
何番にmicro:bitが接続しているかを調べる方法
https://microbit-micropython.readthedocs.io/ja/latest/devguide/repl.html

ここで何番目に表示されるかはあまり関係なかった。
processingでエラーが出なくなるまで0から順番に実行していったら、自分の場合は4番でうまくいった。
RubyでJson形式の結果を返すWebAPIを使ってみよう(ハンズオン)

### はじめに
この記事は, rubyでweb apiの使いかたを理解するための初心者向けの記事です。具体的には, rubyで郵便APIを使用し, コンソールに表示するまでを行います。

バージョン : ruby3.0.0

### WebAPIとは何か
#### WebAPIの概説

みなさん、WebAPIって何かわかりますか！？ 

シーン....

おっと(笑)。でも大丈夫ですよ、丁寧に説明していこうと思います。厳密な定義などが知りたい方は, 記事に記載されている公式リファレンスを参照してくださいね。

まず、APIについて見ていきましょう。Mozzilaの公式リファレンスの説明によるとAPIは次のように説明されています。

`Application Programming Interfaces (APIs) は、開発者が複雑な機能をより簡単に作成できるよう、プログラミング言語から提供される構造です。`

平たく言うと, 複雑なコードで書かれた難しいプログラムを, 誰でも簡単に扱えるようにしたものです。

そして, このAPIのうち`サーバからデータ取得をする API `のことをWebAPIと呼びます。

例えば、WebAPIでは,TwitterAPIがありますが、これは最新のツイートをwebサイトに表示するという機能を簡単に扱えるようにしてあるAPIです。他にも,GoogleAPIやFacebook API、YouTube APIなど様々なAPIが提供されています。

### WebAPIを使ってみよう
#### 流れ
それでは、実際にWebAPIを使っていきましょう。

流れとしては、
①uriモジュールを使って, URIをパースする (URIの解析)
②net/httpモジュールを使って, APIにget通信でAPIのサーバにアクセスして、サーバからJSON形式の結果をもらう。(HTTP通信でAPIにアクセス)
③jsonモジュールを使って, JSON形式をhash形式に変換する (JSONの結果をHashに変換する)
④digメソッドでhashから値を取り出す(Hashから値を取り出す)

#### 郵便APIの構成
ここで試しに使う郵便APIは,以下のとおりです。?以降のzipcode=〇〇に郵便番号を指定する事で住所を返してくれます。ブラウザでこのコードにアクセスすると, APIにアクセスした結果が表示されます。

```
http://zipcloud.ibsnet.co.jp/api/search?zipcode=2500011
```

![Screen Shot 2021-04-14 at 18.01.53.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/482077/06373c1e-a634-6363-1a84-d99bdf91817a.png)



#### 実装(ハンズオン)
最後にコードで実装すると次のようになります

```ruby
require 'net/http'
require 'uri'
require 'json'

#①uriモジュールを使って, URIをパースする (URIの解析)
uri = URI.parse('http://zipcloud.ibsnet.co.jp/api/search?zipcode=2500011')

#②net/httpモジュールを使って, APIにget通信でAPIのサーバにアクセスして、サーバからJSON形式の結果をもらう。(HTTP通信でAPIにアクセス)
json = Net::HTTP.get(uri)

#③jsonモジュールを使って, JSON形式をhash形式に変換する (JSONの結果をHashに変換する)
#symbolize_names: trueでシンボルのキーをシンボルのままでhashにする。
result = JSON.parse(json, {symbolize_names: true})

#④digメソッドでhashから値を取り出す(Hashから値を取り出す)
puts result.dig(:results, 0,:address1)
```

これを実行すると, `神奈川県`という結果が返ってきます

### 参考記事 
・[MDN Web Docs | Web APIの紹介](https://developer.mozilla.org/ja/docs/Learn/JavaScript/Client-side_web_APIs/Introduction)
・[Ruby 3.0.0 リファレンスマニュアル library net/http](https://docs.ruby-lang.org/ja/latest/library/net=2fhttp.html)
・[Ruby 3.0.0 リファレンスマニュアル Hashクラス](https://docs.ruby-lang.org/ja/latest/class/Hash.html)
・[Ruby 3.0.0 リファレンスマニュアル JSON.#parce](https://docs.ruby-lang.org/ja/latest/method/JSON/m/parse.html)
・[WebAPIについての説明](https://qiita.com/busyoumono99/items/9b5ffd35dd521bafce47)
・[郵便番号API](http://zipcloud.ibsnet.co.jp/api/search?zipcode=2500011)
・[RubyでJSON形式の結果が帰ってくるURLをParceする](https://qiita.com/awakia/items/bd8c1385115df27c15fa)
・[RubyでネストしたHashやArrayから値を取り出す方法いろいろ](https://qiita.com/vzvu3k6k/items/1705c7f4b29c08787ea0)
SpeedPizza 3D

![IMG_5726.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1316944/febded8d-bad5-4ed2-a5ef-bee08fbb3ba2.jpeg)
I use to work on a project on my company for April fools. In my company (@kusunoki) we are running an online service called Speed-visa to provide an online visa to student who want to study Japanese language. For that me and my co-worker had an idea to prank our customers by changing the LP of our website by an Online 3D services. So basically we allowed people to make a 3D pizza model. They could choose the topping, sauce and vegetable to personalize their 3D pizza. On this Project i had a great experience of leaning and using Nuxt.JS and find 3D models also a great team working session i would like to do more of these things in the future. 
As a programmer tell what did you do on April fools ? @pjgeek.    #SpeedPizza #kusunoki #PJ
xcrun: error: unable to find utility "altool", not a developer tool or in PATHの解決法

#Command Line Toolsがエラー
App Store Connectなんかにビルドをアップロードする時なんかに使う人もいるであろう`xcrun altool`のコマンド。

```console
xcrun altool --upload-app -f aaaaaaaaaaa.ipa -t ios -u test@gmail.com -p testtest
```

こんな感じのコマンドでビルドをテストフライトにアップしようとしたらエラー発生！！！

```console
xcrun: error: unable to find utility "altool", not a developer tool or in PATH
```

よくわからんが再度インストールしようとしても、ダメらしい。。。

```console
 xcode-select --install
xcode-select: error: command line tools are already installed, use "Software Update" to install updates
```

#CommandLineToolsを削除して再インストール

```console
sudo rm -rf /Library/Developer/CommandLineTools
xcode-select --install
```

上記のコマンドで無事解決しました。:grin:

#参考

https://stackoverflow.com/questions/34617452/how-to-update-xcode-from-command-line