OmniAICreator/Qiita-1.07M huggingface dataset:
Gitで大文字と小文字両方のファイルが出来た場合の削除方法

Vue初心者で勉強中である私がRailsとVueを組み合わせたtodolistアプリを作成中に
コンポーネントファイルの命名規則がわからず調べると、
ファイルはパスカルケースかケバブケースにするのが推奨されているようなので
何も考えずにすべて小文字で作成していたコンポーネントファイルをパスカルケースに変更しました。
[【Vue】単一ファイルコンポーネントの命名規則まとめ【ファイル名から記法まで】](https://qiita.com/ngron/items/ab2a17ae483c95a2f15e)

するとなぜかGit上では小文字のファイルとパスカルケースに直したファイル両方のファイルが存在していたので小文字のファイルの削除方法を忘備録として記載しおきます。

# Git上で小文字と大文字のファイルを区別する
```
git config core.ignorecase false
```

Gitでこのコードを入力するとGitは小文字と大文字のファイルを区別するようになります。
# Git上に残った小文字のファイルを削除する
```
git rm app/javascript/components/todolist.vue
```
これでGit上から小文字のファイルが削除されたので結果をcommitしておきます。

```
git commit -m "remove todolist.vue"
```

これで終了です。

参考にさせていただいた記事
[Gitで大文字と小文字両方のフォルダができてしまったときにどちらか片方を消す方法](https://qiita.com/inductor/items/6d58afd9f6b741208439)
全プログラミング言語の用語整理

##言語自体の整理

### 1. 動的型付けのプログラミング言語
プログラムでは様々な「型」を扱います。例えば、文字列値と整数値と少数値は異なる型です。この他にも様々な型があり、プログラムにミスがあって異なった型を指定しまう事でエラーを発生させることがあります。

動的型付けのプログラミング言語の場合はプログラムを実行時に型検査を行います。厳格なエラーを対処しなくてもプログラムは動作するので初心者には学びやすい言語が多くなっています。しかしその反面、非常に分かりにくい不具合を作り込んでしまう可能性もあります。

|  言語名  |  F-S  |    |  Initial release  |  起源  |
| ---- | ---- | ---- | ---- | ---- |
|  JavaScript  |  FS  |  HTML と合わせて使用して動きのある WEB ページを開発するために使用  |  1995  |
|  Ruby  |  FS  |  日本人により開発された。可読性を重視した構文  |  1995  |
|  Python  |  FS  |  最近ではAI やデータ解析処理の場面において利用されおり注目度の高い言語  |  1990  |
|  PHP |  S  |  動的な WEB サイトを実装する為の言語であるため、ライブラリを用いなくても WEB アプリケーション向けの処理が実装  |  1995  |

### 2. 静的型付けのプログラミング言語

動的型付けのプログラミング言語の場合、「コンパイル」を行う事でプログラミング時に型チェックを行います。静的型付けのプログラミング言語に比べて型チェックが厳格になっているので実装する処理も多くなります。

静的型付けのプログラミング言語に比べて難易度は高いと言えます。

|  言語名  |  F-S  |    |  Initial release  |  起源  |
| ---- | ---- | ---- | ---- | ---- |
|  C  |  -  |  高速に動作。システムの共通言語として様々なplatformで使用。garbage collection等、最近の機能は実装されてなく習得難易度はとても高い  |  1972  |
|  C++  |  -  |  C を元にオブジェクト指向や例外処理等の概念を取り入れた言語  |  1993-2  |
|  C#  |  -  |  Microsoft が開発した .Net Framework と言うプラットフォーム上で動作させるためのプログラム  |  2000  |
|  Objective-C / Swift  |  -  |  Apple 社の MacOS や iOS 用のアプリケーションを開発するためのプログラム言語  |  1984/2014-6  |
|  SQL  |  -  |  データベースから情報の取得、追加、更新、削除と言った処理を行う為の言語  |  1974  |





# 各言語詳細
### 1. フロントエンド

#### JavaScript

（npmやYarn: パッケージ管理）

```
ーVue　　Initial release: February 2014;
ーーnuxt　VueのFramework　　Initial release: October 26, 2016;
ーーーVuexなどのライブラリ


ーReact　　Initial release: May 29, 2013;
ーーNext　ReactのFramework
ーーーReduxなどのライブラリ
ーーーMaterial UI Reactのcomponents、Vuetifyみたいな感じかな

react native Initial-March 26, 2015

angular Initial release	2.0 / 14 September 2016; 
```


#### Python　　First appeared: 1990
(pip: 　パッケージ管理)

```
ーDjango　Python-web-framework 　　Initial release: July 2005
```

#### Ruby　1995
（gem: 　パッケージ管理）

```
ーーrails　　August 2004;
```



<!--そうかaxiosとかはJSそのもののライブラリやｋら
どっちでも使える、と
gatsbyはReactでのvuetifyみたいな感じ？-->


### 2. サーバーエンド

#### PHP
（composer: 　パッケージ管理）

```
ーLaravel PHPのFramework　　Initial release: June 2011
```

#### JavaScript

```
Node Initial release: May 27, 2009;
Node express November 16, 2010;
```

### 3. その他

#### Rust
（cargo: 　パッケージ管理）

```

```
Asterisk Realtime Database のカラムの順序について



https://www.voip-info.org/asterisk-realtime-sip/

> NOTE: Column order is important!! If you place “ipaddr” before “host” (in the case of dynamic), you will never load the public IP address of your sip device, as it will be overwritten when “host” is encountered.

> カラムの順序が重要。「host」の前に「ipaddr」を配置すると（dynamicの場合）、「host」に遭遇すると上書きされるため、sipデバイスのパブリックIPアドレスをロードすることはありません。

 と書いてあります。古い情報のような気もしますが、カラムの順序を変更し試してみると確かにこのような動作をします。

カラムの順序で動作が変わることが不思議だったため、コードを調べました。

※ カラムの順序を変更した際の動作が、適切な動作かどうかはわかりません


# 前提など

Asterisk Realtime について

* http://voip-info.jp/index.php/Asterisk_Realtime
* https://www.voip-info.org/asterisk-realtime/


以下のバージョンのソースコードを調べました。

* https://github.com/asterisk/asterisk/tree/13.11.0-rc1


# データベースから読みだした host , ipaddr の使用箇所


chan_sip.c , build_peer 関数
データベース、または、設定ファイルに書かれているアカウント情報を構造体にセットしています。

31223行 (同じ関数)
host の値が dynamic だった場合、addr に null をセットしています。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/16480/902dedda-bdee-4041-615a-2a2b022a4d6d.png)


31485行 (同じ関数)
ipaddr の値を addr へセットしています。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/16480/fc8ee8cb-50d5-d6cb-8414-ab2d70baf13c.png)


これらは for 文内に記述されています。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/16480/da4d06f8-0849-35bd-7d62-db104d1f01c3.png)


変数 v の型 ast_variable は連結リスト構造です。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/16480/c327e62e-47a3-5bdf-640f-0f326ee819b9.png)


# 推測

カラムの順にリストの要素が追加されているのでは ?
カラムの順序が ipaddr , host の順だった場合、以下のように処理されます。

1. ipaddr により、addr に ipaddr の値がセットされる
1. host により、addr に null がセットされる


# データベースからの読み出し

データベースから読み出しする箇所を調べてみます。
 

呼び出し階層

realtime_peer 
→ realtime_peer_by_name 
→ ast_load_realtime
→ ast_load_realtime_fields
→ ast_load_realtime_all_fields
→ find_engine 
→ eng->realtime_func (関数ポインタであり、ODBC を使用している場合、realtime_odbc のはず)
→ realtime_odbc


### realtime_odbc 関数

SQL の作成。”SELECT *” によりすべてのカラムの値を取得しています。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/16480/70393dec-d709-738b-c6ab-3edebead1a15.png)


カラム数を取得しています。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/16480/c0bef5ad-ad4f-624d-4b25-5db3f3db9895.png)


カラムの数だけ、以下を実行します。

* カラムの定義を取得
* カラムの値を取得
* リストに追加


このため、リストの要素はカラム順になります。

![image-20201006-044522.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/16480/4c3bef35-8eca-fa92-ebde-050801057f28.png)


# 結論

1. データベースからの値の読み出しは、各値を連結リストへセットする。
1. 連結リストへのセットは、カラムの順で行う。
1. 連結リストの値を構造体へセットする際に、for 文により、要素順に処理する。

カラムの順序が動作に影響します。


# その他

カラムの順序を変更した際の動作が適切な動作かどうかはわかりません。

ただ、ignoreregexpire を true に設定しておけば、build_peer関数の最後の方で登録期限を過ぎているものは ip アドレス含む登録情報を破棄しています。

ので、ここでは (host=dynamic であっても) 破棄しなくてもよいように思いますが、どうなんでしょう。
RxBinding4でよく使うメソッドと注意点

RxBindingのドキュメントが非常に少ないので、よく使うメソッドを書き残します。

JakeWharton/RxBinding
https://github.com/JakeWharton/RxBinding

# Version

```gradle
implementation "com.jakewharton.rxbinding4:rxbinding:4.0.0"
```

# View
## clicks()
viewがタップされたらObservableを流す。

```kotlin
view.clicks().subscribe{}
```

## longClicks()
viewがロングタップされたらObservableを流す。

```kotlin
view.longClicks().subscribe{}
```

## touches()
viewがタップされたらObservableを流す。

```kotlin
view.touches().subscribe{}
```

# RxBindingを使うときの注意点
RxBindingには、以下のような注意書きが書かれている。

>*Warning:* 
The created observable keeps a strong reference to `view`. 
Unsubscribe to free this reference.


つまり、画面を離れるときには、RxBindingに紐づけたViewの参照を切るべきということ。
一方で、issueには以下のように記載されています。
https://github.com/JakeWharton/RxBinding/issues/282

> Treat a subscribed RxView.clicks() (or any Observable from this library for that matter) like you would the View reference itself. If you pass it (or subscribe to it) somewhere outside the lifetime of the View, you've just leaked your entire activity.

> So if you're just subscribing inside your ViewHolder there's no need to unsubscribe just like there'd be no need to unregister a click listener were you doing it manually.

つまり、該当のViewの外でRxBindingを使用するのであればRxの購読を解除する必要がありますが、Viewの内部で使う限りはとくに購読解除する必要はありません。
Amazon S3の結果整合性と読み取り一貫性

#今日の目標

Amazon S3の読み取り一貫性と結果整合性を理解する。

## 読み取り一貫性
AmazonS3の特性を理解するために、読み取り一貫性について理解する必要があります。

読み取り一貫性はデータベースのトランザクション管理を行う際に、トランザクション分離レベルで出てくるキーワードです。
・あるトランザクションがデータを変更中の時、ほかのトランザクションからは変更される前のデータを参照します。
・ほかのトランザクションからは変更前の確定されたデータを参照します。
・あるユーザAが値をUPDATEしたとき、ユーザBがそのデータを参照すると、戻ってくる値はUPDATE前の値となります。
・あるトランザクションで変更した確定前のデータをほかのトランザクションから参照することはできません。

##結果整合性
AmazonS3の特性を理解するために、結果整合性も理解する必要があります。結果整合性は、クラウド環境でのストレージの考え方として最近語られるようになりました。

ひと言でいうならば、「更新はそのうち反映される」です。AmazonS3は分散されたインターネットストレージですので、一つのファイルをアップロードすると順次分散用のコピーが始まります。これにより障害時にファイルが消える確率を最小化することができます。

一方で、複数ユーザが同じファイルをアップロードや更新した場合はどうなるでしょうか。衝突（コンフリクト）しそうですよね。
結果整合性では、最後に更新した処理が終わると、時間経たば必ず全てのストレージに最新情報が反映されます。そのうち反映されるというのはかなり割り切った使い方ですが、常に最新を表示する必要がないデータを扱う用途にはピッタリです。例えば、Twitterのつぶやきはそのうち反映されればいいですよね。

## Amazon S3の動作例 1
あるオブジェクトについて順次操作した場合の動作例です。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/520895/f54b731e-e037-d85f-d31f-d344da5e8c7a.png)

R1 (読み取り 1) と R2 (読み取り 2) の開始前に W1 (書き込み 1) と W2 (書き込み 2) が完了しています。整合性のある読み込みの場合、R1 と R2 の両方が color = ruby を返します。結果整合性のある読み込みの場合、経過時間により、R1 と R2 は color = red または color = ruby を返すことがあります。

##Amazon S3の動作例２

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/520895/4971bc9e-e931-398e-9cfd-6a41ce09aabe.png)

R1 の開始前に、W2 は完了していません。このため、整合性のある読み込みと結果的に整合性のある読み込みのどちらの場合にも、R1 は color = ruby または color = garnet を返す可能性があります。また、経過時間によっては、結果的に整合性のある読み込みが結果を返さないこともあります。

整合性のある読み込みの場合、R2 は color = garnet を返します。結果整合性のある読み込みの場合、経過時間により、R2 は color = ruby または color = garnet を返すことがあります。

## Amazon S3の動作例３

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/520895/f08d4b96-3dc1-50e6-6a2b-401e192481d1.png)


クライアント 2 は Amazon S3 が W1 の成功を返す前に W2 を実行するため、最終的な値の結果は不明です (color = garnet または color = brick)。それ以降の読み込み (整合性のある読み込みまたは結果的に整合性のある読み込み) ではどちらかの値を返す可能性があります。また、経過時間によっては、結果的に整合性のある読み込みが結果を返さないこともあります。

なお、どのような読み書きをしたとしても、アトミック性がありますので、部分的なデータが取れることはありません。

#まとめ

Amazon S3は、パソコンのファイルシステムやデータベースと同じようにロックやトランザクション処理は行われないことをなんとなく感じて頂けたと思います。

AmazonS3は長期保存を目的としたインターネットストレージです。

ありがとうございました！
RailsのJSONレスポンスの表示形式についてまとめました

JOSNレスポンスの表示形式についてよくわかってなくて
はまったので整理しました。

ActiveModelSerializerには、アダプター(JSONの表示形式)を3種類ある。

- :attributes (default)
- :json
- :json_api

attributes：デフォルトで設定されているアダプタ。ルートキーなしでjsonレスポンスを生成する。
json：レスポンスは常にルートキーありでjsonレスポンスを生成する
json_api:JSONAPIという、JSONの仕様を決めている組織が制定している表示形式に沿ったレスポンスが返ってくる

:jsonと:json_apiをデフォルトで使いたい場合には、initializersディレクトリに
別途active_model_serializers.rbというような(名前はなんでもOK)ファイルを作成し、
そこに以下のようにJSONの表示形式を設定する。

```
# config/initializers/active_model_serializers.rb
ActiveModel::Serializer.config.adapter = :json_api
```
実際のレスポンスは以下の感じになります

- attributes

```
[
 {"id"=>69,
  "title"=>"鍋",
  "updated_at"=>"2020-10-20T20:52:09.044Z",
  "user"=>
   {"id"=>3,
    "name"=>"xu6i65h83tbvexx5dld89w39xn4u9",
    "email"=>"3_ahmad@smith-brekke.biz"}
　}
]
```

- json

"articles"がルートキーになります。
ルートキー名はcontroller名を取得しています。

```
{"articles"=>
  [
    {"id"=>72,
     "title"=>"あらそう",
     "updated_at"=>"2020-10-20T20:58:15.458Z",
     "user"=>
      {"id"=>3,
       "name"=>"e8zu6a5m08jlgd3w1ddlxkoa",
       "email"=>"3_ernest_denesik@deckow-gutkowski.com"}
    },
  ]
}
```

- json_api

```
{"data"=>
  [
    {"id"=>"66",
     "type"=>"articles",
     "attributes"=>{"title"=>"ひんきゃく", "updated-at"=>"2020-10-20T20:44:16.765Z"},
    "relationships"=>
     {"user"=>
      {"data"=>
       {"id"=>"3", 
        "type"=>"users"}
       }
      }
     }
  ]
}
```

だんだん構造化されていってる感じですね。
json_apiがJSONの仕様に沿った表示形式ということは
一番汎用化しやすいってことですかね。
環境構築, Buildまで - C# 編-


# C#のコンパイル

プロジェクトファイルやソリューションファイルを作るには
やっぱり Visual Studio があった方が楽なのですけれど。。 
Visual Studio は遅いし重いしあまりインストールしたくないので
以下の方法を使います。

基本的にCLIのみですましたいと考えております。。
（Android studioもCLIのみを使用しています。）

## .NET Frameworkを利用

実行ファイルの場所
パスを通すとよい。
（Windows: システムのプロパティ→環境変数→Payh追加）

```
C:\Windows\Microsoft.NET\Framework64\v4.0.30319\csc.exe
C:\Windows\Microsoft.NET\Framework64\v4.0.30319\MSbuild.exe
```
実際にC#コードをコンパイルしていく。

### 1. csc.exe
直接コードをコンパイルする。

```
csc.exe demo.cs

//dll作製
csc.exe -target:library sub1.cs sub2.cs

//exe作製
csc.exe -reference:sub1.dll main.cs
```

### 2. MSbuild.exe

・プロジェクトファイル（.csproj）
・ソリューションファイル（.sln）
を作れば MSBuild でコンパイルすることもできます。

```
//コンパイル
MSbuild
Dlibを使って顔の輪郭をとる（１）


![SS 192.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/565043/a41cd967-f549-8677-1efa-2e99bf69518d.png) 顔の輪郭とか口の動き抽出するやつを今すぐパッと試したい。

##やること
DlibとPythonを使って、顔の輪郭や口の動きをとるフェイストラッキングを実行します。
PC（ここではMac）のWEBカメラで取得したものに即座に反映、表示します。
この記事は2017年に公開いただいているのQiita記事を今トレースする場合の備忘メモです。


##過去のQiita記事に答えがあるので参考にします

[Qiita記事：dlibの顔ランドマーク認識の結果をリアルタイムにmatplotlibで表示する](https://qiita.com/yu4u/items/04849491524180d03c7b)

基本は上記に沿ってありがたく実行させていただくだけですが、ちょっとだけ変更があります。


##変更箇所

データファイルの参照先URLが変更になっているので、別途DLして実行します。

https://www.kkaneko.jp/dblab/dlib/dlibface.html
こちらを参考に、

http://dlib.net/files/
こちらを開いて、「shape_predictor_68_face_landmarks.dat.bz2」をDLし展開します。

前述のプログラムの中の

```py:python
predictor_path = "hoge" 
```
のhogeのところにさきほどのファイルを絶対パスで指定すれば安心です。

##実行結果

![soseki.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/565043/09690486-3b09-5b99-d958-5bbf64331b35.gif)

PCのカメラにお札を見せているところです。もちろん実写の顔もちゃんととれます。


##次回
もうちょっと早く認識＆表示できてなおかつ勘弁な方法があれば試したいです。
表情判定もやっておきたいです。
PyMuPDFで「exception stack overflow!」

# はじめに
備忘録としてのメモ。
ググっても答えに辿り着けなかったので、念のため残しておく。

# 問題点
[PyMuPDF](https://github.com/pymupdf/PyMuPDF) を使って PDF のコピーをするときに、まれに `exception stack overflow!` が発生することがある。

* コード

```python
new_doc = fitz.open()
new_doc.insertPDF(docsrc=old_doc, from_page=1, to_page=1)
```

* エラー

```bash
mupdf: exception stack overflow!
Traceback (most recent call last):
  File "<stdin>", line 1, in <module>
   ・
   ・
   ・　
  File "/Users/ijufumi/workspaces/python_sample/.venv/lib/python3.6/site-packages/fitz/fitz.py", line 3581, in insertPDF
    val = _fitz.Document_insertPDF(self, docsrc, from_page, to_page, start_at, rotate, links, annots)
RuntimeError: exception stack overflow!
```

# 対応策
`insertPDF`を実行する時に、 `annots=False` を指定する。

* コード（修正後）

```python
new_doc = fitz.open()
new_doc.insertPDF(docsrc=old_doc, from_page=1, to_page=1, annots=False)
```

# 原因
公式ドキュメントでは見つけられなかったけど、いくつかのアノテーションがあるとこの例外が発生する。

# お願い
もし、公式ドキュメントなどで見つけた人がいましたら、コメント頂けると幸いです。
Arm(armhf)のChromebookにVisual Studio Codeをインストールしてハマったメモ

VSCodeにもとうとう公式のArmのバイナリが来ました！！

[公式ニュースリンク](https://code.visualstudio.com/updates/v1_50)

さっそくChromebookにインストールしようとして躓いたのでなんとかしたメモです

## インストール環境

* Chromebook C101PA (armhf:32bit)
* Debian(Crostini) 10.4

lenovo ideapad duetも該当するみたいです（知り合いが記事通りに作業して動作したのを確認済み）

## インストール手順
1. [公式ダウンロードページ](https://code.visualstudio.com/Download)
からdebファイルの<b>arm64</b>版をダウンロード
2. terminalを開いて、`sudo apt update`でパッケージ情報最新化
3. ダウンロードしたファイルをダブルクリック
4. 表示されたダイアログに沿ってインストールする

arm64版をインストールというのが一番大事。  
CPUがarmhfとかの32bit版でもarm64版をダウンロードしてください。

どうやら、CPUがarmhfかarm64に関わらず、Chromebookのdebianがarm64で依存関係解決を行うみたいです。

検証不足ですけど、Crostiniのdebianはarm系であれば、arm64で依存解決するのかな？って感じです

## 検証メモ
1. arm(32bit)をダウンロードした
2. ダブルクリックでインストールしたら途中でエラー
3. linuxのファイル領域にVSCodeのdebファイルを移動
4. 上記ファイルを`sudo apt install ./ファイル名`でインストール
5. エラーログを見ると、`Depends: libnss3:armhf (>= 2:3.26) but it is not installable`というエラーが続く
6. `sudo apt install libnss3`でインストールしてみると、インストール結果に`libnss:arm64`と書かれている
7. なんかおかしいと気がつく
jqGridで指定したセルの値を取得する方法

# jqGridで指定したセルの値を取得する方法

jqGridで指定したセルの値を取得する方法

jqGridで指定したセルの値を取得する方法を備忘録的に記載します。




# 画面イメージ

![Qiita_3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/701538/52589507-42c5-fc70-0e57-c37ee3521f0d.png)

# ソース
```
 1  <!DOCTYPE html>
 2  <html lang="ja">
 3  <head>
 4  <meta charset="utf-8">
 5  <title>jqGridセルの値を取得</title>
 6  <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
 7  <script src="https://code.jquery.com/ui/1.12.0/jquery-ui.min.js"></script>
 8  <script src="https://js.cybozu.com/jqgrid/v5.1.1/js/jquery.jqGrid.min.js"></script>
 9  <script src="https://js.cybozu.com/jqgrid/v5.1.1/js/i18n/grid.locale-ja.js"></script>
 0  <link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
11  <link rel="stylesheet" href="https://js.cybozu.com/jqgrid/v5.1.1/css/ui.jqgrid.css">
12  <script>
13  $(document).ready(function(){
14    //表示データ
15    var dt = [
16       {code:'ZZ001', name:'ＸＸ', price:1300}
17      ,{code:'ZZ002', name:'ＹＹ', price:1400}
18      ,{code:'ZZ003', name:'ＺＺ', price:1500}
19      ,{code:'ZZ004', name:'ＸＹ', price:1250}
20      ,{code:'ZZ005', name:'ＹＺ', price:1850}
21    ];
22  
23    //表示設定
24    $("#grid_table").jqGrid({
25       data: dt
26      ,datatype: 'local'
27      ,colNames: ['コード', '名前', '金額']
28      ,colModel: [
29          {index:'code', name:'code', width:'80px', align:'center'}
30         ,{index:'name', name:'name', width:'150px', align:'left'}
31         ,{index:'price', name:'price', width:'200px', align:'right'}
32       ]
33      ,height: 'auto'
34      ,caption: '商品一覧'
35      ,onSelectRow: function(rowid, status, e){  //行選択後に呼ばれる
36        var data = $("#grid_table").getRowData(rowid);
37        window.confirm('コード:[' + data.code + ']  名前:[' + data.name + ']  金額:[' + data.price +']');
38       }
39    });
40  
41  });
42  </script>
43  </head>
44  <body>
45    <table id="grid_table"></table>
46    <p>※行選択するとダイアログに選択行のデータが表示されます。</p>
47  </body>
48</html>

```

# 解説

36行目のgetRowDataで指定行の値を取得する。
rowid：行数の指定(サンプルでは選択された行を指定)
37行目でダイアログに取得したデータを表示する。
jqGridで指定したセルの値を書き換える方法

# jqGridで指定したセルの値を書き換える方法

jqGridで指定したセルの値を書き換える方法を備忘録的に記載します。

# 画面イメージ

![Qiita_2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/701538/2db29774-8487-f45d-7748-de41c22a10c5.png)

# ソース
```
 1  <!DOCTYPE html>
 2  <html lang="ja">
 3  <head>
 4  <meta charset="utf-8">
 5  <title>jqGridセルの値を変更</title>
 6  <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
 7  <script src="https://code.jquery.com/ui/1.12.0/jquery-ui.min.js"></script>
 8  <script src="https://js.cybozu.com/jqgrid/v5.1.1/js/jquery.jqGrid.min.js"></script>
 9  <script src="https://js.cybozu.com/jqgrid/v5.1.1/js/i18n/grid.locale-ja.js"></script>
 0  <link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
11  <link rel="stylesheet" href="https://js.cybozu.com/jqgrid/v5.1.1/css/ui.jqgrid.css">
12  <script>
13  $(document).ready(function(){
14    //表示データ
15    var dt = [
16       {code:'ZZ001', name:'ＸＸ', price:1300}
17      ,{code:'ZZ002', name:'ＹＹ', price:1400}
18      ,{code:'ZZ003', name:'ＺＺ', price:1500}
19      ,{code:'ZZ004', name:'ＸＹ', price:1250}
20      ,{code:'ZZ005', name:'ＹＺ', price:1850}
21    ];
22  
23    //表示設定
24    $("#grid_table").jqGrid({
25       data: dt
26      ,datatype: 'local'
27      ,colNames: ['コード', '名前', '金額']
28      ,colModel: [
29          {index:'code', name:'code', width:'80px', align:'center'}
30         ,{index:'name', name:'name', width:'150px', align:'left'}
31         ,{index:'price', name:'price', width:'200px', align:'right'}
32       ]
33      ,height: 'auto'
34      ,caption: '商品一覧'
35      ,onSelectRow: function(rowid, status, e){  //行選択後に呼ばれる
36        $("#grid_table").jqGrid('setCell', rowid, "price", "5000");
37       }
38    });
39  
40  });
41  </script>
42  </head>
43  <body>
44    <table id="grid_table"></table>
45    <p>※行選択すると選択行の金額が5000になります。</p>
46  </body>
47  </html>
```

# 解説

36行目のjqGrid('setCell')でセルの値を書き換える。
rowid：行数の指定(サンプルでは選択された行を指定)
price：列の指定(サンプルではprice列を指定)
5000：書き換える値を指定
【備忘録】Qittaへの投稿方法

#初めてのQiita投稿
Qiitaの投稿のテストとして、投稿方法を備忘録として残しておきます。
※2020年10月時点PCでの情報になります

マークダウンの書き方は下記URLを参照しました。
Qiita Markdown 書き方 まとめ
https://qiita.com/shizuma/items/8616bbe3ebe8ab0b6ca1

##流れ
①ログインする。
②右上にある「投稿する」タグをクリック
③「記事」をクリック
![スクリーンショット 2020-10-21 19.03.08.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/810435/2d50fe24-b085-6535-ec89-fc5aeb0fedc6.png)
④記事をかく
⑤右下の「Qiitaに投稿」をクリック
![スクリーンショット 2020-10-21 19.00.51.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/810435/ada40b97-eb1f-7030-c5a8-de48a2535261.png)
以上

私でもできるくらい簡単でした！:relaxed:

※続けて２記事目を投稿しようとしたら、できませんでした。
連続投稿は規制があるようです。
ブロック　インラインの違い

![1051 (Inline Elements).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/613221/941f43e6-8493-20a3-802b-6d596ea4aa73.png)
![widthheight.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/613221/2af6ee7b-b4c1-7a4b-ede4-6a8eb979aa63.png)
![select ().png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/613221/353b1ca6-0b79-4985-daa6-470bdb14c81b.png)
[Unity][自分用メモ]Animation 2D 流れざっくり

■ Universal RP
1. Package Manager → Universal RP をInstall
2. Assets内でCreateする
　　→ Pipeline Asset
　　→ 2D Renderer
3. UniversalRenderPipelineAsset の General に New 2D Renderer Data をセット
4. Project Settings → Graphics → PipelineAsset をセット


■ キャラクターインポート～ボーン設定

1. 作成したpsbファイルをAssets内にコピペ
2. Sprite Editor → Skinning Editorで開く
3. VisibilityをON
4. Create Boneで骨組みを作る
5. Bone改名。（同一部位のBoneにはCategory入力）
5. SpriteごとにAuto Geometry実行
6. Bone Influenceで紐づけを調整
7. Apply!

※ Weightについて要調査


■ 2D IK
[準備]
1. Package Managerを開く
2. Advanced → Show Preview Package
3. 2D IK をInstall

[設定]
1. PlayerにIK Manager 2Dのコンポーネントを追加
2. + → Limb を選択
3. 足首に移動
4. Effector に足先のobjectを設定
5. Create Target!
Golangのinterface型


## interface型
- あらゆる型と互換性のある型
- Objectクラスのようなもの
- あくまで、全ての型の値を汎用的に表すものなので、演算などはできない


```main.go
package main

import (
    "fmt"
)

func main() {
    var x interface{}
    fmt.Printf("%#v", x)
}
```

出力すると、<nil>となる。
int型では0が初期値としてセットされるが、interface型ではnilとなる

```
$ go run main.go 
<nil>
```
【ブルゾン風】WPの投稿記事をhtmlファイルで回してみたくない？

#やりたいこと

WordPressのブログの記事情報を外部サイトにも反映・表示させたい！
だがしかし、、拡張子がhtmlのファイルにそんなことができるの？？

思い悩むこと12時間............
なんとかやり口を見つけ解決まで導き出せました！

今回やりたいことをまとめると
・WordPressの投稿情報を外部サイトでも使いたい
・htmlファイルでphpを使いたい

#環境

【サーバー】　　　Xserver
【サーバー番号】　2001（sv2001）以降

#WordPressの投稿情報を外部サイトでも使う方法

ステップは2つです。
・WP管理外でも機能を使えるようにする
・投稿記事を表示する

###WP管理外でも機能を使えるようにする

下記記述を対象のhtmlファイルの一番上にコピペしましょう。

```php
include($_SERVER['DOCUMENT_ROOT']."/wp/wp-load.php");
```
もしくは

```php
include($_SERVER['DOCUMENT_ROOT']."/wp/wp-blog-header.php");
```

どちらも同じ結果が返るので、どちらでも良いでしょう。
$_SERVER['DOCUMENT_ROOT'] とはルートのことで、それ以下のディレクトリは各々でWPファイルを記述してください。

私は上の記述でうまくいかなかったので、下の記述でやるとうまくいきました！

###投稿記事を表示する

よーーし！
あとは表示だけだーー！！
WPのループを回して情報を表示させよう！

```php
<?php if(have_posts()): while(have_posts()):the_post(); ?>
  
  <p><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></p>
  
  <time datetime="<?php the_time('Y-m-d'); ?>"><?php the_time('Y.m.d'); ?></time>
  
<?php endwhile;endif; ?>
```

これで完成だー！！ってあれれぇぇ........（コナンくんみたいな声が漏れた）
何故だかうまく情報を取得できません。

```php

<?php
  $args = array( 'posts_per_page' => 3, 'order'=> 'DESC', 'orderby' => 'date' );
  $posts = get_posts($args);
    
  foreach ($posts as $post) :
?>
  <p><a href="<?php the_permalink(); ?>"><?php echo $post->post_title; ?></a></p>
  <p><?php echo mysql2date( 'Y/m/d', $post->post_date ) ?></p>
  
<?php endforeach; ?>
```

foreach文を使うとうまくいきました！！


#htmlファイル内でphpを使う方法

.htaccessファイルに記述をしていきます。
サーバーによって記述方法が異なるので様々ですが、
ここでは一般的な記述方法とエックスサーバー利用時の記述方法を掲載しています。

###一般的な記述

```
AddType application/x-httpd-php .php .phtml
AddType application/x-httpd-php .php .phtml .html
```

両方記述しているパターンが多いですが、どちらか１つでも行けると思います。

###エックスサーバーの記述

エックスサーバーの中でも設定方法が2種類あります。
サーバー番号が2001（sv2001）以降の場合

```
AddHandler fcgid-script .html
```
私はこれで動きました。
サーバー番号が1999（sv1999）以前の場合

```
AddHandler x-httpd-php5.6 .php .phps .html
```

エックスサーバーのサーバー番号は、お知らせメールからわかるそうです。
チェックしておきましょう。

以上です！

#参考記事
https://macoblog.com/wp-gaibu-kijiroop/
https://princessvision.com/html_php_work/
https://wp.turbo-w.com/wordpress_news_topics_1.html
Laravel 【初心者】 PHPフレームワーク Laravel入門 第2版 の内容を一部図式化してみた件 ⑭バリデータの利用(条件に応じてルールを追加)

#はじめに
この記事はプログラミングをはじめたばかりの素人が、メモするのに利用しています。
内容には誤りがあるかもしれません。

#PHPフレームワーク Laravel入門 第2版 について
Laravelを独学で学ぶにあたり、評判がよかったのでAmazon Kindleで購入しました。
**内容も色々な方法が書いてあるので、Laravelをはじめて勉強される方にはおすすめの本です。**

Amazon リンク
https://www.amazon.co.jp/gp/product/B08625YD7H/ref=ppx_yo_dt_b_d_asin_image_o09?ie=UTF8&psc=1

#図式化について
学習中に、文字だけだとイメージが掴みづらかったので、自分の為に作成したものです。
また方法が色々あり過ぎて混乱したので、整理する意味もあります。
ディレクトリを覚えるのにも使いました。

コードは必要なものだけ抜粋しているので、全てではありません。
これだけ見ても勉強にはならないので、**PHPフレームワーク Laravel入門 第2版**を是非購入してみて下さい。

※ちなみに著者の方とは何の関係もありません。

素人が作成した物なので、参考程度に使ってください。

#バリデータの利用(条件に応じてルールを追加)

![valir.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/760252/74f6afbb-3b7a-569a-cc8e-ba63d83797a3.jpeg)
nginx + expressをfargate 4coreで動かす

- nginx + expressをfargateに詰め込む
- unix socket を使って繋ぐ
- expressは4プロセス立ち上げる
- node clusterは使わないパターン、socketが競合してしまったので。
- 共通ボリュームにapi1.sock - api4.sockを設定して、nginxからupstreamする

# api

## 共通ボリュームをVolumeにしておく
``` Dockerfile
VOLUME /usr/src/tmp
```

## sockのパスを環境変数で指定させる
```main.js

const sock = process.env.SOCK_PATH;
app.listen(sock, () => {
  fs.chmodSync(sock, '666');
  console.log(`Server running on ${sock} with pid ` + process.pid);
});
  
```

## nginx

api1.sock - api4.sockへupstreamする

```nginx.conf
upstream api {
    server unix:///usr/src/tmp/api_1.sock;
    server unix:///usr/src/tmp/api_2.sock;
    server unix:///usr/src/tmp/api_3.sock;
    server unix:///usr/src/tmp/api_4.sock;
}
server {
    listen       80 default;
    listen  [::]:80;

    location / {
        proxy_pass http://api;       
        break;
    }
}
```


## タスク定義

ECSタスク定義で、繋ぐ

```task-define.json
{
"containerDefinitions": [
  {
    "name": "nginx",
    "portMappings": [
      { "hostPort": 80, "protocol": "tcp", "containerPort": 80 }
    ],
    "mountPoints": [
      {
        "readOnly": true,
        "containerPath": "/usr/src/tmp",
        "sourceVolume": "etc"
      }
    ]
  },
  {
    "name": "api1",
    "mountPoints": [
      { "containerPath": "/usr/src/tmp", "sourceVolume": "etc" }
    ],
    "environment": [
      { "name": "SOCK_PATH", "value": "/usr/src/tmp/api_1.sock" }
    ]
  },
  {
    "name": "api2",
    "mountPoints": [
      { "containerPath": "/usr/src/tmp", "sourceVolume": "etc" }
    ],
    "environment": [
      { "name": "SOCK_PATH", "value": "/usr/src/tmp/api_2.sock" }
    ]
  },
  {
    "name": "api3",
    "mountPoints": [
      { "containerPath": "/usr/src/tmp", "sourceVolume": "etc" }
    ],
    "environment": [
      { "name": "SOCK_PATH", "value": "/usr/src/tmp/api_3.sock" }
    ]
  },
  {
    "name": "api4",
    "mountPoints": [
      { "containerPath": "/usr/src/tmp", "sourceVolume": "etc" }
    ],
    "environment": [
      { "name": "SOCK_PATH", "value": "/usr/src/tmp/api_4.sock" }
    ]
  }
],
"volumes": [{ "name": "etc" }],
}
```
Laravel 【初心者】 PHPフレームワーク Laravel入門 第2版 の内容を一部図式化してみた件 ⑬バリデータの利用(クエリー文字列)

#はじめに
この記事はプログラミングをはじめたばかりの素人が、メモするのに利用しています。
内容には誤りがあるかもしれません。

#PHPフレームワーク Laravel入門 第2版 について
Laravelを独学で学ぶにあたり、評判がよかったのでAmazon Kindleで購入しました。
**内容も色々な方法が書いてあるので、Laravelをはじめて勉強される方にはおすすめの本です。**

Amazon リンク
https://www.amazon.co.jp/gp/product/B08625YD7H/ref=ppx_yo_dt_b_d_asin_image_o09?ie=UTF8&psc=1

#図式化について
学習中に、文字だけだとイメージが掴みづらかったので、自分の為に作成したものです。
また方法が色々あり過ぎて混乱したので、整理する意味もあります。
ディレクトリを覚えるのにも使いました。

コードは必要なものだけ抜粋しているので、全てではありません。
これだけ見ても勉強にはならないので、**PHPフレームワーク Laravel入門 第2版**を是非購入してみて下さい。

※ちなみに著者の方とは何の関係もありません。

素人が作成した物なので、参考程度に使ってください。

#バリデータの利用(クエリー文字列)

![valiq.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/760252/29e334ce-8994-2326-586d-612a749cf7bf.jpeg)
Laravel 【初心者】 PHPフレームワーク Laravel入門 第2版 の内容を一部図式化してみた件 ⑫バリデータの利用

#はじめに
この記事はプログラミングをはじめたばかりの素人が、メモするのに利用しています。
内容には誤りがあるかもしれません。

#PHPフレームワーク Laravel入門 第2版 について
Laravelを独学で学ぶにあたり、評判がよかったのでAmazon Kindleで購入しました。
**内容も色々な方法が書いてあるので、Laravelをはじめて勉強される方にはおすすめの本です。**

Amazon リンク
https://www.amazon.co.jp/gp/product/B08625YD7H/ref=ppx_yo_dt_b_d_asin_image_o09?ie=UTF8&psc=1

#図式化について
学習中に、文字だけだとイメージが掴みづらかったので、自分の為に作成したものです。
また方法が色々あり過ぎて混乱したので、整理する意味もあります。
ディレクトリを覚えるのにも使いました。

コードは必要なものだけ抜粋しているので、全てではありません。
これだけ見ても勉強にはならないので、**PHPフレームワーク Laravel入門 第2版**を是非購入してみて下さい。

※ちなみに著者の方とは何の関係もありません。

素人が作成した物なので、参考程度に使ってください。

#バリデータの利用

![vali.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/760252/a874a5b4-f872-e8c7-97ff-5c48d5547975.jpeg)
CentOS8にCaddyを入れずにdockerでCaddy起動

<a href="https://caddyserver.com/" target="_blank"><a href="https://ebios10.up.seesaa.net/image/2020-10-21_170336.png" target="_blank"><img border="0" alt="2020-10-21_170336.png" src="https://ebios10.up.seesaa.net/image/2020-10-21_170336-thumbnail2.png" width="640" height="345"></a></a>

#Caddyとは
Caddyのサイトに行くとデカデカと、そして堂々とこう書かれている。
<span style="font-size:large;">THE ULTIMATE SERVER</span>
なかなかここまでは断言できないものだ。
Caddyとは初版が2015年4月28日と新しいといえるオープンソースのウェブサーバーだ。 Go言語で記述されており、HTTP機能にはGo標準ライブラリを使用している。また他のウェブサーバーと異なり、HTTPSをデフォルトで使用する。

#CentOS8にCaddyを入れずにCaddy起動する

[前回CentOS8にNginxを入れずにdockerを利用してNginxを起動した](http://www.ebios.club/article/477990521.html "自分のブログに掲載した内容")が、同じことをCaddyでやってみる。
[Qiiaの記事はこっち。](https://qiita.com/ebios/items/837517de4c93c7210c87 "CentOS8にNginxを入れずにdockerでNginx起動")
<a href="https://ebios10.up.seesaa.net/image/2020-10-21_182034.png" target="_blank"><img border="0" alt="2020-10-21_182034.png" src="https://ebios10.up.seesaa.net/image/2020-10-21_182034-thumbnail2.png" width="640" height="94"></a>

#環境
前回確認済みだが改めて環境を。
CentOS Linux release 8.2.2004 (Core)
Docker version 19.03.13, build 4484c46d9d

#CentOS8にCaddyを入れずにdockerでCaddy起動する
docker のコンテナもイメージも無い状態を確認する。
```# docker ps -a```
```# docker images```
<a href="https://ebios10.up.seesaa.net/image/2020-10-21_180219.png" target="_blank"><img border="0" alt="2020-10-21_180219.png" src="https://ebios10.up.seesaa.net/image/2020-10-21_180219-thumbnail2.png" width="640" height="51"></a>
Caddy起動する
```# docker run --name testcaddy -d -p 8081:80 caddy```
```# docker ps -a```
```# docker images```
<a href="https://ebios10.up.seesaa.net/image/2020-10-21_180252.png" target="_blank"><img border="0" alt="2020-10-21_180252.png" src="https://ebios10.up.seesaa.net/image/2020-10-21_180252-thumbnail2.png" width="640" height="141"></a>
特に何をすることもなく、caddyをPullしてコンテナの起動まで出来た。

#Firefoxでlocalhost:8081にアクセス
Firefoxでlocalhost:8081にアクセスする。8081なのはdocker runで「-p 8081:80」と指定した為だ。
<a href="https://ebios10.up.seesaa.net/image/2020-10-21_172725.png" target="_blank"><img border="0" alt="2020-10-21_172725.png" src="https://ebios10.up.seesaa.net/image/2020-10-21_172725-thumbnail2.png" width="640" height="498"></a>
問題なく、Caddyが動いているのが確認できた。
何に躓くことも無く、dockerでのCaddy起動は簡単に終わった。

#Caddy設定ファイルとindex.htmlの場所
Caddy起動まで何事も無かったので、Caddyのコンテナに少し触ってCaddy設定ファイルとindex.htmlの場所を確認してみる。
```# docker exec -it testcaddy /bin/ash```
```# cd /etc/caddy```
```# ls```
```# cat Caddyfile```
<a href="https://ebios10.up.seesaa.net/image/2020-10-21_180526.png" target="_blank"><img border="0" alt="2020-10-21_180526.png" src="https://ebios10.up.seesaa.net/image/2020-10-21_180526-thumbnail2.png" width="608" height="541"></a>
```# Set this path to your site's directory.```
```root * /usr/share/caddy```
と設定されている。
```# cd /usr/share/caddy```
```# ls```
```# cat index.html```
<a href="https://ebios10.up.seesaa.net/image/2020-10-21_180618.png" target="_blank"><img border="0" alt="2020-10-21_180618.png" src="https://ebios10.up.seesaa.net/image/2020-10-21_180618-thumbnail2.png" width="410" height="147"></a>
設定どおり/usr/share/caddyの下にindex.htmlがいることが確認できた。
Caddyをお試しするなら、dockerで行うのが楽で良さそうだ。
aws-cliを使って「キャパシタープロバイダー」にある「FARGATE」を見えなくする

FARGATE_SPOT 100%で動かしたいときによくあるコマンドでやると、使わないFARGATEが残ってて気持ち悪い、という人向け（要するに自分用メモ）

注意: ドキュメント曰くこれはaws-cli 1.xのやり方らしいです。現状2.0でのやり方が見当たらなかったので書いてますが、別のより良いやり方が存在する可能性があることを念頭において使用してください。

# やり方

aws-cliで↓みたいな感じで`put-cluster-capacity-providers`を叩く。

```sh
aws ecs put-cluster-capacity-providers \
     --cluster {{ ClusterName }} \
     --capacity-providers FARGATE_SPOT \  # ここを残したいやつにする
     --default-capacity-provider-strategy capacityProvider=FARGATE,weight=1,base=1  # ここはお好みで
```

`--capaity-providers`のところに書いたやつがAWSコンソールに表示されるようになるので、そこに「FARGATE」を入れなければよい。その他FARGATE_SPOT以外に残したいやつがあればそこに書く。

# 補足

## タイトルがなぜ「見えなくする」なのか？

delete-capacity-providerのドキュメントを見るとこう書かれているため。たぶん内部的には存在しているけど、表示上見えなくなっていればいいやの気持ち。

>Note
The FARGATE and FARGATE_SPOT capacity providers are reserved and cannot be deleted. You can disassociate them from a cluster using either the PutClusterCapacityProviders API or by deleting the cluster
>https://docs.aws.amazon.com/cli/latest/reference/ecs/delete-capacity-provider.html

# 参考

<https://docs.aws.amazon.com/cli/latest/reference/ecs/put-cluster-capacity-providers.html>
Ruby on RailsでRSS/Atom形式のサイトマップをつくった

自社サイトのSEO対策でRSSフィード作成を担当したのでその方法をメモしておきます。


## なんでSEO対策にRSSなのか？

### その前にサイトマップについておさらい。
サイトマップとは「クローラーにページを見つけてもらいやすくするためにサーバーに置くファイル」
サイトマップには以下の種類がある。

#### XMLサイトマップ
- クロール・インデックスさせたいURLをすべて記述する。
- その分サイズが大きい。
- そのため**クローラーがあんまり見に来てくれないらしい**。ぴえん

#### RSS/Atomフィード
- 最近の変更のみ記述する。
- そのためサイズが小さい。
- だからXMLサイトマップよりも**クローラーが見に来てくれる頻度が高い**。


私が開発を担当しているサイトは、イベント情報を載せて集客をするサイトなので、
**1日に新規ページが何ページも増える**
→新しい増えたページを**できるだけ早くクロールしてもらいたい**
　→サイトマップだけではなく、RSS/Atomフィードを設置することにした。

## RSSフィード作成

### 標準ライブラリ
RailsにはRSSを扱うための標準ライブラリ（https://docs.ruby-lang.org/ja/latest/library/rss.html） が用意されていてrequireするだけで使える。

```
require 'rss'
```

### フィード作成処理
あとはRSSフィードを作りたいところで

```ruby
##
# [param] event_list : フィードに載せるエントリのリスト
#
def create_rss_feed(event_list)
  # 今回はAtom1.0フォーマットで作成
  feed = RSS::Maker.make('atom') do |maker|
    maker.channel.about = 'tag:sample.com:feed' # フィードを一意に示すID。多分一意ならなんでもいい。
    maker.channel.title = "新着イベント" # フィードのタイトル
    maker.channel.description = "イベントの最新情報をご紹介します。" # フィードの説明文
    maker.channel.link = 'https://sample.com/' # サイトURL
    maker.channel.author = 'イベント事務局' # フィードの作成者
    maker.channel.date = Time.now.strftime('%Y-%m-%d %H:%M:%S') # フィードの最終更新日時

    event_list.each_with_index do |event|
      maker.items.new_item do |item|
        item.link = event.url # 詳細ページのURL
        item.title = event.title # 詳細ページのタイトル
        item.date = event.start_time.strftime('%Y-%m-%d %H:%M:%S') # イベントなら開催日、記事なら公開日など
      end
    end
  end
  render xml: feed.to_xml
end
```
このような処理を書いて実行すると
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/322620/4698f6ad-821b-58fa-5fa8-10b51d0bd146.png" width="70%">
このようにブラウザ上でRSSフィードが表示されました！
今回はAtomというフォーマットで作成しましたが、違うフォーマットで作成するときは
```RSS::Maker.make('atom')```
この「atom」の箇所を例えばRSS2.0であれば「2.0」に変えればよいそう。


## おわりに
標準ライブラリが用意されていたのであっという間にできてしまいました。
Railsってすごい〜〜と思うことばかりです。
pybind11 でクラスのメソッドやアトリビュートのリストを返したい

pybind11 でクラスのメソッドやアトリビュート(フィールド)へのバインドを書いても, Python world からはそのクラスになにが定義されているのかを知ることができません.

`__dict__` を呼んでも, 動的アトリビュートのみしか表示されません.

https://pybind11.readthedocs.io/en/stable/classes.html#dynamic-attributes

`__dict__` を再定義することもできない(コンパイルは通るが, Python import 時に `__dict__` は non-writable であるエラーがでる)ため, `help()` なりで自前関数を定義して, 明示的に対応するしかなさそうです.

e.g.

```

using namespace pybind11::literals; // to bring in the `_a` literal

...

.def("help", [](const MyClass &) {
  const auto d = py::dict("name"_a="name of this instance");
  return d;
})
```

```

> c = myclass.MyClass()
> c.help()

{'name': 'name of this instance'}

```

`def_property_static_readonly` を使って, クラスの静的メンバにする手もあります.
Redux-Formで作成したフォームに初期値を渡す方法

Redux-Formで作ったフォームに、初期値を設定する際に手こずったため、その方法をまとめました。

### はじめに
通常の`input`タグのように、`value`属性を記載するだけでは初期値を表示できず、Redux-Formが用意している専用のプロパティを利用する必要があります。

### 定数を渡す
Redux−Formを呼び出す際に、`initialValues`プロパティを設定すればOK。
Redux-Formの各インスタンス（`name`属性）に対し、下記のように初期値を設定する。

```javascript
const formWrapped = reduxForm({
    form: 'profile',
    initialValues: { 
        userName: 'ほげほげ',       //userNameの初期値は'ほげほげ'
        email: 'hoge@mail.com'     //emailの初期値は'hoge@mail.com'
    }
})(ProfileEdit);

export default connect(
    mapStateToProps,
    { getUserData }
)(formWrapped);
```

### 変数を渡す

私の場合は、reduxストア内の値を`initialValues`に渡したかったのですが、
そのような変数を`initialValues`に渡す方法がわからず、ここで手こずりました。

結論から言うと、変数を渡す場合は、`mapStateToProps`の中に`initialValues`プロパティを追加します。
その上で、reduxFormを呼び出す際、`mapStateToProps`を引数として設定することで、初期値を表示できます。
ただし、このままだと初回レンダリング時の値が表示されたままとなります。
（初回レンダリング時に値が`null`だと、`initialValues`の中身が空欄のままになってしまいます。）

こちらはreduxFormに`enableReinitialize:true`プロパティを追加することで、
求める挙動にすることができます。

```javascript

const mapStateToProps = state => {
    return {
        selectedUser: state.selectedUser,
        //mapStateToPropsの中にinitialValuesプロパティを追加
        initialValues: {     
            userName: state.selectedUser.userName,
            email: state.selectedUser.email
        }
    }
}

const formWrapped = reduxForm(
    {
        form: 'profile',
        enableReinitialize: true     //enableReinitializeプロパティを追加
    },
    mapStateToProps    //mapStateToPropsを引数に設定
)(ProfileEdit);

export default connect(
    mapStateToProps,
    { getUserData }
)(formWrapped);
```


### 参考リンク
https://github.com/redux-form/redux-form/issues/916
https://stackoverflow.com/questions/41267037/redux-form-initial-values-from
図解と数値例で学ぶ多変量解析入門～ビッグデータ時代のデータ解析

```r
#図解と数値例で学ぶ多変量解析入門～ビッグデータ時代のデータ解析 野口博司著　日本規格協会

#コンジョイント分析(MONANOVA)

D=matrix(c(0,0,1,1,0,0,1,1,0,0,0,0,0,0,0,0,1,1,1,0,1,0,1,0,0,1,0,1,0,1),ncol=5)

Z=c(6:1)

b=c(1:ncol(D))/10

ite=3*10^5

eta=10^(-2)

for(s in 1:ite){

Z_hat=D%*%b

Z_hat_ave=rep(mean(Z_hat),nrow(D))

V=as.numeric(t(c(Z-D%*%b))%*%t(t(c(Z-D%*%b))))

W=as.numeric(t(c(D%*%b-Z_hat_ave))%*%t(t(c(D%*%b-Z_hat_ave))))

S=sqrt(V/W)

g=-(S/W)*t(D)%*%((Z-Z_hat)/(S^2)+Z-Z_hat_ave)

b=b-eta*g

print(S)

}

```

```r

#コンジョイント分析(L2:MONANOVA)

Z=c(6:1)
D=matrix(c(0,0,1,1,0,0,1,1,0,0,0,0,0,0,0,0,1,1,1,0,1,0,1,0,0,1,0,1,0,1),nrow=6)
b=solve(t(D)%*%D+diag(rep(1,ncol(D))))%*%t(D)%*%Z

ite=200
eta=10^(-2)
lam=0.01
q=100

for(s in 1:ite){
Z_hat=D%*%b
Z_hat_ave=rep(mean(Z_hat),nrow(D))
V=as.numeric(t(c(Z-D%*%b))%*%t(t(c(Z-D%*%b))))
W=as.numeric(t(c(D%*%b-Z_hat_ave))%*%t(t(c(D%*%b-Z_hat_ave))))
S=sqrt(V/W)
g=-(S/W)*t(D)%*%((Z-Z_hat)/(S^2)+Z-Z_hat_ave)
g=g+2*lam*(b)
b=b-eta*g
#print(S)　#ストレス値

#Dinkelbachのアルゴリズム(G=0で計算修了)
#https://repository.kulib.kyoto-u.ac.jp/dspace/bitstream/2433/58876/1/1526-9.pdf
G=V-q*W
if(G<0){
q=V/W  
}
print(G)
}


```

```r

#コレスポンデンス分析

Dat=matrix(c(28,10,12,19,23,8),ncol=2)

Dr=diag(apply(Dat,1,sum))

Dc=diag(apply(Dat,2,sum))

Pm=apply(Dat,1,sum)/sum(Dat)

Pt=apply(Dat,2,sum)/sum(Dat)

N=Dat;n=sum(N)

A=solve(sqrt(Dr))%*%N%*%solve(Dc)%*%t(N)%*%solve(sqrt(Dr))

eigen_values=eigen(A)$values[2:ncol(A)]

eigen_values=sqrt(eigen_values[abs(eigen_values)>10^(-5)])

eigen_vectors=eigen(A)$vectors[,2:ncol(A)]

eigen_vectors=eigen_vectors[,1:length(eigen_values)]

u=sqrt(n)*solve(sqrt(Dr))%*%eigen_vectors

v=array(0,dim=c(ncol(N),length(eigen_values)))

for(j in 1:length(eigen_values)){

if(length(eigen_values)==1){

ve=(sqrt(n))*solve(Dc)%*%t(N)%*%solve(sqrt(Dr))%*%eigen_vectors

}else{

ve=(sqrt(n))*solve(Dc)%*%t(N)%*%solve(sqrt(Dr))%*%eigen_vectors[,j]

}

v[,j]=ve

u[,j]=u[,j]*eigen_values[j]

}

```

```r

#多次元尺度

#Torgerson-Gowerk method

d=matrix(c(0,2*sqrt(2),2,2*sqrt(2),0,4,2,4,0),ncol=3)

d[upper.tri(d)]=-d[upper.tri(d)]^2/2

d[lower.tri(d)]=-d[lower.tri(d)]^2/2

s_vec_bar=apply(d,1,mean)

s_bar=mean(d)

S=array(0,dim=dim(d))

for(j in 1:ncol(S)){

vec=d[j,]-s_vec_bar[j]-s_vec_bar+s_bar

S[j,]=c(vec)

}

eigen_vectors=eigen(S)$vectors

plot(eigen_vectors[,1],eigen_vectors[,2])







```
SlackのチャンネルにIncoming Webhookでメッセージ送信

SlackのチャンネルにIncoming webhookを利用してプログラムからメッセージを送信する際に何故か毎回UIなどで戸惑うので、簡単な手順まとめ。

# Slackの設定

- https://XXXX/services/new/incoming-webhook　にアクセス
    - XXXXの部分は設定したいSlackのURL
- メッセージを送りたいチャンネルを選択
    - アプリのアイコンとか名前を設定する
- Webhook用のURLが発行される

# プログラムから送信する
あとは発行されたWebhookにメッセージを送信すると選択したチャンネルにメッセージが送信される。

```ruby:test.rb
def toSlack(msg)
    uri  = URI.parse('発行されたWebhookURL')
    params = { text: msg }
    http = Net::HTTP.new(uri.host, uri.port)
    http.use_ssl = true
    http.start do
      request = Net::HTTP::Post.new(uri.path)
      request.set_form_data(payload: params.to_json)
      http.request(request)
    end
end
```
簡単なリコメンデーション機能を作りました。

# リコメンデーション機能気になる理由
- オンラインショップで良くオススメが見えました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/318767/e97ed191-4186-ce3c-f2a7-0c388960c3c0.png)

- SNSでオススメ友達が見えました

→　オススメが最近使われています
→　面白いので、調べたい

---

# 関連する記事
- https://medium.com/@ysmiracle/build-a-recommendation-engine-in-ruby-f6c4b44f2916
- https://dev.to/matiascarpintini/building-a-rails-recommendation-engine-216o

---

# まずに映画のオススメを作ります
- ユーザーに面白いそう映画をオススメする機能

---

# アルゴリズム（1）

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/318767/c1abda5e-e2b5-8c28-4100-1eb00aa85525.png)

---

# アルゴリズム（2）

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/318767/f500b60a-176e-9e9f-53cd-18a76bed7967.png)


---

# アルゴリズム（3）- スコアリング
- 関係性が高い　→　点数が高い
- 点数が高い　→　オススメが多い

---

# Railsでスコアリングを書きました。

```
    def recommend_movies # recommend movies to a user
      # find all other users, equivalent to .where(‘id != ?’, self.id)
      other_users = self.class.all.where.not(id: self.id)
      # instantiate a new hash, set default value for any keys to 0
      recommended = Hash.new(0)
      # for each user of all other users
      other_users.each do |user|
        # find the movies this user and another user both liked
        common_movies = user.movies & self.movies
        # calculate the weight (recommendation rating)
        weight = common_movies.size.to_f / user.movies.size
        # add the extra movies the other user liked
        common_movie_ids = common_movies.pluck(:id)
        user.movies.each do |movie|
          next if common_movie_ids.include? movie.id
          # put the movie along with the cumulative weight into hash
          recommended[movie] += weight
        end
      end
      # sort by weight in descending order
      sorted_recommended = recommended.sort_by { |key, value| value }.reverse
    end
```

---

# Railsで表示する
https://github.com/phamthanhthuongbk/recommendation-rails

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/318767/1486b28f-f5ca-4665-6008-4a5244afe66c.png)

---

# まずに友達のオススメを作ります。
- 映画のアルゴリズムと同じ作ります。

---

# 結果は
https://github.com/phamthanhthuongbk/recommendation-rails

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/318767/897f0d10-fcdd-41ac-ba57-18d53caa4d48.png)

---

# 感想
- アルゴリズムが分かりやすい、効果が見えました。
- オススメの動きがイメージが出来ました。
- スコアリングのため、全部のDBを見ないといけないので、大きなシステムだとどうかな
JavaScript ファイル拡張子チェック

# ライブラリを使わない拡張子チェック

```allowExtension.js
  const allowExtensions = '.(jpeg|jpg|png|bmp|gif)$'; // 許可する拡張子
  const onChangePicture = (e) => {
    if (e.target.files[0]) { // ファイル存在チェック
      if (!e.target.files[0].name.match(allowExtensions)) { // 許可する拡張子以外の場合
        alert('拡張子が jpeg, jpg, png, bmp, gif 以外のファイルはアップロードできません。');
        return; // 処理を中断
      }
  }
```

参考ページ
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/String/match
RailsにBootstrapを導入!!

RailsにBootstrapを導入する方法を説明致します。
手順は、とても簡単ですのでご参考にどうぞ！！
手順は、４つあります。

####手順
**1.Bootstrapのインストール
2.SCSSファイルの作成
3.JSファイルの修正
4.Rails（Puma）の再起動**

#1.Bootstrapをgemでインストール

RailsでBootstrapを使う場合は、gemを使ってインストールする方法が一般的です。
Bootstrapは内部でjQueryを利用しているので、こちらもあわせてインストールしましょう。
Gemfileに以下を追記して、bundle installを実行してみてください。

```java:Gemfile
gem 'bootstrap', '~> 4.3.1'
gem 'jquery-rails'
```

```java:ターミナル
% bundle install
```

#2. SCSSファイルを作成

**次に、application.cssをapplication.scssというファイル名に変更します。**
これは、Bootstrapが「SCSS」という記法で書かれており、Railsでもあわせて利用するためです。
「SCSS」とは、CSSを拡張した記法のことで、いまのWeb業界では多く利用されている記法になります。
ここでは具体的な解説はしませんが、CSSの記述よりも見やすく、書きやすくなった記法だと思ってください。

```java:ファイルの拡張子を変更
 変更前 app/assets/stylesheets/application.css 
 変更後 app/assets/stylesheets/application.scss
```

ファイル名を変更したら、実際にファイルを開いて下さい。
**＊= require_tree .と＊= require_selfを削除し、
@import "bootstrap";を追記します。**
追記したコードが、Bootstrapを読み込むための設定になります。


```java:app/assets/stylesheets/application.scss
/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS/SCSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *
 *= require_tree .    ＜（削除）
 *= require_self      ＜（削除）
 */
@import "bootstrap";  ＜（追加）
```

#3. JSファイルを修正

Bootstrapで使われる「JavaScript」や「jQuery」などの関連ファイルを読み込む設定をします。
app/assets/javascripts/application.jsを開き、以下を参考に元々あったコードの上に追記してください。

```java:app/assets/javascripts/application.js
# 以下の３つを追記
//= require jquery3
//= require popper
//= require bootstrap

# 元々あったコード
//= require rails-ujs
//= require activestorage
//= require turbolinks
```

#4. Rails（Puma）を再起動

ここで一度、ブラウザからアクセスしてみてください。
もし、この段階でエラーが表示されているのであれば、Rails（Puma）を再起動します。
それでもエラーが変わらない場合は、「node.js」のバージョンが古い可能性があります。
DockerでRailsを構築した方は、Dockerfileが以下のような設定になっているかを確認してください。

```java:Dockerfile
# Railsに必要なパッケージをインストール
RUN apt-get update -qq && apt-get install -y nodejs
RUN curl -sL https://deb.nodesource.com/setup_10.x | bash - \
    && apt-get install -y nodejs

# 以下の公式サイトの記述では、node.jsのバージョンが低くてbootstrapが使えない
# RUN apt-get update -qq && apt-get install -y nodejs
```

#まとめ

導入手順は難しいと思うかもしれませんが、この説明した手順の通りに記述を削除したり、
書き換えたりするだけですので意外と簡単です。
是非試してみて下さい！！


####以上。
React開発時の汎用的なGitpod環境設定

- 開発時に、オンラインエディタである[Gitpod](https://www.gitpod.io/)を利用する機会があります。
- 同様の技術利用が多いため、環境テンプレートを作成する必要があります。
- 今回はReactを利用した開発においてのGitpod設定を記述します。
- **※Gitpodの概要や利用方法に関しては、[こちら](https://kobeucsenshu.github.io/ideinfo/gitpod/howto.html)**

## 前提
- Reactプロジェクトの準備
    - **試用の場合、[create-react-app](https://ja.reactjs.org/docs/create-a-new-react-app.html)等で準備**
    - **※npmプロジェクトであれば基本可**

## 結果
- 先にGitpod設定ファイルである、`.gifpod.yml`の記述を示します。

```yaml
tasks:
  - init: npm ci
    command: npm start

ports:
  - port: 3000
    onOpen: open-preview

github:
  prebuilds:
    addComment: true
    addBadge: true

vscode:
  extensions:
    - dbaeumer.vscode-eslint@2.1.8:02aHhbJ0Q4aGdjHXlTdVKg==
    - esbenp.prettier-vscode@5.7.1:GDba64T6G+TUi1qmc6BE3A==
    - dsznajder.es7-react-js-snippets@3.0.0:9YEGn/57fW8lJt7cVxJQDQ==
```

- 以下、実際のGitpodでの開発画面。

![pen.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/336499/f5474877-32ce-6e65-4416-3b7a1e6ae1f9.png)



## 内容
- 上記の結果は、主に以下を設定した開発環境を用意するための記述です。
    - **環境構築時の自動コマンド指定**
    - **自動プレビュー**
    - **起動速度の短縮**
    - **vscode拡張機能の自動追加**

### 起動コマンド指定
- `.gitpod.yml`では、`tasks`で環境構築時の自動コマンド指定が可能です。
- そのため、React開発時に必要な以下を設定します。
    - **依存関係インストール**
        - `init`(**新規作成時のみ**実行)プロパティで設定
            - **※再起動やスナップショット時は行われない**
    - **開発サーバー起動**
        - `command`(**開始時に毎回実行**)プロパティで設定

### 自動プレビュー
- `.gitpod.yml`では、`ports`サーバー動作設定が可能です。
- タブ抑止のため、`open-preview`でエディタ画面内にプレビューの表示を行います。

### 起動速度の短縮
- オンラインエディタでは、起動速度が遅い場合があります。
- Gitpodでは、Githubアプリ連携によるプレビルド機能により大幅な解消が可能です。
    - **※基本デフォルトで十分のため、[github](https://github.com/apps/gitpod-io)で連携するのみで記述は必須では無い。**
    - **※拡張の場合のみ、prebuildsプロパティを記述**

### vscode拡張機能の自動追加
- `.gitpod.yml`では、VSCode拡張機能も管理・共有することが可能です。
- `extensions`プロパティで、React開発に最低限必要な以下を設定します。
    - [eslint](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint)
    - [prettier](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode)

## まとめ
- 上記のことから、オンライン開発環境における最低限の定型化と良質な開発性の重要性を実感。

## 参考
- [Gitpodドキュメント](https://www.gitpod.io/docs)
Django ForeignKeyのon_deleteの引数


##参考

[Django 公式](https://docs.djangoproject.com/ja/3.1/ref/models/fields/#django.db.models.ForeignKey.on_delete)
[stackoverflow](https://stackoverflow.com/questions/38388423/what-does-on-delete-do-on-django-models)


#ForeignKeyのon_deleteの動き
on_deleteは参照元オブジェクトが削除された時に、
そのオブジェクトを削除するのか残しておくのかを決めておきます!!

```python:models.py
# サンプルのモデル
class Book(AbstractModel):
    publisher = models.ForeignKey(Publisher, on_delete=models.CASCADE)
```
##models.CASCADE
参照しているオブジェクト(例: Publisher)が削除されたら
一緒にオブジェクト(例: Book)を削除する
例: ブログの記事を消したらそこに寄せられたコメントも必要ないから消す

##models.PROTECT
参照しているオブジェクト(例: Publisher)が削除されても
オブジェクト(例: Book)は削除しない
全てのオブジェクトを削除したいなら全部手動でやらなきゃならない。

##models.SET_NULL
参照しているオブジェクト(例: Publisher)が削除されたら
オブジェクト(例: Book)にはNULL(例: establishmentにNULL)がセットされる
例: ユーザを削除するとき、ブログにユーザが寄せたコメントだけは匿名で残したいときなんかはこれが使える。
※null=Trueにする必要あり。

##models.SET_DEFAULT
参照しているオブジェクト(例: Publisher)が削除されたら
オブジェクト(例: Book)にはdefaultで設定した値(例: establishmentにdefault)がセットされる

```python:models.py
publisher = models.ForeignKey(Publisher, on_delete=models.SET_DEFAULT, default='不明')
```

##models.SET
独自で設定した値を代入する。
callableを渡す。

```python:models.py
def get_publisher():
    # とりあえず一つ目返す
    return Publisher.objects.all().first()

class Book(AbstractModel):

    publisher = models.ForeignKey(Publisher, on_delete=models.SET(get_publisher))
```

##models.RESTRICT
※これはDjango3.1の機能です。
オブジェクトを削除する際に
参照しているオブジェクトが存在すると、削除せずにRestrictedErrorとする。

```python:models.py
class Artist(models.Model):
    name = models.CharField(max_length=10)

class Album(models.Model):
    artist = models.ForeignKey(Artist, on_delete=models.CASCADE)

class Song(models.Model):
    artist = models.ForeignKey(Artist, on_delete=models.CASCADE)
    album = models.ForeignKey(Album, on_delete=models.RESTRICT)
```
```python:console
artist_one = Artist.objects.create(name='artist one')
album_one = Album.objects.create(artist=artist_one)
song_one = Song.objects.create(artist=artist_one, album=album_one)
album_one.delete()
# Raises RestrictedError.
# 参照しているsongが存在するためエラー


artist_two = Artist.objects.create(name='artist two')
album_two = Album.objects.create(artist=artist_two)
song_two = Song.objects.create(artist=artist_one, album=album_two)
# artist_oneを使っていることに注意
artist_two.delete()
# Raises RestrictedError.
# artist_twoを削除するとCASCADEしているalbumも削除されるため、
# 参照しているSongでエラーが発生する
```