OmniAICreator/Qiita-1.07M huggingface dataset:
OracleBronze　勉強記事18

#はじめに
最初の記事のはじめにを参照
https://qiita.com/miyanoShiho/items/ef6dd74478ee2c6a4fea
#今日間違えた問題の復習
##日付の計算
・+,-は数字しか計算できない。
・「fx」は完全指定、暗黙的変換できない。
##10 ROWS FETCH FIRST 10
・10行分スキップし、11番目から10行目取得
##BETWEEN
・BETWEEN A AND B == 列名　>= A AND 列名　<= B
##表の設計
・第三正規形
　主キー以外
　・第二正規形
　　すべての主キー
　　・第一正規形
　　　主キーだけ
##デリミタ
・qは引数→直前の列名が代入される。
##NULLの立ち位置
・ORDER BY で、NULL値はデフォルトで最大値
・NULLS FIRSTはNULLが上にくる
OracleBronze　勉強記事17

#はじめに
最初の記事のはじめにを参照
https://qiita.com/miyanoShiho/items/ef6dd74478ee2c6a4fea
#今日間違えた問題の復習
##ORDER BY
・計算式で指定できる
　→DESCも使用できる。
##TO_DATE 'RR'の指定
現在から近い西暦を指定
現在：2010
RRの引数：95
結果:1995
差が少ない年号が優先される。
2010-2095 = 80
2010-1995 = 15
##日付の計算
日付-日付　○
日付+日付　✖️
Web API入門#6 〜CRUDとHTTPメソッド〜

## はじめに

タイトルについて記事にしました。
この記事で得る内容は以下の通りです。

・ CRUD、主要なHTTPメソッド、べき等性と安全性、メソッドの誤用

■ Web API入門についての過去記事
・ [Web API入門#1 〜APIとWeb API、Webの概要〜](https://qiita.com/s79ns/items/8dd2f06145cbf9464b99)
・ [Web API入門#2 〜REST、アーキテクチャについて〜](https://qiita.com/s79ns/items/bd8b1f50c34ada016196)
・ [Web API入門#3 〜URIの基礎知識〜](https://qiita.com/s79ns/items/c4ec2db048fa3b13638e)
・ [Web API入門#4 〜クールなURIの設計方法について〜](https://qiita.com/s79ns/items/e2f3b6f66059c2917206)
・ [Web API入門#5 〜HTTPの基礎〜](https://qiita.com/s79ns/items/31a6f6affdd28bb8b026)

## CRUD

Create,Read,Update,Deleteの4つの単語の頭文字をとったもので、データの作成・読み込み・更新・削除する機能のことをCRUDと呼びます。
基本的にWebサービスは、CRUDの機能があります。（どれか1つでも欠けるとサービスとして不安定...）
HTTPメソッドの理解を深めると、Webサービスの基本であるCRUDの機能を実装できるようになります。

## 主要なHTTPメソッド

HTTPメソッドは8つありますが、主要なメソッドは表の6つで、更にその中でよく使われるのが上の4つです。

| メソッド   | CRUD | 役割 |
|:--------|:----:|:---:|
| GET     | Read | リソースの取得 |
| POST    | Create | 子リソースの作成、リソースへのデータの追加...etc |
| PUT     | Create /<br>Update | リソースの更新（存在していなければ作成） |
| DELETE  | Delete | リソースの削除 |
| HEAD    | - | リソースのヘッダ（メタデータ）の取得 |
| OPTIONS | - | リソースがサポートしているメソッドの取得 |

各メソッドの中でも特徴的な3つをご紹介します。

**POSTメソッド**

POSTメソッドは、リソースの作成が主ですが、リソースを更新したり削除することができます。
※ 理由は後述しますが、基本的にPOSTはPOSTの役割に使った方が良いです。

**PUTメソッド**

PUTメソッドの主な役割はリソースの更新ですが、リソースが存在していなければ新規作成をします。
CRUDの中でも、CreateとUpdateの機能を兼ね備えるのが特徴的です。

**OPTIONSメソッド**

OPTIONSメソッドは、例えば、特定のリソースに対してGETメソッドのみ実行できる場合は、OPTIONSメソッドを実行すると、GETメソッドとOPTIONSメソッドを使うことができます。
従って、GET/POST/PUT/DELETEメソッドの4つを許容しているリソースであれば、OPTIONメソッドを実行すると、許容している4つのメソッドがOPTIONSメソッドのレスポンスに返ってきます。

## べき等性と安全性

#### べき等性

べき等性とは、ある操作を何回行っても結果は同じという意味です。
例えば、GETメソッドはリソースの取得をするので何回行っても結果は同じですが、POSTメソッドは、リソースを作成する度にリソースが増えるので結果が同じではなくなります。

#### 安全性

操作対象のリソースの状態を変化させないことです。
GETメソッドは、リソースの取得を行い、リソースの状態を変化させることはないので安全性といえます。
一方、PUTメソッドを使うことでリソースが更新されるので、こちらは安全性とはいえません。

各メソッドのべき等性と安全性の特徴については、以下の通りです。

| メソッド   | 特徴               |
|:--------|:-----------------:|
| GET     | べき等かつ安全       |
| POST    | べき等でも安全でもない |
| PUT     | べき等だが安全でもない |
| DELETE  | べき等だが安全でもない |
| HEAD    | べき等かつ安全       |
| OPTIONS | べき等かつ安全       |

## メソッドの誤用

メソッドを誤った用途に使うと、べき等性を持ったメソッドであっても意味がなくなってしまったり
安全性が確立できなくなったりしてしまいます。代表的な例をいくつかご紹介します。

#### リソースの取得以外でPOSTメソッドを使う

例えば、明らかに何かリソースを削除する、https&#58;//slamp.slamp.ochicom/v1/posts/deleteのような
動詞が含まれているURIに対してGETメソッドを実行することです。（設計もNGですが）
GETメソッドであるのに、リソースを操作してしまい安全性が失わなわれます。

#### 他のメソッドをPOSTメソッドで代用する

POSTメソッドは本来リソースの作成や追加が役割ですが、他のメソッドが持つ機能も代用できてしまいます。
GETメソッドはべき等であり安全ですが、GETメソッドを使うべき所をPOSTメソッドで代用してしまうと、べき等でも安全でもなくなります。他のPUTメソッドやDELETEメソッドも、べき等ではなくなってしまいます。

#### PUTメソッドで相対的な値を用いる

例えば、元の値に+50加算するといったPUTメソッドがあったとします。
これは、実行する度に処理結果が変わりますので、べき等ではありません。

ですので、PUTメソッドを使うのであれば、相対的でなく、絶対的な値を指定します。
一例ですが、100から150に値を変えるのであれば、+50加算するのでなく、150という値を指定します。

## 次の記事はこちら

[Web API入門#7 〜ステータスコードの意味と活用〜](https://qiita.com/s79ns/items/043a00330e1259673167)
OracleBronze　勉強記事16

#はじめに
最初の記事のはじめにを参照
https://qiita.com/miyanoShiho/items/ef6dd74478ee2c6a4fea
#今日間違えた問題の復習
##外部キーの親キーを削除するには
・ON CASCADE CONSTRAINSのオプションで消す
・外部キー制約を削除する。
　→無効にしても、制約は存在するのでエラーになる
##DROP COLUMN
・外部キーの親キーは削除できない
・表内の別の列がある場合削除できる。
##AVG
・数値に対応したグループ関数のため、日付を指定した場合エラーになる。
 例外：日付 - 日付の結果は数値になるため、エラーにならない。
【Ruby】今日の曜日を表示するプログラムを作りたい！

#はじめに

プログラミングにおける思考力を高めるため、プログラムを書く練習をしています。今回は今日の曜日を出力するプログラムを「date」クラスを用いて記述しました。

#Dateクラス

以下の記述でDateクラスが使用できます。

```ruby:
require "date"
```

Dateクラスを用いて今日の曜日を取得する場合は

```ruby:
Date.today.wday
```

と記述します。wdayは曜日を0(日曜日)~6(土曜日)の整数で取得することができるDateクラスに用意されているメソッドです。

上記を用いて、今日の曜日を文章で出力します。
以下の記述のようにしてみました。

```ruby:
require "date"

day = Date.today.wday
days = ["日","月","火","水","木","金","土"]

puts "今日は#{days[day]}曜日だ"
```

配列daysを定義することで、日曜日(0)~土曜日(6)まで文字列を格納しました。
OracleBronze　勉強記事15

#はじめに
最初の記事のはじめにを参照
https://qiita.com/miyanoShiho/items/ef6dd74478ee2c6a4fea
#今日間違えた問題の復習
##表の登録問題
・NOT NULL制約問題ないか気にする
　→列を省略した場合はNULLにできないのでエラーになる
・列に結果は使えない。
　select〜という一つの表としては使えるが
 列が列挙される中で一つだけ「select〜」というのは使えないという意味
##update問題
・updateで副問い合わせが使われている場合に
　updateのwhereに該当しているかで、表の情報の範囲が決まる
##PK
・前提：重複行の無いの対象列
　→あとでPKを追加できる
・PKはいつも一つ
・制約の順番の正解
 ①DEFAULT
 ②NOT NULL
##制約仕様
・NUMBER
 省略すると　小数点可能(指定した場合、整数)
・CLOB
 4Gバイトの文字(サイズ指定不可)
・VARCHAR2
 4000バイトまで、それ以上はエラー
・主キー 1つ　外部キー　複数可
・UNUSED
 索引も削除できる
##ALTER TABLE
・MODIFY 
 // COLUMNコマンドは不要。CHANGEというコマンドは存在しない。
Dynamics 365のOutlook連携の設定方法

向井です。

今回は**Dynamics 365のOutlook連携の方法**をご紹介します。

前提条件として、適切なライセンス、権限がユーザーに割り当てられていることを確認してください。

#1. 電子メールのアクセス構成
歯車マーク＞詳細設定
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1004488/755975f4-bf47-3ddf-178d-713aa9500234.png)

設定＞電子メールアクセス構成
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1004488/3c4a2c39-fea1-f4bf-d097-38e3912ebc08.png)

メールボックス
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1004488/9f1e2361-b96f-ef62-84fd-de1abd46eb6e.png)

※この先画像では既に設定が完了してます。
必要なユーザーにチェックをつけ、
…＞電子メールの承認
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1004488/223354c7-817c-1090-4746-3ddc5534d142.png)

アクセス構成のテストとメールボックスの有効化
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1004488/9fe62234-9273-b542-a138-d7614db6b81f.png)

画像のように、成功の文字が並べば完了です。

#2. Dynamics 365 App for Outlook
詳細設定画面に戻ります。

設定＞Dynamics 365 App for Outlook
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1004488/b564bcf4-79ba-4813-4484-69d1b29e68d8.png)
下にスクロールし、必要なユーザーにチェックをつけ保存。
※画像では既に追加されています。

ステータスが「Outlookに未追加」から保留中になります。その後しばらくすると（1時間くらい）画像のように「Outlookに追加済み」になります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1004488/b65b92b7-04fd-e152-8e79-c2eb79a4a532.png)

#3. OutlookにDynamicsボタンを設置する
Outlookを開きます。
歯車マーク＞Outlookのすべての設定を表示
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1004488/886aea82-f0d5-5877-0729-7f35cec50c46.png)

メール＞アクションのカスタマイズ
Dynamics 365にチェックして、保存。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1004488/238d3e74-0952-7318-bf38-fee46bd439a5.png)

同様に
予定表＞アクションのカスタマイズ
Dynamics 365にチェックして、保存。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1004488/f77f7848-6bc7-d7a3-d33f-e3307b82dc81.png)


画像のようにDynamicsボタンが表示されます。
メール
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1004488/97515ac6-fa48-1beb-fd2b-8a145f577c7a.png)

予定表
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1004488/ca23eb51-18b7-9d6e-03a4-6cc5e0784071.png)
特定のブランチで修正されたファイル一覧を出す

## 結論

これでOK。

```shell
git diff --name-only <分岐先ブランチ名> `git merge-base <分岐先ブランチ名> <分岐元ブランチ名>`
```

CIツールなどを使っていて、`unknown revision or path not in the working tree.` で怒られる場合は `ブランチ名` を `oringin/ブランチ名`に修正すればいける（場合がある）


## 削除したファイルは表示したくない場合（2021/1/15 14:15追記）

```shell
git diff --name-only --diff-filter=ACMR `git merge-base <分岐先ブランチ名> <分岐元ブランチ名>` <分岐先ブランチ名>
```


## 参考

* https://qiita.com/awakia/items/ed53f4aada688f7f19a9
* https://qiita.com/FumiyaShibusawa/items/acc04055b1c9e03cce8a
manimの作法 その14

#概要

manimの作法、調べてみた。
TextMobject、使ってみた。

#参考にしたページ。

https://qiita.com/maskot1977/items/c01180cc63aa67ac004e

#サンプルコード

```
from manimlib.imports import *

class test(Scene):
	def construct(self):
		for x in range(9):
			for y in range(9):
				A = TextMobject("{} x {} = {}".format(x + 1, y + 1, (x + 1) * (y + 1))).scale(3)
				self.play(ShowCreation(A))
				self.wait()
				self.remove(A)

```

#生成した動画

https://www.youtube.com/watch?v=p_5P6au5kYQ


以上。
git rebase -i を利用してコミットをまとめる

# 作業の前に

万一に失敗したときのため、ローカルにバックアップをとるなどリスクヘッジをしておくと安心です。

# 作業手順: checkout→log→rebase

## まとめる対象のブランチにチェックアウト

~~~
$ git checkout branch_name
~~~

##コミットログから「まとめる対象の一つ前のコミットID」を取得する

~~~
$ git log

* commit ffc5767e557a84faea786a17d1f3d23ac10e330c
| Author: hoge <hoge@example.com>
| Date:   Fri Sep 18 04:08:27 2020 +0000
~~~

## rebaseしてコミットをまとめる
   
~~~
$ git rebase -i ffc5767e557a84faea786a17d1f3d23ac10e330c
~~~
 

# 参考

* ["pull"と"pull --rebase"との違い](https://kray.jp/blog/git-pull-rebase/)  
  →fetch, merge, rebaseが図解つきで説明されているのでわかりやすかったです。

* [rebase -i でコミットをまとめる](https://backlog.com/ja/git-tutorial/stepup/32/)
【VSCode】エディターエリア左側の幅を小さくする

VSCodeで論文を書いていたのだが、エディターエリアの左側の行番号が書いてあるところの余白が煩わしい。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/280435/8d0aa1be-9227-3d6b-076d-73717796549f.png)

実は、この部分は三つの部分から構成されているらしい[1]。左から、ブレークポイントの指定、行番号、コードの折り畳み、となっている。いわれてみれば、という感じ。

日本語で文を書いている分には、どれもそこまで必要ではないので消す。


|項目|設定|
|---|---|
| ブレークポイント |`"editor.glyphMargin": false`|
| 行番号          |`"editor.lineNumbers": "off"`|
| 折り畳み        |`"editor.folding": false`|

上記項目を探して設定すればOK。


![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/280435/1f2b0627-abdb-ad4e-0b80-ddd257befcb3.png)

すっきりした。

# 参考サイト
[[1] Is there a way to make vscode line number field smaller width?](https://stackoverflow.com/questions/44912058/is-there-a-way-to-make-vscode-line-number-field-smaller-width/44920117)
ElixirのProtocolを使ってみたくてActiveSupportっぽいライブラリを作ってる

Railsの世界で有名を馳せるActiveXXX系ライブラリ。
その中でも特にお世話になるのがActiveRecordとActiveSupportだと思います。
Elixirの作者はRailsのコミッターとしても有名な方でElixirの標準モジュールにもActiveSupportで実装されている便利な実装が多分に含まれています。

ただいくつかほしいなと思ったときに無いメソッドがあったのでProtocolの学びを兼ねてライブラリ制作に手を出してみました。

## ほしいときに無いやつ

個人的にRails書いてて(よく)使うメソッドいくつか

- `#compact`
- `#blank?`
- `#pluck`
- `#include?`

とかとか。
この内compactとblank?は実装されてないことが分っており、compactは過去にElixirのメーリングリストで議論されたことはあるもののEnum.rejectで十分でしょってことで却下されているということも分った。
他にblank?については[Blankable](https://github.com/samsondav/blankable)というライブラリが存在しガッツリ実装されている。

逆に `each_slice`とか(これはRuby標準だけど)はElixir標準モジュールにしっかり実装されており、Rubyのメソッド名と == ではないが調べるごとにElixirの標準モジュールの手厚さを実感するばかりである。

## blankable見たんだけど

先のblankableの実装は実に興味深いもので [このへんとか](https://github.com/samsondav/blankable/blob/master/lib/blankable.ex)見ると `defprotocol`を使って実装されていたりする。

ほしいときに無いやつも多いし、hex.pmで調べたらActiveSupport系の実装は多いけど最終更新が4年前とかなのでせっかくなので自前で実装してみることにした。

## 作ってるやつ

だいたいまだ実装途上なんですが[gr8distance/etna](https://github.com/gr8distance/etna)でヒソヒソ開発進めています。
開発途中なんでWIPのコミットとか多いですがhex.pmに公開する前にはきちんと整理しておきます...


### 基本的な実装方針

先人(blankable)に倣って基本的には `lib/etna.ex`にプロトコルを定義しています。
protocolの下に `defimpl`していこうかと思ったんですが実装が膨大になることは目に見えていたので `lib/etna/XXX.ex`に書くことにしました。
現時点では lib.exがprotocolを満たした実装になっています(多分もっと処理増えますが...)

テスト側はどうしても分割できなかったので `describe`でモジュールごとに切ってその中に処理を実装しています。

### もしも実装するべきでない処理があったら？

Protocol側には `stringify_keys`というのを定義しているんですがLISTにstringify_keysなんてあったものじゃないのでそういう時はElxir(本家)のEnumの実装を参考に `{:error, __MODULE__}`を返すようにしています。


## 使い方

まだテストでしか使ってないですがこんな感じになる予定です。

```elixir
iex(1)> Etna.sum(["hello", "world", "!!"])
"helloworld!!"
iex(2)> Etna.sum([%{age: 20}, %{age: 30}, %{age: 40}], fn m -> m.age end)
90
iex(3)> Etna.include?([1,2,3], 2)
true
iex(4)> Etna.include?([1,2,3], 7)
false
iex(5)> Etna.compact([1,nil, nil, 5, 6])
[1, 5, 6]
```

気が向いたときに実装進めていきたいと思います。
Raspberry Pi4BのUSB BOOTする方法 最新版(2021-1-15)

Raspberry Pi4BではUSB BOOTができることは皆さんご存知でしょうか？
USB BOOTには様々にはメリットがあるのですが、そのやり方を解説している記事が古くなっていたので新たに筆を執りました。

# やり方
詳しくはここに書かれています=>[公式ページ](https://www.raspberrypi.org/documentation/hardware/raspberrypi/bootmodes/msd.md#:~:text=To%20enable%20USB%20host%20boot,permanent%20and%20cannot%20be%20undone.)
このページ、日本語で検索してもヒットしなかったんですよね...
英語ですがラズパイ4以外のラズパイをUSBブートする方法も書かれていたので一読の価値はあると思います。
ここに書いている内容を要約して解説します。

1. まずRaspberry Pi Imagerで「MiscUtilityImages」オプションを使用してラズパイのEEPROMをアップデートするためのイメージをSDカードに焼きます。。
2. 次にそれをラズパイにさして起動します
3. ディスプレイを接続している場合画面が緑に染まります。そうなれば成功です。
4. これでUSBブートできるようになっています。Raspberry Pi OS標準のSD Card CopierでSDカードをコピーするなり、Imagerで直接焼くなりしてUSBブートのためのディスクを作成しUSB　BOOT できるか確認しましょう
Oracle文法まとめ

####with句
with句を使用することで、副問い合わせに名前をつけることができる。
副問い合わせを複数回利用する場合に、使用する。

[Oracle SQL SELECT7 : WITH句を使ったSELECT文](http://mitene.or.jp/~rnk/TIPS_ORCL_SELECT7.htm)

####Count

Count(1)はCount(*)と同じ
列の一番目ではなくselect 1 from テーブルのレコード数

####ROW_NUMBER() 
順番を出力
ROW_NUMBER() OVER (PARTITION BY column1 ORDER BY column2)

####日付の若いレコードを取得する構文
https://www.risewill.co.jp/blog/archives/3483

```sql:sql
SELECT X FROM A1 WHERE
NOT EXISTS(
SELECT X FROM A2 WHERE A2.id = A1.id
                 AND   A2.DATE>A1.DATE 
)                  
```


####LISTAGG日本語対応

LISTAGG(CONVERT(LAST_NAME, 'UTF8'), '/') 
    WITHIN GROUP (ORDER BY LAST_NAME) AS LAST_NAME_LIST

[【Oracle】LISTAGG関数の暗黙の文字コード変換について]
(https://www.tcmobile.jp/dev_blog/programming/%E3%80%90oracle%E3%80%91listagg%E9%96%A2%E6%95%B0%E3%81%AE%E6%9A%97%E9%BB%99%E3%81%AE%E6%96%87%E5%AD%97%E3%82%B3%E3%83%BC%E3%83%89%E5%A4%89%E6%8F%9B%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A6/)
rubyの正規表現で「^」や「$」を使おうとするとエラーが出る話

# 前提
Rubyのバージョンは6.0.0
railsのバージョンは6.0.3.4
上記の環境でエラーは発生しました。

## エラー内容
The provided regular expression is using multiline anchors (^ or $), which may present a security risk. Did you mean to use \A and \z, or forgot to add the :multiline => true option? (ArgumentError)

どうやら「^」や「$」はセキュリティ上のリスクがあるということでエラーが出ているようです。

## 解決した方法
エラー文にしたがって　^→\A, $→\z　のように変更すると解決しました！

## エラーに関しての詳細
調べてみたところRailsの4.0以降のバージョンでは上記エラーが出るようになったようです。
日々セキュリティが向上しているんですね！

「^」や「$」がリスクがある理由としては
「^」→行頭
「$」→行末
であるため、複数行を渡された時に予期せぬ値の許容が起きてしまうから。

そのため
「/A」→文字列の先頭
「/z]→文字列の末尾
に変更すると各文字列ごとに読み込むため、複数行渡されても大丈夫なので「/A」「/z」を使ってくださいね！
という指示が出てきた、というエラーでした。

ちなみに「:multiline => true」オプションを使えば「^」や「$」も使えるようなので、複数行を渡すことが前提であればこのオプションを使う解決方法の方がいいのかもしれませんね。
【Android】Kotlinでメニュー機能作成

ペットの年齢を人間の年齢に換算するアプリを作成していて、
onOptionsItemSelected部分の機能を忘れそうだったので、
覚書として記載。
なるべくシンプルな内容になるように心掛けて書いてみた。

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/105573/d6bed094-8cb6-edd1-da38-3a1607442a2b.png" width="180">

全ソース：
https://github.com/CoffCookie/pet_age_conversion

素材提供元
ぱくたそ：
https://www.pakutaso.com/


###画面作成

Menuのxmlファイル作成
resディレクトリで右クリックし、New→Android Resource Fileを選択。
File name:pet_select
Resource type: Menu

を選択し、OKをクリックします。

その後は
app/src/main/res/menu/pet_select.xml
app/src/main/res/layout/activity_main.xml

でそれぞれ画面作成を行います。
ソースコードはgithubをご覧ください。

![スクリーンショット 2021-01-14 18.21.40.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/105573/0e2648c4-2525-f78e-cc55-1a88aca9ec60.jpeg)

###処理部分作成

![スクリーンショット 2021-01-15 12.58.36.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/105573/28441eeb-88db-39ad-a0d8-9bca73ecf0c2.png)


app/src/main/res/menu/pet_select.xml
で今回それぞれ、
idを
cat_text
dog_text
と指定した。

onOptionsItemSelectedで、
R.id.cat_text
R.id.dog_text
とそれぞれ指定。

これで、それぞれのメニューで選択出来るようになる。

```MainActivity.kt
//メニュー表示
override fun onCreateOptionsMenu(menu: Menu?):Boolean {
    menuInflater.inflate(R.menu.pet_select,menu)
...
}

//選択した時の処理
override fun onOptionsItemSelected(item: MenuItem): Boolean {
...
    when(item?.itemId){
        R.id.cat_text -> {
          //猫の年齢を計算する処理
        }
        R.id.dog_text -> {
          //犬の年齢を計算する処理
        }
    }
    return super.onOptionsItemSelected(item)
}
```
Xcode 12でUIDatePickerの背景色が変わらなくなってしまった

# 問題のコード
```swift
datePicker.backgroundColor = .orange
if #available(iOS 13.4, *) {
    datePicker.preferredDatePickerStyle = .wheels
}
```

Xcode 12対応をしていてこんなコードを書いたら背景色が変わらなくなってしまったときの調査メモ。

# 調査メモ

```swift
let datePicker = UIDatePicker()

datePicker.backgroundColor = .orange           //=> UIExtendedSRGBColorSpace 1 0.5 0 1
datePicker.preferredDatePickerStyle = .wheels  //=> UIExtendedGrayColorSpace 0 0

datePicker.backgroundColor = .orange           //=> UIExtendedSRGBColorSpace 1 0.5 0 1
datePicker.preferredDatePickerStyle = .inline  //=> (nil)

datePicker.backgroundColor = .orange           //=> UIExtendedSRGBColorSpace 1 0.5 0 1 
datePicker.preferredDatePickerStyle = .compact //=> (nil)
```

スタイルを設定すると背景色が初期化されちゃいますよっと。

# 修正後のコード

```swift
if #available(iOS 13.4, *) {
    datePicker.preferredDatePickerStyle = .wheels
}
datePicker.backgroundColor = .orange
```
docker-compose.ymlで複数コマンドを実行する方法

やりたいこと
-
docker-compose.ymlで下記のコマンドを実行したい

```
composer install --no-interaction
tail -f /dev/null
```

なぜDockerfileへ記載しないのか
-

#### リビルドが増え面倒
composer installはjsonの記載内容によってvendorにインストールされるものが変わる可能性がある
Dockerfileでcomposer installを実行する環境でコンテナ構築を行った場合、jsonを編集したらイメージから作り直しが必要になりとても面倒な為

#### ローカルディレクトリのマウント時に面倒が起こる
また、ローカルのディレクトリをコンテナにマウントさせている場合下記のようになる
イメージ作成→マウント→ローカルにはvendorディレクトリがない→マウント後、イメージ内にあるvendorが無くなる
※これが原因でどハマりした事あり

参考：
https://teratail.com/questions/203319

docker-compose.ymlへのコマンド記載方法（基本）
-

```
command: tail -f /dev/null
```

ちなみに上記コマンドは、普通にdocker-compose up -dしただけではコンテナのビルドのみで起動はされない（正確にはymlに記載の内容が全て実行終了した後コンテナが停止する）為、ymlに記載の内容が終了後も何かコマンドが実行されている状態ならコンテナが停止しない仕様からtail -fといった動作し続けるコマンドを実行することでコンテナが停止することを防いでいる

参考：
https://teratail.com/questions/280776

docker-compose.ymlへのコマンド記載方法（複数）
-

```
    command: >
      sh -c "
      composer install --no-interaction &&
      tail -f /dev/null
      "
```

番外編
-

dockerコンテナに入る時、bashだったりshだったりこの差がよくわかっていなかった為復習

### shは、、
```
man sh
```

するとDASHというものが出てきた

### dashとは、、

Debian Almquist shellの略で、bashよりも高速、らしい。
/bin/shの代替とも記載があったけど、なぜ代替しているのか、等深堀するのに時間がかかりそうなのでまた別の機会で。

https://ja.wikipedia.org/wiki/Debian_Almquist_shell
はじめまして

### 自己紹介

はじめまして。らでっぷです。
外資系メーカーで社内SEやマーケティング職を経て現在は外資系ITコンサル・SIerでエンジニアをしています。
日本技術士会や日本赤十字にも参加しています。
趣味はYouTubeで色んな動画を見たり海外旅行に行くことです。
桃鉄はPS2のUSA派です。
WoT Blitzもたまに顔出してます。

忘れっぽい性格なのでここでは備忘録として色々書いていけたらと思っています。
ActiveSupportのArray#sumは七変化する

Railsエンジニアなら必ずお世話になるActiveSupportはRubyデフォルトの `Array#sum`を拡張する処理が含まれている。
とあるライブラリ開発でActiveSupportの実装を追いかけた時に見つけた `#sum`の挙動をまとめます。

## `[1,2,3].sum`
おそらくは１番標準的な使い方。

```ruby
[5, 15, 10].sum                                                                       
=> 3
```

ちなみにこの使い方はActiveSupportを使わなくても使用できる。
昔はRuby標準の `Array#sum`よりActiveSupportの `Array#sum`のほうが高速に動作したがある時期を持って本家に取り込まれたそうで今はどっちも同じ早さという話


## `['foo', 'bar'].sum`

ActiveSupport無しだとエラーになる↓

```ruby

pry(main)> ['foo', 'bar'].sum
TypeError: String can't be coerced into Integer
from (pry):1:in `+'
```

ところがActiveSupportありだとこうなる

```ruby
pry(main)> ['foo', 'bar'].sum
=> "foobar"
```

唐突に `+`が `Array.join`に化けた。
そうは言ってもRubyで文字列を + すると連結できるのでこの挙動自体が理解できないわけではない。

## `[[1,2,3], [4,5]].sum`

先の例同様にActiveSupport無しだとエラーになる

```ruby
pry(main)> [[1,2,3], [4,5]].sum
TypeError: Array can't be coerced into Integer
from (pry):2:in `+'
```

じゃあActiveSupportありだとどうなるのか？
こうなります

```ruby
pry(main)> [[1,2,3], [4,5]].sum
=> [1, 2, 3, 4, 5]
```

もしかしたら `Array.flatten.sum`と同じ挙動になると予想された人もいたのではないでしょうか？
残念なことに結果は `sum`されません。代わりに `flatten`されます。なんで...？

## おまけ

ArrayじゃなくHashでsumしたらどうなるだろうか？

```ruby
pry(main)> {a: 10, b: 20}.sum
=> [:a, 10, :b, 20]
```

！？！？！？
ソースコードを見てると以下の記述を発見

```ruby
  # We can't use Refinements here because Refinements with Module which will be prepended
  # doesn't work well https://bugs.ruby-lang.org/issues/13446
```

なるほどぉ...
Flask_ex(テンプレートでfor文回して変数の中身変える)

#初めに
- テンプレートでfor文使って変数弄ろうとしたら出来なかった
- 調べたら現バージョンだとただ書くだけじゃ出来ないぽい

#解決
```python:html
#setで変数やらなんやら定義出来る
{%set li = ["a","b","c"] %}
{%set count = 1 %}

{% for i in li %}
 {{ns.count}}回目は{{ns.i}}
 {%set ns.count += 1 %}
{% endfor %}

#1回目はa
#2回目はb
#3回目はc
```

#終わり
- `namespace`ってオブジェクト
- ちょっと癖がありそうなやつなので注意
git init後のデフォルトブランチ名をmainに

# 概要
ローカルリポジトリのデフォルトブランチ名変更

# 目的
`git init` コマンドで空のGitローカルリポジトリを作成する際のデフォルトブランチ名を `master` から `main` に変更したい。

# 環境
- ホストトOS
    - Windows 10
- 仮想化ツール
    - VMware Workstation Player 16.1.0
- ゲストOS
    - CentOS 8
- Git
    - 変更前
        - Git version 2.26.0
        - yum で日本の某ミラーサイトから最新取得
    - 変更後
        - Git version 2.30.0
        - 2021年1月15日現在の最新安定板ソース

# 背景
下記リンクのAWSハンズオンでAWSを実践しようと思い立ち、記載の手順通りに実施しようとした。

https://aws.amazon.com/jp/getting-started/hands-on/host-static-website/

上記の手順ではReactプロジェクトをローカルリポジトリとして初期化し、
リモートリポジトリへpushする手順となっている。

- `git init` 後のデフォルトブランチは `master`。

他方、GitHubは昨年秋頃より新規リポジトリのデフォルトブランチ名を `master` から `main` に変更していた。

https://github.blog/changelog/2020-10-01-the-default-branch-for-newly-created-repositories-is-now-main/

- GitHubリポジトリ新規作成後のデフォルトブランチは `main`。

リモートリポジトリにはない新規ブランチとして `master` をpushしても良かったが、
GitHubの声明を読む感じだと今後はGitのデフォルトブランチは `main` になるのが主流と考えられる。
個人的に `main` を意識づけしたくローカルリポジトリのデフォルトブランチを変更する方法を調査した。

# 過程
- 所要時間 : 2時間
    - 調査 : 1時間30分
    - 実施 : 30分

1. Git version 2.30.0のソースコードをダウンロード
1. `make configure`
1. `./configure`
1. `make prefix=/usr/local all`
1. `make prefix=/usr/local install`
1. ゲストOS再起動 <= インストールに成功しても再起動しないと反映されなかった。常駐サービスの再起動でも反映可能か？
1. `npx create-react-app amplifyapp` <= 適宜作業ディレクトリにて 
1. `git init` <= 6.で作成した `amplifyapp` ディレクトリに移動して実行
1. `git remote add origin git@github.com:{GitHubアカウント}/{新規作成したリモートリポジトリ名}.git`
1. `git add .`
1. `git commit -m "{適宜コミットコメント}"`
1. `git push origin main` <= AWSハンズオンサイトではブランチ名が `master` だったのを `main` に変更

※途中、`Ed25519`方式の鍵ペアを作成してGitHubのSSH秘密鍵に登録した。割愛。

# 結果
問題なくリモートリポジトリの `main` ブランチに反映できた。
CentOS 8 のyumリポジトリでは、Git最新版が2.27系の模様(2020/01/15現在)。
仕方なくGit公式リポジトリから最新ソースを取得してビルドした。
`git config --global init.defaultBranch main` でデフォルトブランチ名を `main` に変更した。
その結果、AWSハンズオンの手順の通りにローカルリポジトリのmainブランチの変更をリモートリポジトリのmainブランチに反映できた。

# 参照 および 引用
- AWS ハンズオン 静的ウェブサイトのホスティング
    - https://aws.amazon.com/jp/getting-started/hands-on/host-static-website/
- The default branch for newly-created repositories is now main
    - https://github.blog/changelog/2020-10-01-the-default-branch-for-newly-created-repositories-is-now-main/
- Gitをソースコードからインストールする
    - https://qiita.com/347lionz/items/a18c5b11df45a7c2e67d
- Change git init default branch name
    - https://superuser.com/questions/1419613/change-git-init-default-branch-name
- Gitリリース
    - https://github.com/git/git/releases

技術情報をご共有頂きましてありがたい限りです。 m(_ _)m
Could not create an instance of Tooling API implementation using the specified Gradle distribution 

# 事象 : Could not determine java version from '11'.
- 環境
    - Windows10 Pro バージョン1909
    - Eclipse IDE for Enterprise Java Developers Version: 2020-09 (4.17.0)

1. Gradleのプロジェクトをインポートして
2. [Preferences] > [Java]でJava11から以下に変更した
    - [Compiler] > [Compier compliance level] > 1.8
    - [Installed JREs] > 1.8
1. [Preferences] > [Gradle] > [Java home] > Java1.8の場所
1. [Project Explorer] > プロジェクトを選択して右クリック > [Gradle] > [Refresh Gradle Project]
1. が、エラーが消えない・・・

```text:Problemsのエラー
Could not create an instance of Tooling API implementation using the specified Gradle distribution 'https://services.gradle.org/distributions/gradle-4.3-bin.zip'.
Could not determine java version from '11'.
```

```properties:gradle-wrapper.properties
...省略...
distributionUrl=https\://services.gradle.org/distributions/gradle-4.3-bin.zip
```

## 原因 : Eclipseの起動用JVMのバージョンがGradleとあっていないから
いろいろ苦戦したことをまとめてみて推測した・・・まさか・・・なぜ起動用JVMが関係あるんだ・・・

|結果|eclipse|eclipse.ini<br/>で指定するVM|[Preferences]の<br/>[Installed JREs]と<br/>[Compier compliance level]|[Preferences]の<br/>[Gradle]の<br/>[Java home]|環境変数の<br/>JAVA_HOME|
|:-:|:-:|:-:|:-:|:-:|:-:|
|x|2020-09|Java11|Java11|未指定|Java11|
|x|2020-09|Java11|Java1.8|Java1.8|Java1.8|
|o|2019-09|未指定|Java1.8|Java1.8|Java1.8|
|x|2019-09|未指定|Java1.8|Java1.8|Java11|
|o|2019-09|Java1.8|Java1.8|Java1.8|Java11|

### 対応 : Eclipseのバージョンを下げてeclipse.iniに-vmを設定する
[Eclipse2020-09は起動用JVMにJava11以降が必要](https://qiita.com/ponsuke0531/items/8391605de69c3bb2e2e3#%E4%BA%8B%E8%B1%A1--version-180_251-of-the-jvm-is-not-suitable-for-this-product-version-111-or-greater-is-required)となるので、Eclipse2019-09に変える

1. Eclipse 2019-09をインストールする
    - ここからダウンロードして使った : https://www.eclipse.org/downloads/packages/release/2019-09/r
1. eclipse.iniの`-vm`にJava8を設定する(JAVA_HOMEをJava8以外にしたとき用)
1. [Preferences]で以下をすべてJava8に設定する
    - [Java] > [Installed JREs]
    - [Java] > [Compier] > [Compier compliance level]
    - [Gradle] > [Java home]
1. 再びプロジェクトをインポートする
ユーザーのPermissionCheckを秒で！

#目的
Androidアプリは、常態として外へのアクセスが制限されているので、何かの機能にアクセスしたいと思った時は、PermissonCheckが必要（日本語で書くと意味合いが違くなりそうで、英語に逃げる）。
そのPermissionCheck(ドヤァ…）のフォーマットを簡単に実装する方法を見つけたので、誰かの役に立つといいなぁというささやかな思いを込めて残しておきます。

#やり方
簡単です。今回は筆者が位置情報取得のために、getFusedLocationProviderClientをインスタンス名fusedLocationClientで実装して、ACCESS_COURSE_LOCATION　や　ACCESS_FINE_LOCATION　の権限許可をユーザーに対して促す必要が出てきました。
![fusedlocation.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/599059/03089f56-715b-1152-3dcc-611bbb5ef258.png)


######赤字になっている箇所にカーソルを合わせて Alt + Shift + Enter
![カーソルを合わせよう！.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/599059/c7284184-f74a-e44e-c729-f1c247f2212f.png)

######以上！！！
![permission完成.pgn.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/599059/3c0734ca-607e-e25b-0b9c-5b1db393b9ee.png)

上に出てきました。中身を必要に応じて最適化すれば良し。

お疲れ様でした。
【Express.js】PUGでサーバーサイドの環境変数を参照する

# はじめに
PUGなどのフロントサイドのファイル内でサーバーサイドの環境変数を参照したい時に使える豆知識です。

# 前提条件

- dotenvがインストールされていること
- 環境変数ファイル（.envなど）で適当な値が宣言されていること

# 実装
Express.jsの`app.localsオブジェクト`を使用します。

`app.localsオブジェクト`は、アプリケーション内のローカル変数である特性を持っており、一度設定されると、`app.localsプロパティの`値は、リクエストの存続期間中のみ有効な`res.localsプロパティ`とは対照的に、アプリケーションの存続期間を通じて存続します。

**簡単にいうと、アプリケーションレベルの環境変数を管理するので、PUGからも参照できるということです。**

詳しくは公式ドキュメントを参照してください。
[https://expressjs.com/en/api.html#app.locals]
(https://expressjs.com/en/api.html#app.locals)

実装はすごく簡単です。
`app.js`内で下記のように宣言します。

```.env
SAMPLE_ENV='This is sample environment'
```

```app.js
const express = require('express');
require('dotenv').config();

const app = express();
app.locals.SAMPLE_ENV = process.env.SAMPLE_ENV;
```

あとはPUGのなかで`SAMPLE_ENV`で呼び出すことができます。

```sample.pug
p 結果 ： #{SAMPLE_ENV}
```

出力結果

```
結果 ： This is sample environment
```
Wordpress 本文の抜粋にタグやショートコードが出力されないように出力

忘れてしまわないように自分用にメモです


```functions.phpに以下を記述

//本文の抜粋にタグやショートコードが出力されないように + 続き文字を「…」に指定
function custom_excerpt($excerpt_length){
  $my_excerpt = get_the_content();
  $my_excerpt = strip_tags($my_excerpt);
  $my_excerpt = strip_shortcodes($my_excerpt);
  $my_excerpt = mb_substr($my_excerpt, 0, $excerpt_length) . '…';
  echo $my_excerpt;
}
```

出力させたいphpファイルには以下を記述

```
<?php custom_excerpt(100); ?>
```

記入例

```archive.php
<?php if ( have_posts() ) : ?>
    
    <ul class="archive-post-area">
      <?php while ( have_posts() ) : the_post(); ?>
         
          <li id="post-<?php the_ID(); ?>" >
          <a href="<?php the_permalink(); ?>">
            <dl>
              <div class="title-area">
              	<?php $cat = get_the_category(); $cat = $cat[0];?>
               <dt class="cat <?php echo $cat->category_nicename; ?>"><?php echo get_cat_name($cat->term_id); ?></dt>
               <dt class="date"><?php echo get_the_date(); ?></dt>                
              </div>
              
              <dt class="title"><?php echo wp_trim_words( get_the_title(), 40, '…' ); ?></dt>
              <dd class="text"><?php custom_excerpt(100); ?></dd>
            </dl>
          </a> 
          </li>
         
      <?php endwhile;?>
          </ul>
        
      <?php else : ?>
        <div class="error">
          <p>お探しの記事は見つかりませんでした。</p>
        </div>
      <?php endif; ?>
```

以下のサイトを参考にさせていただきました。
https://www.tsukimi.net/wordpress_excerpt.html
Redmine / RedMica の二要素認証を強制的に解除する

（対応バージョン: Redmine 4.2 / RedMica 1.2）

認証アプリをインストールした端末を紛失するなどしてワンタイムパスワードを生成できなくなったときに、Redmineがインストールされたサーバにアクセスして強制的に二要素認証を無効化する手順。

なお、個人設定画面で生成したバックアップコードを保管しておけばこの手順は不要。ワンタイムパスワードの代わりにバックアップコードを使ってログインと認証アプリの登録解除を行えばよい。

## ①Railsコンソール起動

Redmineサーバ上でRailsコンソールを起動。

```
cd path/to/redmine
bin/rails c -e production
```

## ②Railsコンソール上で特定ユーザーの二要素認証を解除

Railsコンソール上で二要素認証を解除するためのメソッドを呼び出す。

``` ruby
# 二要素認証を解除したいユーザー（以下の例はログインIDが foo であるユーザー）に
# 対応するオブジェクトを取得
user = User.find_by(login: 'foo')

# 二要素認証解除
require 'redmine/twofa/base'
twofa = Redmine::Twofa::Base.new(user)
twofa.destroy_pairing_without_verify!
```
jQuery（Swiperプラグイン）itemの横幅調整

#jQuery（Swiperプラグイン）itemの横幅調整
![詩が生れて、画が出来る。_とかくに人の世は住みにくい。.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/993438/0347e677-63d0-b12d-3c09-d23cc31a1d72.png)

上記の画像のように、横幅で私はハマりました。
result-itemでmargin-rightを指定しているのですが
画像のように、下記のコードが優先さてしまいます。

```
element.style {
 width:393.333px;
 margin-right:40px;
}
```


ならば、これはどこで記述されているか探してその部分を変更すればよいと考えましたが、
これはプラグインで記述されているので、どうすればいいかわからなくなりました。

しかし、

__横幅の調整は簡単でした。__
Swiper導入する際に、オリジナルのJS(例main.jsなど)にSwiperのメソッドを入れると思います。
そこで調整可能でした。以下、例です。

```
// スワイパー（プラグイン）
 var mySwiper = new Swiper('.swiper-container', {
  navigation: {
    nextEl: '.swiper-button-next',
    prevEl: '.swiper-button-prev',
  },
  loop: true,
  pagination: {
    el: '.swiper-pagination',
    type: 'bullets',
    clickable: true,
  },
  loop: true,
  slidesPerView: 1,
  spaceBetween: 28,
  initialSlide: 1,
  breakpoints: {
    767: {
      slidesPerView: 3,
      spaceBetween: 40, //・・・・・・・・・・・・・・・この部分で横幅調整可能です。
      initialSlide: 1,
    },
    375: {
      slidesPerView: 1.1,
      spaceBetween: 0,
      initialSlide: 1,
    }
  },
});

```

私はここに気づくのに2時間ほどかかりました。。。。
皆さんも気をつけましょう。。


以上です。
ありがとうございました。
【自分用】expected `Product.count` to have changed by -1, but was changed by 0

※CRUD操作の内、destroyアクションにしか言及しません。
request specでdestroyアクションのテストを行っていて、
userに関連づいたproductを削除してもテストコード内でcountが−１されず、０のままになっていて長い間困っていた。web上で探してみてもいい感じの記事が見つからなかったので今後同じようなエラーに悩まされた人がいた場合に備えて私の解決策を残しておく。
これがエラー文

```
expected `Product.count` to have changed by -1, but was changed by 0
```

改善前のソースコード

```
describe 'DELETE #destroy' do
    context 'ログインしているユーザー' do
    🌟🌟let(:product_params) do 
      { product: {
        title: "削除用",
        language: "PHP",
        detail: "ウオウオの実",
        period: "8年",
        user: user
       }
      }
    end
    subject { delete product_path(product_params) }
    it '投稿数が一つ減っている' do
        sign_in_as(user)
        expect { subject }.to change(Product, :count).by(-1)
      end
```

だが、これだと上記のようなエラーが出てしまう。流れの解説としては、まずlet(:product_params)~内で削除するproductの準備をする。
そしてsubject（繰り返しを避けるために共通化しておく）内でproduct_paramsの削除を行い、
expectでProductの数が1つ減っているかの確認をする。

ここからが改善策

```
describe 'DELETE #destroy' do  
    context 'ログインしているユーザー' do
    it '投稿数が一つ減っている' do
       🌟🌟 product_params = user.products.create(title: "削除用",language: 
        "PHP",detail: "ウオウオの実",period: "8年",user: user)
        sign_in_as(user)
        expect{ product_params.destroy }.to change{ Product.count }.by(-1) 
      end
```

最初のコードと違う点は、

```
product_params = user.products.create(title: "削除用",language: 
        "PHP",detail: "ウオウオの実",period: "8年",user: user)
```
ここでproduct_paramsを作成している点だ。最初のコードではproductの情報をcreateしていないのに削除(destroty)していたので、それではcountが０のままなのも今となっては理解ができる。
では、productを作成する書き方として、以下のようなコードはどうだろうか？

```
post products_path, params: product_params
```
理由はよくわからないが、これでは動かなかった。
今後RSpecでControllerのテストの中で削除するためなど、一時的にデータを保存しておきたい場合はpostで送るのではなく,createを使っていこうと思う。
Firebaseにデプロイするまで

#Firebaseの設定
## Firebaseでプロジェクトを立ち上げる
1. ブラウザでFirebaseのコンソール(https://console.firebase.google.com/u/0/?hl=ja) へアクセスし、Googleアカウントでログインする
2. 指定の**プロジェクトを追加**をクリックする
3. アルファベットの適当なプロジェクト名を設定する
4. Googleアナリティクスを有効にして続行する
5. アナリティクスのアカウントを作成してプロジェクトを作成する

## プロジェクトの初期設定を行う
1. プロジェクト画面で、web設定(**</>**ボタン）をクリックする
2. アプリのニックネーム(上のプロジェクト名と同様で良い）を設定して**次へ**をクリックする
3. **Firebase SDKの追加**で、**次へ**をクリックする
4. **Firebase CLIのインストール**で、表示されたコマンド(npm install -g firebase-tools)をPCのコマンドラインで実行する
※過去に実行したことがある場合は不要
5. **Firebase Hosting Deploy**で**次へ**をクリックする

## プロジェクトの設定を行う
1. プロジェクト画面の右上の設定ボタン（左上の歯車ボタン）をクリックする
2. リソースロケーションで、**asia-notheast1**を選択し、**完了**をクリックする
※ここは一度設定すると変更不可のため注意
3. 左の**Cloud Firestore**をクリックする
4. **データベースの作成**をクリックする
5. **本番環境の開始**を選択して続行する
6. **ロケーションの選択**は変更せず**完了**をクリックする

# ターミナルでの設定
## ローカルのディレクトリとFirebaseを紐付ける
1. ローカルPCにアプリを作るディレクトリを作る
2. コマンドラインで作成したディレクトリに移動する
3. コマンドラインで、**firebase login**と入力してEnterする
4. ブラウザ上でGoogleアカウントを選択する画面に移動したら、上でしていたGoogleアカウントを選択して許可をする
5. コマンドラインで、**firebase init**と入力してEnterする
6. firebaseで使用するサービスが表示されるため、矢印キーとスペースキーで下記を選択してEnterする
 - Firestore
 - Functions
 - Hosting
 - Storage
7. 使用するプロジェクトとして、新規プロジェクトor既存のプロジェクトを聞かれるため、既存のプロジェクト **Use an existing project**を選択してEnterする
8. ブラウザのFirebase画面で生成したプロジェクト一覧が表示されるため、上で生成したプロジェクト名を選択してEnterする
9. Firestoreで使用するルール、Firestoreのindexを聞かれるので、デフォルトの設定のまま（何も入力せず）、Enterする
10. 使用する言語として**JavaScript**と**TypeScript**の選択が表示されるため、得意な言語を選択する
11. ESLintを用いるか、依存関係のあるパッケージのインストールを聞かれるため、どちらもデフォルトの設定（ESLintは使用しない、パッケージはインストールする）のままEnterする
12. publicディレクトリを聞かれるため、**build**と入力してEnterする（デフォルトではpublic)
13. SinglePageAppとして設定するかを聞かれるので、**yes**と入力してEnterする（デフォルトではNo）
これでFirebaseとの紐付けは完了

## 必要なパッケージの追加
開発に必要と思われるパッケージをnpmインストールする。
コマンドラインで、下記のコマンドを実行する(XXXXX, YYYYY, ZZZZZに必要なパッケージ名を記入)
`npm install --save XXXXX YYYYY ZZZZZ`

開発におすすめのパッケージ

| パッケージ名 | 内容 |
|:-:|:-:|
|@material-ui/core   |material-uiの基本   |
|@material-ui/icons   |material-uiのアイコン   |
|@material-ui/styles   |material-uiのスタイル   |
|connected-react-router   |Reactルータのパッケージ   |
|firebase   |Firebase   |
|history   |URL遷移の記録   |
|react-redux   |reduxのパッケージ   |
|react-router   |ルーティングのパッケージ   |
|redux   |redux   |
|redux-actions   |reduxのactions   |
|redux-logger |reduxのstateの変化のログ |
|redux-thunk |reduxの非同期処理を待つ |
|reselect| |

上記を実行すると、ディレクトリ内のpackage.jsonに上記が追加される

# デプロイの実行
## デプロイして公開する
1. コマンドライン上で**npm run build**と入力して実行し、ビルドを行う(公開できるようにファイルを変換する)
2. **firebase deploy**を実行する

*firebaseのプランを無料から従量制に変更しておかないと**HTTP ERROR: 400**と表示される
3. コマンドライン上に表示されたURLをコピーしてブラウザで実行すると、生成した画面が生成される
ActiveStorageを導入した時のimageカラムのテストコード

初心者の私がactivestorageを使ったときのテストコードで1時間ほど詰まったのでその備忘録です

まず前提として、必要なactivestorageやfactorybot、specのインストールは済ませているものとします。

済ませていなければ以下のgemをgemfileに記述しbundle installしましょう
その後RSpecのインストールをしましょうrails g rspec:install

```ruby:gemfile
group :development, :test do   

  gem 'rspec-rails'         #この3行を記述、テストをするためのgem
  gem 'factory_bot_rails'   #この3行を記述、テスト用のテンプレートを作成するためのgem
  gem 'pry-rails'           #この3行を記述、bindind.pryを実行するためのgem

  # Call 'byebug' anywhere in the code to stop execution and get a debugger console
  gem 'byebug', platforms: [:mri, :mingw, :x64_mingw]
end
```

```terminal:ターミナル
% bundle install
% rails g rspec:install

```

まずpublicのディレクトリ下にimagesと言うファイルを作成する
そのimagesの中に適当な画像のデータを保存する（今回は<strong>a.png</strong>と言う名前の画像を用意します）

今このような状態
public/images/a.png

a.pngは適当な画像のデータです

次にそのデータを参照したいのでfactoriesディレクトリの中にあるテンプレートの中にimageカラムを作成します今回私は「item」と言うモデルをテストするのでractories/items.rbになります


```ruby:ractories/items.rb(モデル名.rb)
FactoryBot.define do
  factory :item do
    name                 {"名前"}
    price                {500}
    text                 {"テスト"}
    judgement_id         {1}
    category_id          {1}
    prefecture_id        {2}
    day_id               {1}
    status_id            {1}
    
    user    #userとのアソシエーション

    after(:build) do |message|
      message.image.attach(io: File.open('public/images/a.png'), filename: 'a.png')
    end

  end
end
```
<h2>ゆるく解説</h2>

・judgement_idやcategory_idなどの「_id」の項目はactivehashを使って導入したので無視して大丈夫です。

・userと言う記述はuserモデルとのアソシエーションを意味してます、これを記述することでuser_idを入力しなくてすみます。

今回の注目していただきたいのはuserの下にある記述です

```ruby:ractories/items.rb(モデル名.rb)
after(:build) do |message|
      message.image.attach(io: File.open('public/images/a.png'), filename: 'a.png')
    end
```

この記述により実際に存在する写真を参照するようになります。


<h1>ダメな例</h1>

```ruby:ractories/items.rb(モデル名.rb)
FactoryBot.define do
  factory :item do
    name                 {"名前"}
    price                {500}
    text                 {"テスト"}
    judgement_id         {1}
    category_id          {1}
    prefecture_id        {2}
    day_id               {1}
    status_id            {1}
    image                {"a.png"}    #ダメな例です
    
    user
  end
end
```

こうしてしまうと、文字列しか登録できていないため、エラーになりますちなみにエラー内容は以下になります。
エラーを確かめたい場合はbinding.pryを記述して処理を止めましょう！

```terminal:ターミナル
[1] pry(#<RSpec::ExampleGroups::Item>)> @item.valid?
ActiveSupport::MessageVerifier::InvalidSignature:　ActiveSupport::MessageVerifier::InvalidSignature

```

同じエラーに出会した方の参考になれば幸いです。
nonce覚書

# きっかけ
* Bitfinexのnonce smallにハマりまくったので、記録を残す

# 覚書
* nonceとは、リプライ攻撃を避けるためのシーケンシャルな番号
* 通常はepoch時間等を使うが、前回+1とかでも一応OK
* 短い時間に連続で送ると、クライアント側は順番でも、サーバへの到着が逆になってNGになる
* 間違って大きい値を送りOKになると、その後小さい値に戻してもサーバ側で記憶しているとNGになる
* 双方の実装によるが、指数表記でもいける

# 気をつけないといけないこと
* nonce smallが出るたびに*10とかしていった結果、実質APIが使えなくなる。。。

# 気をつけないといけないこと2(2021/01/27追記)
* https通信は基本的に非同期なので、先のリクエスト(nonceが小さい)が相手のサーバに後から到着することもありえる。
* すると、後のリクエスト(nonceが大きい)が先に来た後に処理され、不正なリクエストとなるので、到着までしっかり待たないと、短い時間に連続で処理を出す場合はNGがちらほらでる
超今更FTP停止　on Windows server 2012

セキュリティリスクがあるFTPサービスをwindows server 2012で止めます。
一番簡単な方法としては、サービスを止める方法ですが、サービスの一覧にはFTPはありません。

＜FTPを止める方法＞
1.インターネット　インフォメーション　サービス(IIS) マネージャを開く
2.FTPサイトを選択し、[右クリック]-[FTPサイトの管理]-[停止]でFTPサービスを止める。
3.FTPサイトを選択し、[右クリック]-[FTPサイトの管理]-[詳細設定]を開く
4.(全般)項目を開き、"自動開始"を"False"にすると、FTPサービスの自動起動も止まる。

※windows server 2012をあまり触ったことがないと、なかなか見つけにくかったです。。
VyOS 1.3でwireguardを使う (その1)

# はじめに
Openvpnが便利過ぎて使い続けていたが、マルチプロセスに対応していないのがどうしてもボトルネックになりがちだった。
wireguardも興味があったが

 - DHCPない
 - routeをpushできない
 - ブリッジできない
 - TCP対応してない
 - ログが少ない

などから敬遠していた。
VyOSのバージョン1.3から正式(?)に使えるようになったため、試しに使ってみたら驚くほど簡単で高速で、目からウロコでした。

# 作り方
今回はサーバ側の設定を行う。

VyOS1.3を適当に準備します。1.2以上のstableバージョンは有償なので、下記URLからrolling releaseをダウンロードしても使えます。
https://downloads.vyos.io/?dir=rolling/current/amd64
※amd64しかないですね。。。ラズパイは無理なんかな。。。

さて、vyosにログインしたら基本設定(IP,route,nameserver)を済ませます。

1. キーペアを作成します。

    ```
    # run generate wireguard default-keypair
    ```
    
1. サーバのIPとネットワークを設定します。

    ```
    # set interfaces wireguard wg01 address '10.0.0.1/24'
    ```
1. 待ち受けポートを設定します。※UDPです

    ```
    # set interfaces wireguard wg01 port '12345'
    ```

1. 対向のクライアントに許可するIPを設定します。※対向クライアントを `client001`としています。

    ```
    # set interfaces wireguard wg01 peer client001 allowed-ips '10.0.0.2/32'
    ```
1. keepaliveを設定します。※15秒

    ```
    # set interfaces wireguard wg01 peer client001 persistent-keepalive 15
    ```
1. クライアントのパブリックキーを設定します。※クライアントのキーは未作成なので、適当にいれておきます。後で正確なものを入れます。

    ```
    # set interfaces wireguard wg01 peer client001 pubkey 'nT21OiS/yuqkrnPBSjjNKpXORwuVz9XnaBOWmyRVOl4='
    ```
1. 適用します。

    ```
    # commit
    ```
1. 保存しておきます。

    ```
    # save
    ```

いったんサーバ側の設定は完了です。クライアント側の設定は別途投稿します。
未経験エンジニアが3か月でアプリをリリースした話

##Webアプリをリリースしました
　この度、「coma4」というwebアプリを開発しました。4コマ漫画の配信サイトです。
誰でも投稿することが出来ますので、気軽に作品を投稿してみてください。投稿した作品にいいね、お気に入り、コメントをすることができます。**詳しい概要は、下記リンクよりcoma4のサポートページをご覧ください。**
　差し支えなければ本記事の最後にございますアンケートにご協力願います。

[**https://www.coma4.com/**](https://www.coma4.com/)
↑上記リンクよりアクセスできます(2021年3月追記※2月末で公開を終了しました)

 **トップページ**
投稿がタイムラインで一覧表示され、クリックすると視聴することができます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/503990/5e82d17f-ac26-c863-c4a1-7c9674e6a64c.png)



**投稿画面(coma4 Studio)**
4コマ漫画にBGM、効果音をつけて動画に書き出す編集スタジオです。
![アップロード画面.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/503990/d3a06c97-ec78-0d33-7794-907ef9cce482.png)


###サービス構成
![サービス構成図.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/503990/66f2e8af-f32f-71c1-6687-9c1ef5a2aa15.png)


##制作動機
　近年、SNSなど個人が発信できる場は豊富にある。その陰で、発信しても見てもらえない人が多いのでないかと考えた。そこで、今日、クリエイターになりたいがなれない人を4コマ漫画でクリエイターにすることにした。

##Webアプリを作る前のスキル
・JavaServlet
・C言語でLEGOマインドストームの制御
・Kotlinでandroidアプリ開発
・HTML5 , CSS3
・Python3

##実装
■開発環境
エディタ：VSCode
コード管理：Git , GitHub

■データベース
Postgres , Cloudinary(無料枠)

■音楽素材
魔王魂[**(https://maoudamashii.jokersounds.com/)**](https://maoudamashii.jokersounds.com/)

■想定ブラウザ
Google Chrome , Safari

■対応デバイス
PC , タブレット , スマートフォン

■ライブラリ
フロントエンド：Bootstrap , Axios , toastr , bootbox
バックエンド：gunicorn , whitenoise , openCV , MoviePy　...etc

■リリース
インフラ：Heroku(無料枠)
SSL：Cloudflare(無料枠)
Mail server：Mailgun(無料枠)

###システム構成
![システム構成1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/503990/08889e96-ee81-4c4b-8a44-e625516a47c8.png)






##アンケートのお願い(2021年3月追記※2月末でアンケートを終了しました)
最後に、「coma4」をより良いものとするためアンケートのご協力をお願いします。
[**https://www.coma4.com/**](https://www.coma4.com/) のTopページの下部よりアンケートのご回答を宜しくお願いいたします。
(※1)　アカウント登録をしなくても投稿を見ていただければ、アンケートに回答できます。
(※2)　アンケート回答時間は30秒～3分程度です。また、個人情報の入力は一切なく、匿名での回答となります。
【Mono Depth】複数画像でErrorを検出とClip Loss

<h1>Unsupervised Learning of Monocular Depth Estimation with Bundle Adjustment, Super-Resolution and Clip Loss</h1>

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/482094/9357a2ce-2d44-d872-6c3b-5424e8ebc202.png)

Bundle Adjustment, Super-Resolution and Clip Lossがこの論文の新規性ぽい

<h1>新規性</h1>
<h2>バンドル調整</h2>
photometric loss, geometric lossとlocal smoothness lossを最小化する事をバンドル調整と言ってるぽいですね。普通のTrainingと変わらないから特に気にする必要はなさそう。

唯一の違いは3枚以上の画像でDepthとPoseを推定して、Lossを計算している所。
*ちなみ車の移動量が大きい方がDepthの推定のErrorを計算しやすくなる。イメージはstereo depthのbaselineが伸びる感じ

<h2>Super-Resolution</h2>
だいたいのDepth Mapは1/4とかでDepthを推定してからBilinear Interpolationでoriginalサイズに拡大している。
しかし、これは前景と後景のDepthをinterpolationすると推定の値が間違ってしまう。

だから、Low ResolutionのDepth MapにoriginalサイズのFeature Mapを結合して最終的なDepth Mapを推定する。


<h2>Clip Loss</h2>
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/482094/32ebf441-1c9a-5e5d-e8ca-e022ab4c8d49.png)
siが全体(S)のq(95%)以上のErrorであればErrorを95%のErrorの値でClipする
≒top 5%のerrorであればerrorを無視する

そうする事でErrorが大きすぎるノイズを無視できる。一般的にOcclusionであると推定する。


<h1>結果</h1>
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/482094/620438fa-709a-945d-16b0-6bbd57a86ee5.png)
*w/oはwithout

Clip LossもSuper ResolutionもCross-sequence geometric consistency lossも精度を上げている事が分かる。

<h1>結論</h1>
・cliplossでノイズを無視する事は良さそう
・複数枚の画像でErrorを計算するのも精度はあがりそう。

<h1>参考文献</h1>
Unsupervised Learning of Monocular Depth Estimation with Bundle Adjustment, Super-Resolution and Clip Loss
https://arxiv.org/pdf/1812.03368.pdf
リンク内にある擬似要素の画像をクリック出来るようにする

これで解決:point_up:

擬似要素に
<b>pointer-events: none;</b>
を追加するだけ。

ページングで擬似要素に設定した画像がリンクされておらず、横や縦のサイズを変更しても解決出来ず・・・調べるとpointer-eventsをnoneにするだけで解決しました。


```css:sample.css
.class test::after {
   position: absolute;
   top: 0;
   right: 0;
   content: url(/img/test.svg);
   pointer-events: none;
}
```

参考URL：https://design-soup.com/select-before

pointer-eventsについての説明はこの方が詳しく書かれていました。
https://qiita.com/ksk1015/items/c397181622d4ca6acceb
【JavaScript】ディープマージを自前実装してみた

### 先に実行結果を。

```javascript
// 元データ
const test1 = {
  a: { aa: 1, ab: 2, ac: [31, 32, 33], },
  b: { ba: 4, bb: [51, 52, 53], bc: 6, },
  c: { ca: [71, 72, 73], cb: 8, cc: 9, },
}

// 差分
const test2 = {
  a: { ab: 20, ac: [], },
  b: { ba: 40, bb: [51], },
  c: { ca: [71, 72, 73, 74, 75], cc: '9' },
  d: { da: ['a', 'b', 'c'], db: 'd', dc: 'e', },
}

// マージ結果
deepMerge(test1, test2);
{
  a: { aa: 1, ab: 20, ac: [] },
  b: { ba: 40, bb: [ 51 ], bc: 6 },
  c: { ca: [ 71, 72, 73, 74, 75 ], cb: 8, cc: '9' },
  d: { da: [ 'a', 'b', 'c' ], db: 'd', dc: 'e' }
}
```

### 実装はこんな感じ。

```javascript
// メインの関数
const deepMerge = (base, difference) => {
  const merged = JSON.parse(JSON.stringify(base));
  const diff = JSON.parse(JSON.stringify(difference));
  merger(merged, diff);
  return merged;
}

// これが再帰的に呼び出される
const merger = (merged, diff) => {
  for (const key of Object.keys(diff)) {
    if (!(key in merged)) {
      // パラメータの追加
      merged[key] = diff[key];
      continue;
    }
    if (typeof diff[key] === 'object' && diff[key] !== null) {
      // 配列の場合は要素数を合わせる
      if (Array.isArray(diff[key])) {
        merged[key] = merged[key].slice(0, diff[key].length)
      }
      // オブジェクトの場合は再帰呼び出し
      merger(merged[key], diff[key]);
    } else {
      // パラメータの更新
      merged[key] = diff[key];
    }
  }
}
```

### あとがき
うーん、後から考えてみれば別に作る必要なかったかも。
Dynamics 365 カスタマイズ 表示形式の設定方法

向井です。

今回は**Dynamicsの表示形式を追加する方法**をご紹介します。

#0. 今回のご紹介内容
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1004488/23021185-4537-c1e7-ad85-a533209be4f0.png)


今回は活動エンティティにカレンダーコントロールV2を追加していますが、他も手順は同じです。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1004488/59f3b22f-fd86-37f4-2080-3a495aca8b87.png)

カレンダーコントロールV2はこのような表示形式です。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1004488/3c3d9c20-887d-c6ea-1817-3f0a8a949d9a.png)

#1.設定方法
歯車マーク＞詳細設定
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1004488/10cf3dbb-b162-2dd2-13fd-86d25f1b8b4d.png)

設定＞カスタマイズ
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1004488/01100895-aa46-8858-cc4f-75d945dd8cc9.png)

システムのカスタマイズ
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1004488/da3c039d-1bb3-7661-d4ee-52d0eb6cd3d0.png)

エンティティ＞対象のエンティティ（今回は活動）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1004488/dd31a249-5a1b-4907-bdfe-3531f8ea8218.png)

コントロール
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1004488/258bcdbe-ba30-803a-5c69-0c9c6829ec2e.png)

コントロールの追加（今回はカレンダーコントロールV2）※画像では既に追加されています
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1004488/f692fd17-86e0-6175-1e8b-f1b9f26e891b.png)

初期表示させたいものにチェックして、公開
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1004488/170c4236-d658-c365-c7fc-b6c08ad83af7.png)

#2. おまけ　モバイルアプリについて
Dynamicsアプリをストアからインストールして使うことができます。（写真はアップルストア）
![20210115_020614000_iOS.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1004488/d31f6c0c-c95b-f5b0-c110-c4440e138a4c.png)

先ほどした設定をモバイルからも確認しました。
カレンダーコントロールになっていることが確認できました。
![20210115_020520000_iOS.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1004488/888e6833-2f41-f6fe-f068-1803fee893ee.png)
ReactiveProperty v7.6.1 をリリースしました

リリースしてます。NuGet から入手・更新可能です。

https://www.nuget.org/packages/ReactiveProperty/

## 変更内容

AsyncReactiveCommand クラスに ExecuteAsync メソッドを追加しました。これにより C# のコードからコマンドを実行して処理が完了するのを await で待つことが出来るようになります。(7.6.0)

依存パッケージを最新版に更新しました。以下のパッケージが最新版に更新されています。(7.6.1)

- System.Reactive 4.4.1 -> 5.0.0
- Microsoft.Xaml.Behaviors.Wpf 1.1.19 -> 1.1.31 
- System.ComponentModel.Annotations 4.7.0 -> 5.0.0
TypeORMでなぜかTransformerが2回走る

EntityのColumnのdefault valueを消すと直ることがあるようです。理由は調べてません。

> Does not happen when remove default value of column option.
https://github.com/typeorm/typeorm/issues/5719

## Before

```typescript
  @Column({
    type: 'varchar',
    length: 1024,
    default: '{"days_max": 720}',
    name: 'options',
    transformer: CompanyOptionsTransformer
  })
  options: Options;
```

## After

```typescript
  @Column({
    type: 'varchar',
    length: 1024,
    // default: '{"days_max": 720}', この行を消す
    name: 'options',
    transformer: CompanyOptionsTransformer
  })
  options: Options;
```
[PowerShell]ファイル名一覧を加工して取得する

#サンプル01
現在フォルダ以下のjpgファイル一覧を取得し、
"AAA" + ファイル名の頭4桁の文字列を
List.txtに出力する。

```sample01.ps1
$head = "AAA"
Get-ChildItem *.jpg -Recurse | Select-Object Name | ForEach{$head + $_.Name.Substring(0,4)} | Get-Unique > List.txt
Spring BootプロジェクトにSpring Securityを導入する

## 目次
- REST APIの作成
- Spring Securityの導入
- API実行
- 認可サーバーの設定

## REST APIの作成
[Spring BootのREST APIの作成](https://qiita.com/nayylin/items/1ecb846f09aa98c08925) を参照し、APIを作成する。

## Spring Securityの導入
pom.xmlにて依存関係を追加する。

```
pom.xml

<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-oauth2-resource-server</artifactId>
</dependency>
```

## API実行
- KeycloakDemoApplication.javaを実行し、ブラウザにて、「http://localhost:8080/getObject 」を実行する。

- 実装内容が表示されず、ログイン画面が表示されるようになる。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/602725/12e9b5cc-247a-5bcb-4fa5-654c43bbb290.png)