OmniAICreator/Qiita-1.07M huggingface dataset:
ExecJS::RuntimeUnavailableの解決方法

##前提条件
ruby '2.5.0'
Rails '5.1.4'


#mini_racerを使おう
先日MacのOSアップデート後、rails serverを立ち上げようとしたところ、`Could not find a JavaScript runtime. See https://github.com/rails/execjs for a list of available runtimes. (ExecJS::RuntimeUnavailable)`と怒られてしまった。
どうやら、Javascriptを実行するために必要なランタイム（ソフトウェアの実行に必要なプログラム）がないぞということらしい。
エラーメッセージには、https://github.com/rails/execjs と利用可能なランタイムの一覧のリンクまで表示してくれてある。
親切。
　
ただリンクの一覧にある`therubyracer`はトラップだった。
導入を進めている他の記事も多いけど、自分の前提条件だと、このgemをbundle installしようとしたところ、

```
An error occurred while installing libv8 (3.16.14.19), and Bundler cannot continue.
Make sure that `gem install libv8 -v '3.16.14.19' --source 'https://rubygems.org/'` succeeds before bundling.

In Gemfile:
  therubyracer was resolved to 0.12.3, which depends on
    libv8

```
という具合にエラーを返された。

代わりに、

```Gemfile
gem 'mini_racer'
```
をbundle installしよう。

どうやら`therubyracer`は、2017年にすでに終わっていたらしい。

参照記事：[Railsの難所についてと、therubyracerはすでに終わっていた話](https://note.com/konpyu/n/na213a14ad1e3)
　
> therubyracerは内部的にlibv8というgemを使ってv8エンジン（Javascriptの実行エンジン）をインストールしようと試みる。しかし、therubyracerが扱っているlibv8のバージョンが古く、結果としてインストールが困難な上に脆弱性の問題も抱えていた。
（中略）
mini_racerはかなり新しいlibv8をハンドリングしている。試してみた所簡単にインストールが成功した。最新のv8の方が安定・高速なので、パフォーマンス的にも美味しい。



##結論


```
gem 'mini_racer'
```

をbundleしよう。


##宣伝

[挫折しない英単語学習サービス「BooQs」を開発しています。](https://www.booqs.net/)
CentOS7のhttpdのオレオレ基本設定メモ

# Let's Encryptをインストール
 - https://qiita.com/yoshi0518/items/00e6a65535318c8a27df
 - `ansible-playbook playbook.yml -i hosts --private-key="hogehoge.key"`
 - python-pipがないとか言われたらぐぐってインストール

# httpdに適用

- mod_sslが入ってなかったからインストール

```
# yum install mod_ssl
```
- https://weblabo.oscasierra.net/letsencrypt-2/

# 80番→443番にリダイレクト設定

- conf.d/https_redirect.conf

```
<IfModule mod_rewrite.c>
       RewriteEngine On
       RewriteCond %{SERVER_PORT} !^443$
       RewriteRule (.*) https://myhostmei.jp [L,R]
</IfModule>
```

# httpd.confいろいろ

- IPv4のみ／サーバ名設定（ワーニングログ抑止）

```
(略)
Listen 0.0.0.0:80
(略)
ServerName myhostmei.jp
(略)
```

- .htaccessを有効にしたい

```
(略)
<Directory "/var/www/html">
(略)
    AllowOverride All
(略)
</Directory>
```
画像のファイルサイズ低減について（JPEG,PNG）

画像のファイルサイズ低減について検討する機会があったので、記録しておきます。

# 画像のファイルサイズを決定する要因

WEBでよく使われるJPEGとPNGに絞って説明します。

ざっくり言って以下のとおりです。ざっくり解説なので、細かいところは間違っているかもです。

## 解像度

●ピクセル × ●ピクセル　というやつです。

## 色のきめ細かさ

各ピクセルの色を、どの程度きめ細かく表現するか、ということです。

#### JPEGの話

JPEGでは、色の再現度は圧縮率によって変わってきます。

JPEGでは、広い範囲にわたる情報についてはきめ細かく（多くのbit数を割り当てて）色を表現するのに対し、狭い範囲にわたる情報については、大雑把に（少ないbit数を割り当てて）色を表現します。

こういったデータ削減処理をどのくらい強くするか、というの圧縮率です。圧縮率を高くするほど、コントラストが下がり、エッジ（境界部分）がぼやけます。

（こういった特徴があるので、JPEGはエッジのはっきりとしたイラスト画像には向いておらず、風景写真のようなエッジがあまり際立たなない画像に向いている、と言われます。）

なお、圧縮率と解像度は独立したものです。圧縮率が変わっても、解像度は変わりません。

#### PNGの話

PNGでは、以下のどれかを選択することになります。

##### PNG-8　（ビット深度：8）

各ピクセルの色を8bitで表現します。使える色は 2の8乗 = 256色 だけです。

##### PNG-24　（ビット深度：24）

各ピクセルの色を24bitで表現します。使える色は 2の24乗 = 約1,670万色 です。これはJPEGの上限と同じです。

##### PNG-48　（ビット深度：48）

各ピクセルの色を24bitで表現します。使える色は 2の48乗 = 約280兆色 です。

さらに、上記のビット深度とは別次元で、透明度（αチャンネル）というものがあり、8bitなら256段階、16bitなら65536段階の透明度を選択できます。

ビット深度のbit数 + 透明度のbit数 の情報が、ピクセルごとに保持されます。最大で、ピクセルあたり64bit(ビット深度48bit + 透明度16bit)になっちゃいます。

ビット深度と透明度の組み合わせについては、制限があるとか無いとか。確認中です。

当然ながら、ビット深度と解像度も独立したものです。ビット深度を変えても解像度は変わりません。

# 画像のファイルサイズを低減させる方法

ということで、画像のファイルサイズを低減させるには、ファイルサイズに影響を与える以下の２点を下げればよいわけですね。

* 解像度
* 色のきめ細かさ

解像度については説明は不要かと思いますが、色のきめ細かさを下げるにはどうすれば良いのでしょうか？

元の画像を、圧縮率の高いJPEGやビット深度の低いPNGに変換すればよいはずですね。



# 参考
https://michisugara.jp/archives/2012/img_format.html
http://funini.com/kei/math/jpeg.shtml
https://news.mynavi.jp/article/osxhack-130/
http://www-creators.com/archives/2322
https://www.marguerite.jp/Nihongo/Labo/Image/JPEG.html#PROCCESS
http://www-creators.com/archives/1031
https://www.attend.jp/desine_171028
https://nexlink-cs.nlk.jp/040_knowledge/detail/file_count/NEXLINK_mame01_ver2.pdf
#Rails + docker 環境で Ruby をバージョンアップした時に bundler や bootsnap か何かのエラーでサーバーが起動しない

超ざっくり情報ですが

Rubyバージョンのアップデートや
gem のアップデートをしたあとで

```
docker-compose build
docker-compose up
```

した時、エラーのスタックトレースに bootsnap とか spring とか bundler とか出てくる時

docker コンテナでの

```
rm -rf tmp/cache/bootsnap-compile-cache
rm -rf tmp/cache/bootsnap-load-path-cache
```

でも解決しなかった時

docker コンテナに入って

```
bundle clean --force
```

で起動するようになりましたが、理由まで確認してません
偶然かもしれませんが、何度か再現しています

お試しください

# Original by Github issue

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











<!-- Update From Qiita API -->

# チャットメンバー募集


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

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





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->
deviseのエラーメッセージ表示でビュー崩れ　対処法

#####はじめに
チーム開発でフリマアプリを模したものを開発しています。deviseのエラーメッセージ表示によるビュー崩れがあり、修正対応に少しハマったので、簡単ですが対処法を残しておきます。

環境
rails (5.2.4.2)
devise (>= 4.7.1)
devise-i18n (1.9.1)
devise-i18n-views (0.3.7)

■ユーザー登録画面　初期状態です
<img width="715" alt="20db8873e7b232ed634cde2d713668a2.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/600614/db61f277-6a80-2026-1fe3-f9b204e42c58.png">

■ユーザー登録に必要な項目の入力漏れがあると下図のようにエラーメッセージが表示されます。
（deviseの標準機能です。デフォルトが英語なので、日本語化する為にdevise-i18nというgemを導入しています）
ビューの縦方向のずれは、これらの要素を包んでいる親要素にheight:autoをかければ対応できます。
<img width="722" alt="3aa59123f01cb330ced59a610248d69b.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/600614/7ef4c6fc-61b1-363c-3eb4-d9326daba07f.png">

#####deviseのエラーメッセージ表示でビュー崩れ発生
問題は次です。
ユーザー登録画面の下部に移ります。

■ユーザー登録画面　初期状態です
<img width="1226" alt="3bf7cbbd68d2098532ef725afe1feb43.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/600614/ca68b508-0ab8-095a-7bc6-713e4d5cb5c1.png">

■deviseエラーメッセージ表示時の、ページ下部の様子です。生年月日のビューが崩れていますね。。
<img width="1186" alt="419d80f9005e5a68e36203729b670db0.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/600614/3243300b-3cad-b2ae-0173-619fb07926ff.png">

エラーメッセージ表示有無によって何が違うのでしょうか。
検証ツールをよく見ると、エラーメッセージ表示時に

```
<div class="field_with_errors">
```
というdiv要素が自動的に生成されていますね。（！）

エラーメッセージ表示前のビューをいくら整えても、表示後のビューを確認してびっくり。
さっき直したはずなんだけどなんで崩れてるんだろう、、、ってなります。

#####対処法
上記のdiv要素が自動生成されてしまうのは仕方ないので、この要素に対してCSSでdisplay: contentsをかけてあげましょう。
（他の対処法パターンについては確認しきれていません）

#####参考にさせていただいた記事
https://yukimasablog.com/rails-field-with-errors

#####所感
deviseはこういった細かい設定まで作り込まれているので、うまく使いこなすためにも、特性を理解して仲良くしていきたいと思います。。
elixir_make で使用する Makefile のパスを指定する方法

備忘録的に。

`mix.exs` の `project` の記述のところに，`make_makefile: "path/to/Makefile"` と記述すると，elixir_make で使用する `Makefile` のパスを指定することができます。

```elixir:mix.exs
defmodule MakeTest.MixProject do
  use Mix.Project

  def project do
    [
      app: :make_test,
      version: "0.1.0",
      elixir: "~> 1.10",
      compilers: [:elixir_make] ++ Mix.compilers,
      start_permanent: Mix.env() == :prod,
      make_makefile: "path/to/Makefile", # ← ここに Makefile へのパスを記述する
      deps: deps()
    ]
  end

  ...

end
```

`Application.app_dir` を使って指定したい場合ですが，この中に `Application.app_dir` を記述しても見つからない (アプリケーションが読み込まれる前なので) ため，例えば `Application.app_dir(:app, "priv/Makefile")` としたい場合には， `make_makefile: "_build/#{Mix.env()}/lib/app/priv/Makefile"` とします。

```elixir:mix.exs
defmodule MakeTest.MixProject do
  use Mix.Project

  def project do
    [
      app: :make_test,
      version: "0.1.0",
      elixir: "~> 1.10",
      compilers: [:elixir_make] ++ Mix.compilers,
      start_permanent: Mix.env() == :prod,
      make_makefile: "_build/#{Mix.env()}/lib/app/priv/Makefile", # ← app にアプリケーション名を入れる
      deps: deps()
    ]
  end

  ...

end
```

# 追記

`_build/$(MIX_TARGET)_dev/lib/$(app)` は次のように書くと少しスッキリします。

`#{Mix.Project.build_path()}/lib/$(app)`

```elixir:mix.exs
defmodule MakeTest.MixProject do
  use Mix.Project

  def project do
    [
      app: :make_test,
      version: "0.1.0",
      elixir: "~> 1.10",
      compilers: [:elixir_make] ++ Mix.compilers,
      start_permanent: Mix.env() == :prod,
      make_makefile: "#{Mix.Project.build_path()}/lib/app/priv/Makefile", # ← app にアプリケーション名を入れる
      deps: deps()
    ]
  end

  ...

end
```
【Rails】erbを一括でhamlに変える

**rails new**で自動生成される**erbファイル**を
hamlに一括変換する簡単な手順を
備忘録もかねて。。。

# haml-railsを導入
最下部に追加する

```:Gemfile

gem "haml-rails"

```
ここで【 **bundle install** 】

## あとはターミナル
下記コマンドを実行します。

```terminal:ターミナル
rails haml:erb2haml
```
　
うまく実行されると「Generating HAML for 」に続いて
変換されているファイルがずらっと表示される。
[![Image from Gyazo](https://i.gyazo.com/6c433d457a2b15b088b0f6ebacadf7f5.png)](https://gyazo.com/6c433d457a2b15b088b0f6ebacadf7f5)
下から６行目のように「Would you like...」と表示される。
（ **元の.erbファイルを削除しますか？**という内容 ）
 **「 y 」**を入力する。

____________________________________
もっと簡単な手順を知っている方いたら是非コメントください！
ご覧いただきありがとうございました。
#Ruby define Class VS Struct Vs OpenStruct code example 

```rb
# Ruby 2.7

# ------------------------
# Normal class
# receive some args
# ------------------------
class FooUser
  def initialize(name, age)
    @name = name
    @age = age
  end

  attr_reader :name, :age
end

alice = FooUser.new("Alice", 20)

p alice
#<FooUser:0x00007fb4d705d8e8 @name="Alice", @age=20>



# ------------------------
# Struct
# ------------------------
BarUser = Struct.new("BarUser", :name, :age)
bob = BarUser.new("Bob", 30)

p bob
#<struct Struct::BarUser name="Bob", age=30>




# ------------------------
# normal class
# receive keyword args
# ------------------------
class WowUser
  def initialize(name:, age:)
    @name = name
    @age = age
  end

  attr_reader :name, :age
end

carol = WowUser.new(name: "Carol", age: 40)

p carol
#<WowUser:0x00007f83cd017e00 @name="Carol", @age=40>


# ------------------------
# Open Struct
# Directly create instance
# ------------------------

require "ostruct"

david = OpenStruct.new(name: "David", age: 40)

p david
#<OpenStruct name="David", age=40>


# ------------------------
# Open Struct
# extend with Class
# ------------------------

require "ostruct"

class YeahUser < OpenStruct
end

eric = YeahUser.new(name: "Eric", age: 50)

p eric
#<OpenStruct name="David", age=40>

```

# Original by Github issue

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











<!-- Update From Qiita API -->

# チャットメンバー募集


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

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





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->
Djangoでmysqlclientをインストールしようとしたらerror: command 'gcc' failed with exit status 1と出た

# 環境

macOS Catalina 10.15.4

# エラーが出た！

新しく

```
python3 -m venv env
````
で仮想環境を構築してから

```
pip install mysqlclient
```

を実行したらタイトルのエラーにぶち当たる。

まず誰か先に同じエラーにぶちあたってる人いるでしょ！と思い調べてみると２パターンあるっぽくて、まず先のケースがこれ。

[Cannot install Pillow in macOS Mojave using brew #3438](https://github.com/python-pillow/Pillow/issues/3438#issuecomment-435169249)

こちらの方はpillowをpipでインストールしようとしたらエラーを出したようで、その原因はmojaveによるものらしい。
それで、解決策としては

```
sudo installer -pkg /Library/Developer/CommandLineTools/Packages/macOS_SDK_headers_for_macOS_10.14.pkg -target /
```
を実行したら私は出なくなりました！とのこと。しかし私の場合はこちらの手順を踏んでもエラーが解消されませんでした。
そもそもCatalinaにアップデートした方ではこの手順は不可能なようです。

もしかしたらこちらのパターンでうまくいく方もいらっしゃるかもしれないので書いておきます。

二つ目のケースがこれ。

[pip install ができない件（error: command 'gcc' failed with exit status 1)](https://qiita.com/ume1126/items/89d579fb5911522d7191)

これで一旦Xcodeをダウンロード、インストールした後にもう一度

```
pip install mysqlclient
```
実行。

すると
`ld: library not found for -lssl
linker command failed with exit code 1 (use -v to see invocation)
`
とエラーが変わる。どうやらパスを通してないことが原因のようなので

```
export LIBRARY_PATH=$LIBRARY_PATH:/usr/local/opt/openssl/lib/
```

を実行。

その後再びインストールしてみると成功。
うんうん悩みながらやってましたが無事解決できてよかったです。
vSphere リソースプール内のVMにPingをとばして生存確認

<pre>

#vSphereのリスト上で "PoweredON" となっていてもVMの "OS" が生きているかどうか、個別に確認したい

#vSphereに接続
Connect-VIServer -Server vcsa.vsphere.local -Protocol https -User 'Administrator@vsphere.local' -Password 'Password'

#リソースプール、VM、GuestOSの情報を収集
$respool   = Get-ResourcePool satatest
$vmlist    = Get-VM -Location $respool
$guestlist = Get-VMGuest $vmlist

#数が一致するか確認
$vmlist.count
$guestlist.count

#ipのリストを作ってみる
#と同時に、For文でPingを飛ばしてみる
$iplist    = @()
for ($i=0; $i -lt $guestlist.count ; $i++){
  if( $vmlist[$i].PowerState -eq "PoweredOn" ){
    $iplist += $guestlist[$i].IPAddress[0]
    echo $vmlist[$i].Name
    ping $iplist[$i]
  }else{
    $iplist += "noip"
    echo $vmlist[$i].Name " notRunning"
  }
}

#後記
$vmlist.PowetState の値　PoweredOn　と
$guestlist.State   の値　Running　は情報が一致するので同等とみて良さそう
従って、どちらかの情報をとってIPをゲットするのがよい
しかし、そも.そも$guestlist の中でOSが生きている、つまりRunningの時でないとIPは表示されない
従って、$guestlist.IPAddress の値が入っているか、NULLかで判断してもよいかもしれない。

IPの情報は、vSphereのリソースプールからVMリストを右に表示してExportでIPの項目を選ぶことでゲットできる

Pingの内容をすべて確認するのは厳しいので、上記ExportのPoweredONの数とPingの成功の数を比較し、同一であればPowerdONのVMはPingレスポンスがあると考えてよい。



#PoweredOnのみをカウント
$PoweredOn=0
for ($i=0; $i -lt $guestlist.count ; $i++){
  if( $vmlist[$i].PowerState -eq "PoweredOn" ){
    $poweredOn++
  }
}
echo $PoweredOn



</pre>
IT業界未経験だからこそ抑えておきたいスクールやprogateで学べない業務で必要な文章の書き方

はじめまして権兵衛([@Gonbee_audio](https://twitter.com/Gonbee_audio))です。
qiitaでの投稿では
モダンなweb系自社開発企業のインターンをリモートワークを通して学んだことをアウトプットがてら投稿していきます。

## markdown書式になれる。

自分が今qiitaで書いているこの記事もmarkdown書式で書いています。
web業界ではmarkdownで記事を書く事も業務の一環としてあります。

他の業種はわかりませんが、
友達の医療関係で働いている人にも聞いてみたら、wordやexcleで報告書を書いていたりしているみたいです。

markdownの書き方は簡単ですので少し記事を書いたら使えるようになると思います😇

書式はqiitaの場合は

![スクリーンショット 2020-05-02 8.04.11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/531209/38decb91-e665-9ef7-5244-a8a56fcf2f1e.png)

このようにサポートしてくれるので、qiitaで何かしら記事を書いてみるといいと思います！

### 何故業務で必要なのか？

では何故markdownで記事を書くことが大事か、それはqiita等で情報発信できるからです。
当たり前ですが、ビジネスと広告というものは切っても切れない関係にあります。
技術の事やエンジニアに関連することを発信することで、様々な人に見てもらう

技術ブログ等で発信する企業も勿論あると思いますが、このようなqiita等で発信をする方が広告として機能するので、qitiaで発信している企業さんは多いです。

qiitaはmarkdownで記事を書くことになるのでやはり使えるようになっておいた方がいいと思います。

またモダンな企業だと[backlog](https://backlog.com/ja/)でタスク管理もしたり吸えると思います。
backlogはmarkdowm書式で記事を書くのでやはり必要なスキルになるのかと思います。

## ブラインドタイピングになれる。

コレも当たり前っちゃ当たり前なのですが上記で書いた通り、コードを書くこと以上に文章を書くことが業務の中では多くなってくるので、効率を上げる上でブラインドタイピングも必要なスキルだと思います。

## 報告書の書き方になれる。

現在(2020/05/02)コロナウイルスのせいで未経験を雇う企業はリモートワークのインターンをやらざる追えない状況になっています。
その中で報告書の書き方はとても重要になってきます。
自分もリモートワークのインターンだったのでその中で注意された箇所を列挙していきます。

1. 自分の感情は最小限に
2. なるべく冗長にならないように
3. エラーや自分の作った成果物を公開できたらスクリーンショットを撮って添付する。
4. ですます調などフォーマットを統一する

## レスポンスはなるべく早く。

コレはどんな仕事のも言えますが、レスポンスが遅いとそもそも仕事したいと思わないと思います。
答えを出すのに時間がかかりそうなら何かしら一文を相手に送っておかないとやる気がないと判断されることが多いので要注意。

## 業務で使う文章のフォーマットを作っておく。

```
〇〇です
〇〇月××日
本日の業務は終了しました。
コレが本日の成果物です(url~~~)
```
みたいなフォーマットを作ってなるべく丁寧に返事を送る。
こんなの当たり前だと思いますが、リモートワークになるとface to faceで作業をするわけではないため意外とやらかしてしまいます😅


## 最後に

今回は書式関連を主に描きましたが、やはりプログラマーという仕事はプログラミングをしているだけでは稼げない。
マネタイズできないという事が多少はわかったのかと思います！
未経験だからこそqiitaを有効活用しよう！
Electron + Angular + Python で画像解析デスクトップアプリケーションを作りたい（希望）

# はじめに

ユーザのWindowsマシン内でスタンドアロンで動くデスクトップアプリケーションとして、画像解析アプリを作るため、良いGUIフレームワークを探している。候補の一つとして、前から使ってみたかったElectronの採用を検討。

# 要件

1. 格好良いGUIをこれまで持っているスキルセットで作りたい（ドラッグ＆ドロップなど複雑な操作を想定しているので、出来ればWebの技術）
2. GUIからのインプットを元に、Pythonによる画像解析処理をして、結果をGUIに返したい
3. スタンドアロンでの利用を想定、ユーザの環境設定は極力簡単にしたい
4. インプットをマシンの外に送信しない（ファイルが大きく通信環境が貧弱なため、処理に時間が掛かってしまう）

# 調査内容

## ElectronでAngularを使いたい

もともとのスキルセットとして、Angularを持っていたので、AngularとElectronを組み合わせて使いたいと思った。
[このブログ](https://neos21.hatenablog.com/entry/2018/10/13/080000) 通りに実装することで、Electron+Angularで簡単にデスクトップアプリケーションを実装することができた。

ビルドは[こちら](https://fireship.io/lessons/desktop-apps-with-electron-and-angular/) を参照にした。

Pythonの実行をどうしよう・・・

### 課題

* 要件1は実現時できそうだが、2〜4.が見通し立たず（特に3.が怪しい。。Pythonの実行環境と共に配布したいが、できるのだろうか・・・今後確認）
* 何か無理そう・・・Angularを使わなければ行けそうなので、[こちら](https://www.fyears.org/2015/06/electron-as-gui-of-python-apps.html)に舵を切るか。。

# 参考

https://neos21.net/blog/2018/10/13-01.html
https://fireship.io/lessons/desktop-apps-with-electron-and-angular/
https://ics.media/entry/7298/
https://www.fyears.org/2015/06/electron-as-gui-of-python-apps.html
今更メモリの種類について調べてみた件（２）

どうも初めまして！　

最近基本情報技術者の資格取得に向けて勉強中な駆け出しエンジニアのワカです。

#■この記事を書こうと思ったきっかけ
最近書籍を購入して勉強しているのですが、暗記ばかりでなかなか身にならないと思いました。

そこで基本情報に書かれている内容を自分なりに解釈したものをここに備忘録として書き残すことにしました。
そうすれば手も動かせるし人にみられると思うとその分責任感出ますしね！

あと個人的に今自作PCを作りたいとも考えているのでこの機会に詳しくなっとこうと思ったのも理由の一つです笑

もしかすると間違っている点などあるかもしれませんので、その時は指摘していただけると嬉しいです。

今回の記事は前回の記事の続きとなりますので前回の記事もぜひ読んでくださるとありがたいです。

[今更メモリの種類について調べてみた件（1）](https://qiita.com/waka-ken/items/96c75a27eafd908b553b)

##メモリの高速化手法

記憶装置には速度差があります。それは以下のような構図になっています

**CPU　＞　メモリ　＞　補助記憶装置**

（ちなみに価格帯は補助記憶装置＞メモリ＞CPUとなる）

この”＞”の部分には「超えられない壁」と言ってもいいくらいの差が存在しこの差（ギャップ）を埋めることで持ち時間などのロスをできるだけなくすことが図られます。

このロスをなくすための手法が**キャッシュ**です

###キャッシュメモリ
CPUとメモリとのデータのやりとりを行う際先ほども言った通り、
処理の速度差の影響でCPUよりメモリ側の処理の方が遅いです。

それを解消するのが**キャッシュメモリ**（通常CPU内に入っている装置）です。

ではキャッシュメモリが何をやっているかというと、「**メモリからCPUへのデータを一時的に保持**」しています。

も少し詳しく説明すると、
メモリからCPUへデータを読み込むときに作動。
↓
メモリからCPUへ送られたデータをキャッシュメモリで保持。
↓
次回CPUからメモリへ同じデータの読み込み命令が出たときキャッシュメモリで保持していたデータが読み込まれる
↓
結果としてメモリが読み込まれず、その分早く処理される。（キャッシュメモリにない場合メモリ側へ読み込みが行われる）

キャッシュメモリはCPU内の物だけではなく複数の設置が可能で、その時に用いられるのが前回説明した**SRAM**になります。（ちなみにこのキャッシュメモリの呼び方をアクセスする順番に「１次キャッシュ」、「2次キャッシュ」と呼びます。）

###ディスクキャッシュ

キャッシュメモリがCPUとメモリの間を担うのに対して、メモリと補助記憶装置との間を担うキャッシュも存在します。それが**ディスクキャッシュ**です。

ディスクキャッシュは専用に半導体メモリを搭載したり主記憶装置の一部を間借りすることをして実装しています。

これまで説明してきたのをまとめると

CPU
↓→ここにキャッシュメモリ
主記憶装置（メモリ）
↓→ここにディスクキャッシュ
補助記憶装置（HDD、SSD）

この上記のような階層を**記憶階層**と言います。

##キャッシュメモリにおける書き込み方式
キャッシュメモリは読み出しだけじゃなく書き込みも行われます。

ですがこの時処理速度が早いからと言ってキャッシュメモリだけでやりとりをしていると、いつまでもメモリ側が更新されず整合性が取れなくなってしまう危険性があります。

実は読み込みに対して、書き込みは単に処理の代行をするだけでは不十分です。どこかのタイミングでメモリ側へ変更の処理を更新してしてあげないといけないのです。

その方式には２種類ありそれが**ライトスルー方式**と**ライトバック方式**です。

**ライトスルー方式**・・・キャッシュメモリへの書き込みを行うと同時にメモリへの書き込みも行う。（高速化は望めないが確実にデータが一致する）

**ライトバック方式**・・・普段はキャッシュメモリへのみ書き込みを行う。キャッシュに入り切らなくなったデータが発生したタイミングでメモリへ書込みが行われます。

###キャッシュメモリのヒット率と実行アクセス時間
キャッシュメモリは容量が小さいので必ずしも目的のデータが入っていることは限りません。この「目的とするデータがキャッシュメモリに入っている確率」のことを**ヒット率**と言います。

これとは逆の考え方で「キャッシュメモリになくてメモリへ読み込みに行く確率」を**１ーヒット率**で表します

この考え方から実行アクセス時間は次のようなやり方で求めることができます。

キャッシュメモリにアクセスする時間（①）　＝　キャッシュメモリのアクセス時間　x　ヒット率

メモリへアクセスする時間（②）　＝　メモリのアクセス時間　x　（１ーヒット率）

①　＋　②　＝　**実行アクセス時間**

#■最後に

ここまで長々と読んでくださりありがとうございました！
少し説明がわかりにくかった部分があるかと思いますが、もしわからないところがあればコメントしていただけると嬉しいです。

では！次の記事にて！
Raspberry Pi Mouseの準備を進めてみた（その3）

久しぶりにさわりました。GPIOの出力確認でLED点灯させました。
![705943C5-9614-405A-A33E-882E24E7CFC9.jpeg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/298045/6a83e787-9cea-901f-14d8-83774d520ac9.jpeg)

本「[Raspberry Piで学ぶROSロボット入門](https://www.nikkeibp.co.jp/atclpubmkt/book/17/261040/)」の4.4章のmake install後にls -l /dev/rt*でデバイスが見えずにはまりました。いろいろ迷走して、3.2.1章でデバイスドライバをインストールしなおしたら、うまく行くようになりました。
4.4.2章のブランチのグラフ表示でリポジトリのページに「Graphs」と書いてありましたが、正しくは「Insights」でした。[このページ](https://help.github.com/ja/github/visualizing-repository-data-with-graphs/viewing-a-repositorys-network)が参考になりました。

上記本はWindowsのKindleで読んでいるのですが、突然Kindle起動しなくなりました。再インストールしたら起動するようになりました。
![872D3D27-ACCA-4122-BF72-A414E4550842.jpeg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/298045/7e9791e9-6c25-4b0d-9b58-193d54bd6563.jpeg)

第5章ROSツアー終わりました。LED点滅させたり、モーターまわしたり、ブザー鳴らしたり、ロボットが動くと楽しいです。
次は第6章から。
都道府県庁間の距離行列（単位：m）



都道府県県庁間の距離行列（単位：m）を作成してみました。

```r
dist_Pref <- read.csv("https://raw.githubusercontent.com/yoshida-gisc/stockroom/master/distmat_Pref.csv")
dist_Pref[1:6,1:6]
#    PrefName Hokkaido   Aomori     Iwate    Miyagi     Akita  Yamagata
# 1  Hokkaido      0.0 253809.6 373582.28 534013.96 385851.16 542058.09
# 2    Aomori 253809.6      0.0 129308.02 283958.87 134229.07 288698.14
# 3     Iwate 373582.3 129308.0      0.00 161119.79  90055.14 176229.35
# 4    Miyagi 534014.0 283958.9 161119.79      0.00 174197.75  44628.38
# 5     Akita 385851.2 134229.1  90055.14 174197.75      0.00 165634.86
# 6  Yamagata 542058.1 288698.1 176229.35  44628.38 165634.86      0.00
```

都道府県県庁間の距離は、[国土地理院](https://www.gsi.go.jp/KOKUJYOHO/kenchokan.html) がGRS80楕円体に基づく最短距離（測地線長）を公開しています。

空間計量経済モデルの空間重み行列を作成するときなどにも使ったことがあったのですが、単位がkmで小数第一位までになっていて、m だったらなと思ったことがありました（なぜだっけ...）。

次のような疑問や希望がありえそうということで下記コードより作成しました。

- GISソフトを用いれば2点間距離は簡単に計算できるが投影座標系の区域境界をまたぐような長距離はどう計算したらよいか。
- 全国の市区町村（役所）間距離や町丁目間距離を計算しようとするとなると単位は m がよい。

```r
library(geosphere)
library(data.table)
# PrefCapital.csv は https://www.benricho.org/chimei/latlng_data.html から
# 都道府県庁所在地の緯度経度をDLし、簡単に整形したもの
# このリンクのソースは https://www.gsi.go.jp/KOKUJYOHO/center.htm
dat <- fread("C:/Users/hoge/PrefCapital.csv")
head(dat)
#   PrefCapital      Lon      Lat
# 1:      北海道 141.3469 43.06417
# 2:      青森県 140.7400 40.82444
# 3:      岩手県 141.1525 39.70361
# 4:      宮城県 140.8719 38.26889
# 5:      秋田県 140.1025 39.71861
# 6:      山形県 140.3633 38.24056

## geosphere::distGeo() 関数のデフォルトはWGS84楕円体のため、GRS80楕円体のパラメータに設定し直す
## WGS84楕円体とGRS0楕円体は扁平率 f がごく僅かに異なる（長半径 a は同じ）
formals(distGeo)$f <- 1/298.257222101
dist_Pref <- geosphere::distm(dat[,c("Lon","Lat")], fun = distGeo)
colnames(dist_Pref) <- dat$PrefCapital
rownames(dist_Pref) <- dat$PrefCapital

# m 単位の都道府県庁間の距離
# km 単位の https://www.gsi.go.jp/KOKUJYOHO/kenchokan.html とも整合
dist_Pref[1:6,1:6]
#         北海道   青森県    岩手県    宮城県    秋田県    山形県
# 北海道      0.0 253809.6 373582.28 534013.96 385851.16 542058.09
# 青森県 253809.6      0.0 129308.02 283958.87 134229.07 288698.14
# 岩手県 373582.3 129308.0      0.00 161119.79  90055.14 176229.35
# 宮城県 534014.0 283958.9 161119.79      0.00 174197.75  44628.38
# 秋田県 385851.2 134229.1  90055.14 174197.75      0.00 165634.86
# 山形県 542058.1 288698.1 176229.35  44628.38 165634.86      0.00
```

市区町村や町丁目のポリゴンデータを持っていればその重心点の緯度経度と上のコードから、測地線距離に基づいた市町村間、町丁目間の距離行列が生成できる。市区町村の役所の緯度経度は [国土地理院](https://www.gsi.go.jp/KOKUJYOHO/center.htm) がまとめているので、PDFを整形し、60進法表記を @uri さんの[kuniezuパッケージ](https://github.com/uribo/kuniezu) や [pazerパッケージ](https://github.com/ropensci/parzer)を活用して10進法に変換後、上のコードから市区町村役所間の距離行列が作成できそう。

次は、OSMの道路ネットワークを使った最短経路距離について、[rgrass7パッケージ](https://cran.r-project.org/web/packages/rgrass7/index.html)でやってみよう...。
AtCoderの問題の難易度推定（簡易版）

この記事は[AtCoder Problems](https://kenkoooo.com/atcoder/)にDifficultyがつく前に考えていたことを形にしたものです。難易度推定の方法としてはかなり単純なものとなります。

【2020/11/17更新】
安定性が高く確実に推定できることから、AtCoder Problemsでも似た方法に切り替わったようです。

- [難易度推定に用いるアルゴリズムを公式のレーティングと同じものにする ](https://github.com/kenkoooo/AtCoderProblems/issues/814)
- [Implemented binary search-based difficulty estimation.](https://github.com/kenkoooo/AtCoderProblems/pull/815)

# AtCoder ProblemsのDifficulty
[AtCoder Problems](https://kenkoooo.com/atcoder/)にはDifficultyが表示されています。難易度推定には2PL IRTモデルを使用して<del>います</del>[^AGC-A]<ins>いました</ins>[^Update]。以下のページで詳細に解説されています。

- [AtCoder Problems の難易度推定について](http://pepsin-amylase.hatenablog.com/entry/atcoder-problems-difficulty) (amylaseさん)

# 本記事の目的
本記事では、Ratedな正答者数だけを用いて難易度を簡易的に推定する方法を提案します。

# 手法
Ratedな参加者だけを考慮することにします。問題にも参加者と同様のレートがあると考え、問題の難易度が$D$、参加者の内部レートが$R$ならば正答率は$\frac{1}{1+6^{(D-R)/400}}$になると仮定します[^1PL]。このとき、[AtCoderのレート計算式](https://www.dropbox.com/sh/zpgcogxmmu84rr8/AADcw6o7M9tJFDgtpqEQQ46Ua?dl=0&preview=rating.pdf)（[Qiita上の解説記事](https://qiita.com/anqooqie/items/92005e337a0d2569bdbd)）の内部パフォーマンス計算式$\sum\frac{1}{1+6^{(X-APerf_i)/400}}=r-0.5$[^Perf]の右辺を正答者数に置き換えた時の$X$が難易度の最尤推定値になります。つまり、正答者数を$K$とすると、$K+0.5$位の内部パフォーマンスが推定難易度になります。ただし$K+0.5$位の内部パフォーマンスを得ることができなかったため、代わりに$K$位の内部パフォーマンスを用いることにします。調査対象は2019年1月から2020年4月までのRatedコンテストと[AtCoder Beginners Selection](https://atcoder.jp/contests/abs)の問題とします。

# 結果
- [推定難易度一覧](https://docs.google.com/spreadsheets/d/1MIMRqci6eQeZx4M4tlWenEQkwI29vQYyh5-kv2Q2IBQ/edit?usp=sharing) (Googleスプレッドシート)
    - infはRatedな正答者なし
    - WTFのA, B, C, D, E, FはそれぞれA, B, C1, C2, D, E
    - Tenka1-2019-beginnerとTenka1-2019は同時開催

# 旧Difficultyとの比較
## 推定値の違い
[AtCoder Problems](https://kenkoooo.com/atcoder/)の<ins>旧</ins>Difficultyと比較すると、Difficulty400以下の易しい問題の難易度が高めに見積もられ、Difficulty2800以上の難しい問題の難易度が低めに見積もられる傾向があります。Difficulty1200程度の問題は概ね50以内の差に収まっています。

## 速報性
[ac-predictor](https://ac-predictor.azurewebsites.net/)を使えばコンテスト中やコンテスト直後にパフォーマンスを知ることができます。遅くともレート更新までには難易度が分かるため、本記事で説明する方法は速報性に優れています。

## 安定性
【2020/11/17追加】
旧Difficultyでは推定に失敗するケースがありました。この方式ではコンテスト中にAC者と未AC者が1人ずついれば必ず推定できます。

# まとめ
AtCoderの問題の難易度を簡単に推定する方法を説明しました。コンテスト直後に大まかな難易度を知るために使えるでしょう。ただし低難度や高難度の問題では推定値が<ins>旧</ins>Difficultyから大きくずれることが多いため、十分注意して使用してください。

[^AGC-A]: AGC-A問題を除く
[^Update]: AtCoder Problemsも1PL IRTモデルに切り替わったようです。
[^1PL]: 1PL IRT仮定。この仮定を置くと正答率50%と90%のレート差は約490となり、[実測値と大体同じになります](https://twitter.com/not_522/status/1235867900637892611)。
[^Perf]: $X$は補正前内部パフォーマンス、$APerf_i$は参加者$i$の内部レート、$r$は参加者の順位
Colabのテクニック

# セル内でのファイルの記述

```
%%writefile main.py
print("hello")
```

# Check GPU

```
!nvidia-smi
```

# セルでbash

```
%%bash
pwd
ls
```

# 参考
https://odan3240.hatenablog.com/entry/2020/03/13/015228

https://github.com/chervonij/DFL-Colab

https://qiita.com/funatsufumiya/items/e455ab8d801af6e1415d
WSL Ubuntu Upgrades

Windows Store の更新履歴に`Ubuntu 2004.2020.424.0`が見えたのでアップデートを始めたが、結果は、`Ubuntu 18.04`から`Ubuntu 19.10`という結果になったwww

### インストールバージョンを確認

```console
$ cat /etc/lsb-release
DISTRIB_ID=Ubuntu
DISTRIB_RELEASE=18.04
DISTRIB_CODENAME=bionic
DISTRIB_DESCRIPTION="Ubuntu 18.04.3 LTS"
$ uname -a
Linux DESKTOP-39L87N5 4.4.0-18362-Microsoft #476-Microsoft Fri Nov 01 16:53:00 PST 2019 x86_64 x86_64 x86_64 GNU/Linux
```

### アップデートコマンドを実行する

`do-release-upgrade`コマンドで実行するそうです。
https://wiki.ubuntu.com/WSL

```console
$ do-release-upgrade
Checking for a new Ubuntu release
There is no development version of an LTS available.
To upgrade to the latest non-LTS develoment release
set Prompt=normal in /etc/update-manager/release-upgrades.
```

アップデートするためには、`set Prompt=normal`と設定しろと言っているようなので編集する。

```config:/etc/update-manager/release-upgrades
# Default behavior for the release upgrader.

[DEFAULT]
# Default prompting behavior, valid options:
#
#  never  - Never check for, or allow upgrading to, a new release.
#  normal - Check to see if a new release is available.  If more than one new
#           release is found, the release upgrader will attempt to upgrade to
#           the supported release that immediately succeeds the
#           currently-running release.
#  lts    - Check to see if a new LTS release is available.  The upgrader
#           will attempt to upgrade to the first LTS release available after
#           the currently-running one.  Note that if this option is used and
#           the currently-running release is not itself an LTS release the
#           upgrader will assume prompt was meant to be normal.
Prompt=lts
```

```console
$ sudo vi /etc/update-manager/release-upgrades
```

```config
# Default behavior for the release upgrader.

[DEFAULT]
# Default prompting behavior, valid options:
#
#  never  - Never check for, or allow upgrading to, a new release.
#  normal - Check to see if a new release is available.  If more than one new
#           release is found, the release upgrader will attempt to upgrade to
#           the supported release that immediately succeeds the
#           currently-running release.
#  lts    - Check to see if a new LTS release is available.  The upgrader
#           will attempt to upgrade to the first LTS release available after
#           the currently-running one.  Note that if this option is used and
#           the currently-running release is not itself an LTS release the
#           upgrader will assume prompt was meant to be normal.
Prompt=normal
```

そして、`do-release-upgrade`を実行する。

```console
$ do-release-upgrade
```

この後、30分後ぐらいかな、アップデート完了し、再起動しろと要求されるので実施した。

### アップデート後

```console
$ uname -a
Linux DESKTOP-39L87N5 4.4.0-18362-Microsoft #476-Microsoft Fri Nov 01 16:53:00 PST 2019 x86_64 x86_64 x86_64 GNU/Linux
$ cat /etc/lsb-release
DISTRIB_ID=Ubuntu
DISTRIB_RELEASE=19.10
DISTRIB_CODENAME=eoan
DISTRIB_DESCRIPTION="Ubuntu 19.10"
```
Macの画面キャプチャした動画をtwitterに上げる備忘録

#はじめに
最近　RME Babeface Proを手に入れたのですが、オーディオインターフェースでLoopbackという機能で、PCの音声出力を入力に戻す機能があり、これを利用すると Quicktimeの画面収録時にPCの音も合わせて記録できます。
そこではまったので、備忘録。

#オーディオインターフェースのループバック
若干の遅延があるものの、手軽に音がとれるところが良いです。
とはいってもルーティングを間違えると簡単にフィードバックループが発生し、大爆音とともに下手すると機材や耳を壊しかねない状況に陥るので注意。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/96808/0049543b-4da4-676a-5811-956cfe36e778.png)

Quicktimeの画面収録時のボリュームを0にしておくことで回避できる。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/96808/4dced2ce-0a79-8fb7-cace-483b0588abd3.png)

これ、ボリュームをちょっとでもあげてしまうと、Quicktimeのモニターしたものがさらに出力されて　フィードバックしてしまい、どんどん音が増えて　大爆音になります。


#ループバック時のチャンネル数に気をつける

どうやらこのデバイスは8chのオーディオを出力しているようで、Quicktimeで記録したデータの情報を見るとわかります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/96808/ac7df8f1-f3c6-2d1c-3091-3576c8c3cfc4.png)

このままだとTwitterにはあげられません。 
最初なんでエラーなのかわからず困りました。（エラー内容は詳細まで出して欲しい）

ステレオにするにはffmpegで以下のようなコマンドを入れます。
あと.movもあげられないので.mp４に変換

```
ffmepg -i 元動画.mov -ac 2 変換後動画.mp4
```

こうすると　オーディオチャンネル数が2のmp4動画になります。

#録音時の音量について

もし最終出力のボリュームが小さいとそのまま小さく記録されてしまうので、音量は適切に設定しておきましょう。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/96808/79f4dd3c-37ba-1d8b-e936-e55bd06fa532.png)

大きすぎても音割れしてしまうので注意。

#サイズに気をつける
もし、サイズが大きくてあげられない場合とかは
Quicktimeの書き出すメニューが小さめのサイズを選ぶと良いです。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/96808/390099a6-5d23-2e42-3036-f8045455589a.png)


なおmp4にするだけでかなり小さくなります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/96808/c818225f-b068-dea4-1d70-5e614f6d75a8.png)

以上
laravelメモ　the page has expired due to inactivity. please refresh and try again

#laravelのpostリクエストでエラー

form内に@csrfを記述することで解消

```php:sample.php
<form action="" method="post">
@csrf
~
</form>
```
##ついでに,,,@csrfとは

クロス・サイト・リクエスト・フォージェリ(CSRF)とは、Webアプリケーションの脆弱性・またそれを利用した悪意のある攻撃のこと。
サイト内で何らかの情報(user_idなど)を保持した状態で、攻撃者の悪意あるURLを踏むことで、情報を送信してしまう恐れがある。

laravelでは、この対策のためにform内に@csrfトークンを書くことが必要となる。
初心者によるプログラミング学習ログ 305日目

#100日チャレンジの305日目
twitterの100日チャレンジ#タグ、#100DaysOfCode実施中です。
すでに100日超えましたが、継続。
100日チャレンジは、ぱぺまぺの中ではプログラミングに限らず継続学習のために使っています。
305日目は、
<blockquote class="twitter-tweet"><p lang="ja" dir="ltr">おはようございます<br>305日目　2h<br>・xdデザインカンプからのサイト模写<br>・細かいところ修正<a href="https://twitter.com/hashtag/%E6%97%A9%E8%B5%B7%E3%81%8D%E3%83%81%E3%83%A3%E3%83%AC%E3%83%B3%E3%82%B8?src=hash&amp;ref_src=twsrc%5Etfw">#早起きチャレンジ</a><a href="https://twitter.com/hashtag/%E9%A7%86%E3%81%91%E5%87%BA%E3%81%97%E3%82%A8%E3%83%B3%E3%82%B8%E3%83%8B%E3%82%A2%E3%81%A8%E7%B9%8B%E3%81%8C%E3%82%8A%E3%81%9F%E3%81%84?src=hash&amp;ref_src=twsrc%5Etfw">#駆け出しエンジニアと繋がりたい</a><a href="https://twitter.com/hashtag/100DaysOfCode?src=hash&amp;ref_src=twsrc%5Etfw">#100DaysOfCode</a></p>&mdash; ぱぺまぺ@webエンジニアを目指したい社畜 (@yudapinokio) <a href="https://twitter.com/yudapinokio/status/1256318778519896067?ref_src=twsrc%5Etfw">May 1, 2020</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
コマンドラインでFCMプッシュ通知を送る

# 参考リンク
- [FCM (Firebase Cloud Messaging)](https://firebase.google.com/docs/cloud-messaging)
- [サーバー側からトピックを管理する](https://firebase.google.com/docs/cloud-messaging/manage-topics?hl=ja)
- [現在の登録トークンの取得](https://firebase.google.com/docs/cloud-messaging/js/client?hl=ja#%E7%8F%BE%E5%9C%A8%E3%81%AE%E7%99%BB%E9%8C%B2%E3%83%88%E3%83%BC%E3%82%AF%E3%83%B3%E3%81%AE%E5%8F%96%E5%BE%97)

# .env 設定ファイル
```bash

# Firebase Console > プロジェクトを設定 > Cloud Messaging > サーバーキー
FIREBASE_SERVER_KEY=''

# プッシュ通知を受け取るChromeのデバイストークン
IID_TOKEN=''

# トピック名
TOPIC_NAME=''

# 通知をクリックしたときの遷移先
CLICK_ACTION=https://xxxx.xxxx
```

# トピックを購読する
```bash
source .env

curl -s -XPOST --header "Authorization: key=${FIREBASE_SERVER_KEY}" \
  --header "Content-type: application/json" \
  --header "Content-Length: 0" \
  "https://iid.googleapis.com/iid/v1/${IID_TOKEN}/rel/topics/${TOPIC_NAME}"

./get.sh
```

# トピックを購読解除する
```bash
source .env

curl -s -XDELETE --header "Authorization: key=${FIREBASE_SERVER_KEY}" \
  --header "Content-type: application/json" \
  --header "Content-Length: 0" \
  "https://iid.googleapis.com/iid/v1/${IID_TOKEN}/rel/topics/${TOPIC_NAME}"

./get.sh
```

# ステータスを表示する
- 結果がjsonで返ってくるので [jq](https://stedolan.github.io/jq/) で見ると良いです

```bash
source .env

curl -s --header "Authorization: key=${FIREBASE_SERVER_KEY}" \
    "https://iid.googleapis.com/iid/info/${IID_TOKEN}?details=true" | jq
```

# トピックに送る
```bash
source .env

curl \
        -s \
        -d "{ \
        \"to\": \"/topics/${TOPIC_NAME}\", \
        \"priority\": \"high\", \
        \"notification\": { \
            \"title\": \"テストTitle\", \
            \"body\": \"テストBody\", \
            \"icon\": \"https://via.placeholder.com/60x60.png?text=TEST\", \
            \"image\": \"https://via.placeholder.com/480x360.png?text=TEST\", \
            \"click_action\": \"${CLICK_ACTION}\" \
        } \
        }" \
        -H "Authorization: key=${FIREBASE_SERVER_KEY}" \
        -H "Content-type: application/json" \
        https://fcm.googleapis.com/fcm/send
```

# ほか
- 反応があればもうちょっと書くかもしれない
webpack超超入門(備忘)

# webpackとは
webpackはフロントエンド開発用のモジュールバンドラー、簡潔にはモジュールをまとめてくれるツール

## 用語
- モジュール 
javascriptやcssなどのファイル。

- バンドル/バンドルファイル
モジュールが一つにまとめられたファイル。

- ビルド
バンドルを出力するまでの一連の処理

## 利点
- 機能ごとにファイルを分割(モジュール化することができる。)
- 可読性の向上
- 開発作業の分担やテストがし易くなる
- モジュールの再利用性を向上できる。
- 転送効率を向上させることができる。
- 最適化されたファイルを出力できる。

## install
何はともあれやってみないといまいちよくわからないので、早速nodeからwebpackをインストール。

- 適当なディレクトリを切って、package.jsonを初期化
 
```shell
yarn init -y
```

- webpackとwebpack-cliをインストール(webpack4からcliが別モジュールとして管理されるようになったため、別途インストールが必要らしい。)

```shell
yarn add webpack webpack-cli -D
```
package.jsonはこんな感じになり、インストールされたことを確認できる。

```package.json
{
  "name": "webpack-tmp",
  "version": "1.0.0",
  "main": "index.js",
  "license": "MIT",
  "devDependencies": {
    "webpack": "^4.43.0",
    "webpack-cli": "^3.3.11"
  }
}
```

## バンドル確認
この段階でwebpackを実行して、モジュールをバンドルすることができるので、動作確認としてcliからバンドル。適当にjsを作成。

```
root/
　├ node_modules/
　├ src/     #作業ディレクトリ
　│　└ index.js
　└ package.json
```

```index.js
console.log('bundle test');
```

webpackを実行。(modeオプションで開発用(development)かプロダクション用を選択できる。

```shell
yarn webpack --mode development
```
実行が完了すると、新たにdistフォルダが作られ、バンドルされた`main.js`が格納されていることを確認できる。

```
root/
　├ dist
　│　└ main.js ←new! 
　├ node_modules/
　├ src/     #作業ディレクトリ
　│　└ index.js
　└ package.json
```

## webpack.config.js(webpackの設定ファイル)
cliでバンドルする際には、--modeや色んなオプションをコマンドで付与することでwebpackの挙動を制御をしますが、毎回それを打つのは面倒なので、設定ファイルを読み込ますことで様々な挙動をコントロールできます。

オブジェクトリテラル（名前と値のペア）で記述するだけなので、nodeがサポートしているcommonJSの記法(module.exports = ...)でも構わないのですが、個人的にes6で書きたいので、babelを使ってconfigをes6→es5にトランスパイルします。
具体的にはbabel/registerでconfigファイルを読み込む前にes6をトランスパイルさせます。

###install

```shell
yarn add @babel/core @babel/register @babel/preset-env -D
```

babelを使ってトランスパイルするので`.babelrc`をプロジェクト直下に配置します。(`.babelrc`はes6をトランスパイルできればいいので、適当)

```shell
{
  "presets":["@babel/preset-env"]
}
```

これでes6で書けるようになったので、中身を書いていきます。
babelでconfigファイルをトランスパイルする際は、`webpack.config.babel.js`としないと認識しないので注意(トランスパイルとか面倒なことしないよ、という場合は`webpack.config.js`で問題ないです。)

```webpack.config.babel.js
import path from 'path';

export default {
  mode: 'development',
  entry: './src/index.js',
  output: {
    path: path.resolve(__dirname, 'public'),
    filename: 'bundle.js'
  }
}
```

もうただバンドルするだけだぜ、な設定ですが、超超入門なので問題ないでしょう。
先ほどcliからwebpackコマンドでバンドルした際には--modeなどを設定しましたが、configファイル内に
オプションを記載してます。
見ればなんとなくわかるような気がしますが、それぞれの項目のざっとした意味を↓に。
詳細は公式なりを参照してください。

- mode: 'development' 'production' 'none'を指定する。productionを指定すると難読化や最小化を行ってくれる。（必須設定項目)
- entry: 'エントリーポイントとなるjsファイル
- output: バンドルした結果をどのディレクトリに、どのファイル名で出力するかの設定。

これでconfigファイルを使って、バンドルする準備ができたのでバンドルしてみます。
先ほどはオプション指定しましたが、configファイルを自動で読んでくれるので、今回は指定しないで大丈夫です。

```shell
yarn webpack
```
### 結果

コマンドが成功すると、以下のようなディレクトリになっているはずです。

```
root/
　├ dist
　│　└ main.js 
　├ public  ←new!
　│　└ bundle.js  ←new! 
　├ node_modules/
　├ src/     #作業ディレクトリ
　│　└ index.js
　└ package.json
```
webpack.babel.jsに書いた設定でバンドルできました！
javascriptだけ単純にバンドルする場合は以上のような感じになります。
webpackでは他にもloaderという機能を使ってjavascript以外（画像とかcss)をバンドルすることも可能です。

## まとめ
おおざっぱに理解していたwebpackの知識を一旦整理してみたけど、loaderとかpluginの話に到達しないで力尽きた。。。
webpackをまとめようとすると、babelやらscssやらの話が付き纏うのでいまいちうまくまとめられない。
そのうちloaderやらについても書いてみたい。
Syphonを中心としたLive Productionメモ

Syphonを使えば、
Decklinkキャプチャー→openFrameworks→OBS→YouTube
とかいろいろできそう。

#リソースまとめ
**Syphon**
http://syphon.v002.info/
https://github.com/Syphon

**Quartz Composer**
https://developer.apple.com/download/more/?name=graphics
Quartz FrameworkはmacOS Catalina 10.15では非推奨とのこと。
https://developer.apple.com/documentation/macos_release_notes/macos_catalina_10_15_release_notes

**OBS Open Broadcaster Software**
配信アプリ。スイッチャー機能とかいろいろ。
Blackmagicなどのハードウェアスイッチャーでできないことができる。
https://obsproject.com/ja

##Syphon Tools
**Syphon Simple Apps**
シンプルなサーバー、クライアント。
デバッグで超使う。
https://github.com/Syphon/Simple

**Syphon for Quartz Composer**
Quartz ComposerでSyphon入出力を行う。
https://github.com/Syphon/Quartz-Composer

**Black Syphon**
Blackmagic Design DecklinkシリーズとSyphonを接続。
入出力（サーバー/クライアント両方）可能
https://vdmx.vidvox.net/blog/black-syphon

**Camera Live**
DSLRカメラをSyphonに接続。
USB経由でカメラプレビューから映像を取得。
SONY α7II、RX100Vで動作確認。（起動にコツが要る）
https://github.com/v002/v002-Camera-Live

**TCPSyphon**
Syphonをネットワーク経由でやりとりするツール。
残念ながらディスコン。
http://techlife.sg/TCPSyphon/index_jp.html
[残骸](https://mypage.techlife.sg/products/TCPSyphon.zip)

**TLSyphonViewer**
TCPSyphon経由でSyphonサーバーの映像をiPhoneに飛ばす。
残念ながらディスコン。ただしAppStoreで入手可能。
http://techlife.sg/TLSyphonViewer/index_jp.html

**TLRemoteCamera**
スマホカメラをTCPSyphonで飛ばす。
残念ながらディスコン。手に入らず。
現在はAirBeamで行う。
http://techlife.sg/TLRemoteCamera/index_jp.html

**AirBeam**
iPhone/iPadのカメラをネットワーク経由で飛ばす。
Mac側アプリがSyphonサーバーとして機能する。
https://apps.apple.com/jp/app/airbeam/id442963716

**CamTwist**
映像ソースにエフェクトをかけてUVC出力。
ここでは、Syphon→UVCの変換に使用。
http://camtwiststudio.com/

**openFrameworks Add-on**
ofxSyphon
https://github.com/astellato/ofxSyphon

##Spout
**Spout**
https://spout.zeal.co/

**TCPSpout**
https://mypage.techlife.sg/products/TCPSpout.zip

**BlackSpout**
https://magicmusicvisuals.s3.amazonaws.com/downloads/BlackSpout.zip

**openFrameworks Add-on**
ofxSpout2
https://github.com/Kj1/ofxSpout2

##NDI
NDIは、米国NewTek社によって開発されたIP利用におけるライブビデオ制作ワークフロー支援プロトコル。
http://tricaster.jp/ndi-central/

**NewTek NDI Tools**
NewTek公式フリーのNDIアプリケーション郡。
http://tricaster.jp/ndi-central/ndi-tools

**NDI Connect**
https://www.newtek.com/ndi/applications/connect/

**Medialooks NDI to SDI converter**
https://www.medialooks.com/products/

**NDI Syphon**
SyphonをNDIに送受信。
https://docs.vidvox.net/freebies_ndi_syphon.html

**openFrameworks Add-on**
https://github.com/leadedge/ofxNDI
https://github.com/nariakiiwatani/ofxNDI
https://github.com/thomasgeissl/ofxNDI
いくつかみつかるけどどれがいいかな？

##OBS Plug-in
**OBS Virtual Camera**
OBSにUVC出力機能をつけるプラグイン。
https://github.com/johnboiles/obs-mac-virtualcam

##Unity Plug-in
**Syphon Unity Plug-in**
2015年でメンテナンス終了。
KlackSyphonを使えとのこと。
https://github.com/Syphon/Unity3D

**KlackSyphon**
https://github.com/keijiro/KlakSyphon
HTMLの基礎①（float,Flexbox）まとめ

#この記事の内容
- float について
- Flexbox について
- 後書き

なお、この記事ではプログラミングスクールに通うこと、２週間の私が復習するために
書き残しているメモみたいな内容なので、間違った解釈が多々あるかも知れません。

何卒ご了承くださいm(_ _)m

##floatについて
要素を左、または右に寄せる際に使う。
`float:left;`
これを適用したい要素に付けるだけ...これだけならいいのだけど
問題が発生する場合があって、理解するのが地味に難しい。

###問題点
1. 回り込ませたくない要素を回り込ませてしまう。
2. 親要素の高さがなくなる。

1について、float は並べるというより、浮かせて配置している。
そのため、その後に続く要素が支えを失い浮かせた要素の下に回り込んでしまう。

2について、floatは浮かせているので、親要素は float が
適用されている子要素の高さを認識できなくなる。

###解消方法
解消方法は調べてみたところ、色々あるみたいだけど *clearfix* を
使うのが、一般的みたいなのでそれを書き留めておきます。

CSSファイルの最終行に
`.clearfix::after {
  content: "";
  clear: both;
  display: block;
}`
を追加して、float の副作用を解決したい要素に *clearfixクラス* を
付与することで解消することが可能です。

##Flexboxについて
こちらも横に並べたい時に使う。
floatとの違いは、並べたい要素の**親要素**に適用する点だと思う。

`display: flex;`
この1行を親要素に適用するだけでいい。

Flexbox は justify-content と併用することで、隙間などを調節することができる。
`justify-content: space-between;`
上のコードは両端が左右により等間隔で設置することができる。

他にも調べたら色々プロパティが、あるけどここでは省略！

##後書き
要素を横に並べるというのは簡単そうに見えて
結構難しく、色々なやり方があると学べた。（~~もうちょっとマシな感想ないのかな？~~）
Quitaで投稿するのは、アウトプットの練習も兼ねてるので
個人的に詰まったところがあったら、その都度記事にしていきたい！
4² + 6² + 8² + ... + 18² + 20² + 22² = 2020 になるというネタを検算するパクり記事

[7²+8²+9²+...17²+18²=2018(年)になるというネタがホントかどうかChromeで検算する](https://qiita.com/m_mitsuhide/items/c66a392fb275d2e8b7af)
というネタから派生した
[【再帰関数に挑戦】超短いワンライナーの計算結果が2018になる過程を読み解く](https://qiita.com/m_mitsuhide/items/e098a55fe33a8501f4bd)
という記事を興味深く読ませていただいたあとで、「もしかしたら2020年にもなんかそういうのあるのかな」とWikipediaを見てみたら、ありました

4² + 6² + 8² + ... + 18² + 20² + 22² = 2020
[2020](https://ja.wikipedia.org/wiki/2020)

ワンライナーの再帰処理にぴったりだったので、ちょいと書き換えて試してみます

```javascript
console.log((f=x=>x>3?x**2+f(x-2):0)(22))
```
![result_2020.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/130402/56eea8c7-316c-99a5-9e1a-7a5de9fd7706.png)

おおおお
思った以上に便利でびっくり
JavaScriptをすこーし勉強してみたので書き留める

最低限の知識一応あるけど、復習も兼ねて書いてみることにするの巻。

# use strict
ざっくり言うと、**モダンなモード**にする

- スクリプトの先頭に記載する
- 記載されている場合、最新の方法で動作する
- 宣言以前にコードを記載するとstrict modeにはならない
    - コメントを記載することは可能である
- 関数の先頭に書くことが可能である
    - その場合、その関数にのみ動作する
    - 通常はsprict全体に使用する

```
"use strict";

// このコードはモダンな方法で動作します。
...
```

# 変数

- 情報を保存するために使用される
- データのための “名前付けされた格納場所”

JavaScriptで変数宣言する際は`let`キーワードを使用する

```ruby:宣言
let {変数名};
```

```ruby:代入
{変数名}  = 'Hello';
```

```ruby:初期化
let {変数名} = 'Hello';
```


`var`キーワードも存在する

- ちょっと古い
- 違いはまだ考えないでおこう
- とりあえず`let`でOK

### 変数のネーミング
**2つの制限がある**
1. 名前は文字、数字、記号 `$` と `_` のみを含む必要がある
2. 最初の文字は数字であってはいけない

- 複数の単語が含まれる場合はキャメルケースにするのが一般的


# 定数

- 一度宣言した定数は変更不可能
    - 変更しようとするとエラーが発生する

定数宣言の際には`let`ではなく`const`を使用する

```
const myBirthday = '18.04.1982';

myBirthday = '01.01.2001'; // エラー, 定数の再代入はできません!
```

### 大文字の定数（ここはニュアンスで書いてるから多分調べ足りない。嘘書いてあると思う。そのうち修正。）
実行する前に分かっているが、覚えるのが難しいという値に対しては、エイリアスとして定数を使うという慣習は広く行われている。
このような定数は大文字とアンダースコアを使って名前がつけられる。

通常の定数との違い

- 通常の定数
    - 代入後は変更したくない
    - 実行時に値が決まっていない
        - 実行後に初めてわかる
    - 代入される値は動的
- 大文字の定数
    - 代入後は変更したくない
    - 実行時に値が決まっている
        - コードにベタがき
        - 定数にした方が使用しやすい！とかの時に使う
    - 代入される値は静的。（初期化時にわかっている）

# データ型
JavaScriptは"動的型付言語"
JavaScriptには7つの型が存在する

- 数値型
    - 整数
    - 浮動小数点
    - Infinity(無限大∞)
    - NaN
        - 計算エラーを表す
        - 未定義の数値操作の結果を表す
- 文字列
    - 引用符
        - シングルクォート
        - ダブルクォート
            - JavaScript上では違いはない
        - バッククォート
            - 拡張機能を使用するために使う
            - 文字列内で変数を使用することができるようになる


```
let name = "John";

// 変数が埋め込まれた場合
alert( `Hello, ${name}!` ); // Hello, John!

// 式が埋め込まれた場合
alert( `the result is ${1 + 2}` ); // 結果は 3
```

- 論理型
- null
    - 無し
    - 空
    - 不明な値
- undefined
    - 値は代入されていない
- Object型
    - データのコレクションやより複雑なエンティティを格納する
- Symbol型
    - オブジェクトの一意な識別子を作る

おまけ

- typeof操作
    - 引数の型を返す

```
typeof undefined // "undefined"

typeof 0 // "number"

typeof true // "boolean"

typeof "foo" // "string"

typeof Symbol("id") // "symbol"

typeof Math // "object"  (1)

typeof null // "object"  (2)

typeof alert // "function"  (3)
```




----------
これだけしか書いてないのにくそほど疲れた...
アウトプットて大変なぁ....
今日はいったんおわりまる！
備忘録　railsの継承関係をちょっとだけ理解できた

初めてrailsを触った時、
クラス・モジュールの継承知識がないまま以下の文を見たので
『なんでApplicationクラスがApplicationクラスを継承してんだよ』
と頭の中が？でいっぱいになった思い出があります。


``` config/application.rb
module Hoge
  class Application < Rails::Application
  #省略
  end
end
```

ちょっとは理解が深まったので改めて継承関係を確認してみることに


```ruby
$ rails console
```

Applicationクラスの親クラスを表示(継承関係は見えているが一応、、、)

```
irb(main):001:0> Application.superclass
Traceback (most recent call last):
        1: from (irb):1
NameError (uninitialized constant Application)
```
ん、なんでだ？Applicationクラスじゃないのか？
と思ったがコードを見るとHogeモジュールに属しているじゃないか。
モジュール配下にあるクラスは
モジュール名::クラス名
で取得できます。

```
irb(main):003:0> Taskleaf::Application.superclass
=> Rails::Application
```
そりゃそうですよね。

Hogeモジュール配下のApplicationクラスは
Railsモジュール配下のApplicationクラスを継承していたんですね。

同じApplicationという名前のクラスだが、
モジュールで名前空間を作ることで区別できているんです。


Rails::Applicationクラスの親クラスはどうなっているんだろう？
ancestorsメソッドでみてみましょう。

```
irb(main):004:0> Rails::Application.ancestors
=> [Rails::Application, Rails::Engine, Rails::Railtie, Rails::Initializable, ActiveSupport::ToJsonW
ithActiveSupportEncoder, Object, PP::ObjectMixin, JSON::Ext::Generator::GeneratorMethods::Object, A
ctiveSupport::Tryable, ActiveSupport::Dependencies::Loadable, Kernel, BasicObject]
```

なんじゃこりゃ、みたことないモジュールやクラスがいっぱい、、、
今度調べてまとめるかな。
【Ruby】はじめてのスキルチェック：標準入力のやさしい解釈

## 何をしてよいかわからない人を救いたい
四則演算や条件分岐、ループ処理は勉強したものの、[Paiza](https://paiza.jp/)のようなスキルチェックで入力された値をどう取得してどう使うのかがわからない。これは、もはや問題を解くという次元ではない！！
わたしも同じ気持ちでした。もしかして、わたしだけなんですか？ 何はともあれ、まとめておきます。戒め。

## 基本的な評価方法
**① 入力 → ② なんらかの処理 → ③ 出力**

上記でいう「② なんらかの処理」だけを書けばOKというものもありますが、特にPaizaのように、この一連の流れをコードで記述することが求められるものもあります。
しばしば問題文と一緒に「入力される値の例」と「期待される出力の例」が書いてあります。そして、これをヒントにコードを考えていきます。入力された値が取得できているか（できなかったのが筆者である）、意図した通りの処理になっているか、期待した結果が出力されているか、このいずれもを満たしていないとコードとして成り立ちません。

## おさえておきたいメソッド 
### getsメソッド
入力した値を文字列として受け取るメソッドです。

```Ruby
input = gets
```

上の場合、変数（ここではinput）に、入力された値を代入する、という意味です。
コードを実行したときに入力待ちになる行、ですね。
自分がgetsを記載したところで、問題文にあるような「入力される値の例」が入ってくるものと考えましょう。
#### ＊複数行の入力を取得するシンプルな方法
下記のように、入力される行の数だけgetsを書いても取得できます。まずはこの方法を知っておくのもアリだと思います。

```Ruby
input1 = gets
input2 = gets
```
### chompメソッド
改行を無視するメソッドです。

```Ruby
input = gets.chomp
```
#### ＊入力される値の"見えない改行"に注意する
getsで取得した値は、実は"見えない改行"が含まれている！ ということに注意してください。

`chomp`なしで次の値が入力されたとき

```
Apple
```

実は

```
Apple
（← 改行も含む）
```

という値になっています。

何が困るか？ たとえば、文字列が一致しているかどうかによって条件分岐をさせたいときに困ります。

```Ruby
input = gets.to_s

if input == "Apple"
　# ここに一致するときの処理 
else
  # ここに一致しないときの処理
end
```

１行目で入力された値「Apple」が変数inputに代入されたとします。しかし、`chomp`がついていないので実際に代入されている値は、後ろに見えない改行を含む「Apple」です。
そうすると、いざif文を使ってinputと「Apple」という文字列が一致するかどうかを調べよう！ としても、"見えない改行"のせいで一致していない判定になってしまいます。これでは意図しない処理に流れてしまいますね。これを乗り越えるために`chomp`もおさえておきたいです。
### to_iメソッド
Integerのi。数値型として扱いたい時につけるメソッドです。
たとえ数字が入力されていても、文字列と認識されていると計算できないので注意です。

```Ruby
input = gets.to_i
```
### to_sメソッド
Stringのs。文字列として扱いたい時につけるメソッドです。
getsメソッドは文字列として返すのがデフォルトなので`to_s`をつけなくても同じ意味になるのですが`to_i`とセットで覚えておくとよいでしょう。

```ruby
input = gets.to_s
# input = gets と同じ意味
```
### splitメソッド
文字列を一定の規則で区切るメソッドです。

```Ruby
# 例１
input1, input2 = gets.split(" ")

# 例２
array = gets.split(" ")
```

たとえば、下記のように入力される値は半角スペース区切りで与えられますよ、というときがあります。

```
Tokyo Osaka
```

splitメソッドがあれば謎の半角スペース区切りも乗り越えられます。splitの後ろの丸かっこで区切り文字（ここでは半角スペース）を指定してあげることで、これを区切りとみなして、それぞれ変数に代入（例１）したり配列（例２）にしたりすることができます。なお、splitメソッドは空文字列で分割されるのがデフォルトのため、この例の場合`(" ")`は省略しても大丈夫です。
具体的には、それぞれ下記のような形になります。

```ruby
# 例１のとき
input1 = Tokyo
input2 = Osaka

# 例２のとき
array = ["Tokyo", "Osaka"]
```
### mapメソッド
配列の数だけ処理を繰り返すメソッドです。

```ruby
input1, input2 = gets.chomp.split(" ").map(&:to_i)
```

上の場合は、input1・input2の両方に対してto_iメソッドを使って数値型に変換しますよ、という意味です。

# さいごに
入力に関するメソッドは使う機会が少なく、ここがネックでスキルチェックをはじめられなかった経験があり、記事にまとめて見ました。はじめられさえすれば、あとはこの延長上にある、と信じて。
なにを読んでもよくわからなくて、どこから手をつけて良いかわからない…となったわたしのような難民は、もしかして、この世に存在しないのかもしれないなと思いつつ。迷っている誰かがいたら届けばうれしいです。ここまで読んでいただき、ありがとうございました。
今更だけどTDD導入（成功編）

# 前回の話

>今更だけどTDD導入（失敗編）
https://qiita.com/ilohas20983/items/b1ca1edbb2ad600a2b9c

# いろいろ調べて考えたこと

### Q1.　馴染ませるために必要なことって？

TDDをプロジェクトに馴染ませるために必要なことをまじめに考えてみた。

まず、馴染ませるためには**工数が見える**ことが最低条件。でないと誰も作業の承認なんてしない。
工数が見えるためには、**A1.　基準と手順**が必要になるけど、
手順化が必要なレベルの作業をプロジェクトに新しく馴染ませようとすると**すぐ廃れる**。
なら、**A1.　自動化**するしかない。

### Q2.　何を自動化すればいいのか？

すぐ思いついたのは、エラーになっているテストがどれかをわかるようにすること。

つまり、**A2.　テスト実行の自動化とテスト結果の自動出力**をすること。
`gitlab-ci`を利用したテストの自動化や、`gradle`のプラグインでテスト結果の自動出力はすぐ実現できた。

**見えるようにできた**では見に行ってもらうという作業が発生するため、まだ足りない。
`gitlab-ci`のパイプライン結果＝自動テスト結果となるようにして、
merge request承認時に**A2.　必ず目につくようにした。**

### Q3.　どこまで自動テストにするのか？

まずは、Mockなどを利用した**A3.　ModelのUnitTestのみ**とするべきだと思う。
IntegrationTestやE2eTestもまとめて導入すると導入効果の計測や本来あるべき姿から離れて実装してしまう恐れがある。
UnitTestに絞るのであれば、指標もコードカバレッジで十分。

# 結果

上に記載してある**仕組み**をすべて整えたうえで、前回作成した**中身**を組み合わせて利用した。
かなり評判は良く、半年以上たつけどメンテナンス不足には陥っていない。
そろそろIntegrationTestやE2eTestを導入してもうまく行きそうかな、といった状態に感じる。
それぞれ何のツールをどのように使っているかの細かい話もかけるといいなと思います。
ITパスポート復習

### テクノロジー系
**基礎理論とアルゴリズム**
2進数：値が2になるときに桁が上がる表記法
10進数：値が10になるときに桁が上がる表記法
16進数：値が16になるときに桁が上がる表記法、10〜15までの値はA〜Fで表記
`2進数を10進数に変換する問題が出る`捨てるのもあり
ベン図：集合の関係を視覚的に表した図
[積集合：和集合の説明](https://mathwords.net/wasyugou)
`論理演算の計算問題`
スタックとキューの説明
![alt](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F182963%2F5d3e8cc3-bd54-66f8-d33f-93ce2f2fe84f.png?ixlib=rb-1.2.2&auto=format&gif-q=60&q=75&s=309d95a4707327b71512d8f3fb4a2776)
アルゴリズム：問題を解決するときの手順（手続き）
トレース表を覚える、アルゴリズムの問題が解答できるようになる
XML：タグを自分で定義できる

**コンピューターシステム**
シンクライアント：クライアント側にデータが残らない（保存されない）
サーバーの仮想化：1台のコンピューター上で仮想的に複数のサーバーを動作させる
デュプレックスシステム：メインで動作するCPと故障に備えて待機してるCP2つからなるシステム構成
デュアルシステム：2つのCPが同時に処理を行い、結果を照合して正しいことを確認するシステム構成
ストライピング(RAID 0)：複数のハードディスクにデータを分散させて書き込む記憶方式
ミラーリング(RAID 1)：複数のハードディスクに同じデータを書き込む記憶方式
ベンチマークテスト：システムの性能を比較する為のテスト
稼働率：計算方法：MTBF ÷ (MTBF + MTTR)
[直列、並列、複合システムの稼働率計算方法](https://www.seplus.jp/dokushuzemi/fe/fenavi/easy_calc/availability/)

**ハードウェア**
`CPU：処理能力の計算問題`
マルチコアプロセッサ：各コアが別々の処理を行う
SSD：可動部品がない為、振動や衝撃に強い。消費電力が少ない
`キャッシュメモリ`：超高速の記憶装置。CPUと主記憶装置の処理速度の差を埋める
RAM：揮発性メモリ
ROM：不揮発性メモリ
DRAM：主記憶装置（メインメモリ）に使われる
SRAM：キャッシュメモリに使われる
SSD、USBメモリ、SDカードの中身はフラッシュメモリ
ディスプレイ：赤(Red)緑(Green)青(Blue)、光の三原色(RGB)
プリンタやスキャナにおける解像度：単位dpi
ディスプレイの解像度はdpiではない