OmniAICreator/Qiita-1.07M huggingface dataset:
npm run buildできなくなった話

忘れないように書いておきます:tea:

# きっかけ
Catalinaで動かしていたWailsのプロジェクトをBigSurの環境にクローンした。
あれ、ビルド出来ないじゃないですか...

```bash
 WAIT  Compiling...                                                                                   2:33:34

98% after emitting

 ERROR  Failed to compile with 1 error                                                                2:33:35

 error  in ./src/components/AWS.vue?vue&type=style&index=0&id=b9fe5306&scoped=true&lang=css&

Syntax Error: Error: Loading PostCSS Plugin failed: No valid exports main found for '/path/to/wailsapp/frontend/node_modules/colorette'

(@/path/to/wailsapp/frontend/package.json)
    at Array.map (<anonymous>)
```

# 原因
nodeのバージョン古かった

```zsh
% node -v
v13.5.0
```

# 解決方法

```zsh
% nodebrew install stable
Fetching: https://nodejs.org/dist/v16.0.0/node-v16.0.0-darwin-x64.tar.gz
###################################################################################################### 100.0%
Installed successfully
% nodebrew list
v13.5.0
v16.0.0

current: v13.5.0
% node use v16.0.0
use v16.0.0
% node -v
v16.0.0
% npm run build
#### 省略 ####
  File            Size                                        Gzipped

  dist/app.js     199.81 KiB                                  69.14 KiB
  dist/app.css    138.32 KiB                                  76.13 KiB

  Images and other types of assets omitted.

 DONE  Build complete. The dist directory is ready to be deployed.
 INFO  Check out deployment instructions at https://cli.vuejs.org/guide/deployment.html
```
時系列予測ライブラリProphetによる株価予測は当たっているのかバックテストしてみた

Facebook社は時系列予測ライブラリ『Prophet』をオープンしています．

今回は，「Prophetによる株価予測は当たるのか？」を軽く検証（バックテスト）してみたいと思います．

本記事は以下の記事を参考に書かれているので，分からない箇所，コードは以下の記事をご覧ください．

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

なお，Prophetの基本的な使い方は以下の記事をご覧ください．

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

この記事↑では，2015/1/1~2021/1/1のKO（コカ・コーラ）の株価データを使ってProphetで予測してみたところ，2021/1/1以降の250日間の予測結果は以下のようになりました．

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1298289/795ac00e-a84e-ae18-6880-923c09b1de74.png)

#予測に実際のデータを重ねてみる（バックテスト）

現在はすでに2021/4なので，どれくらいこの予測と合っているのかを見ることができます．

というわけで，実際のデータを重ねてみます．

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1298289/b36cfb44-d953-cc84-32f9-d0c007c03ed2.png)

めちゃくちゃずれていますね．ちなみに，このデータを重ねることによる検証コードは[こちらの記事](https://optrip.xyz/?p=2883)をご覧ください．

まあ，そんなに簡単に未来が予測できるならPythonを使えるだけで億万長者ですからね．現実は甘くないというわけです．

ただし，コロナショック付近（2020/1~2020/3）でも予測範囲から外れていますから，決めつけはよくありません．たまたま外れているだけかもしれませんからね．実際，よく見てみると予測の直後の1か月ほどは当たっています．

また，時系列予測が急激な株価の変化についていけるわけがないので，Prophetによる予測は穏やかなトレンドにしか効果がないことが伺えます．

結論としては，「株価が荒波のように動いているときは時系列予測によるテクニカル分析は役に立たない」ということですね．

コロナ後の予測は，世界情勢などからするべきで，テクニカル分析で行うのは無理がありました．

ちなみに，このProphetのモデル精度に関しては以下の記事をご覧ください．

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

というわけで，コロナショック前でバックテストしましょう．

2018/1/1までのデータでモデル調整を行い，それ以降の250日間で予測と実際の株価を比較してみます．

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1298289/9e3e9e27-6bb4-0507-a8ed-8a2aff3806bb.png)

微妙ですが，いったん下がって上がるという『形』はあっているので，シフトすればほぼピッタリ合いそうではありますね．上昇トレンドはとらえているという見方もできなくはなさそうです．

#Prophetによる予測について

やる前から分かってはいましたが，パターン認識から未来予測をするというのはなかなか難しいですね．そのため，個人的には今回のようなProphetによる予測はほとんどあてにしていません．

ただし，これはテクニカル分析が意味ないというわけではなく，トレンドを分析したりパターンを認識することはデータ分析の範囲内で統計的には十分な意味を持つことは間違いないです．

「得られた分析結果をどう使うのか」が株価予測のカギを握ると思います．

例えば，個人的にはテクニカル分析指標であるMACDやボリンジャーバンドは統計的な意味を持つので，株価の売買をするときに参考にしています．一方で，未来予測，パターン認識の部分は自分の感覚に頼っています．

MACDやボリンジャーバンドを用いた売買手法をバックテストした記事もぜひご覧ください ↓

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

https://optrip.xyz/?p=3557
Python 備忘録<基本文法1>


# 目次
- 基本的な文法
 - format関数 
 - 文字列
 - 辞書型

#基本的な文法

## format関数
```py
# format関数
# コンソール空の入力受ける
name = input('名前を教えてください')
age = 18

# {}のところに変数nameの名前が入る
# 複数入れたい場合は、その分だけ{}を使用し、format関数の中にその分だけ引数を入れること
print('私の名前は{}です、年齢は{}です'.format(name, age))
```

##文字列

```py
fruit = 'apple'
print(fruit)
# コンソール上で<class 'str'>と出力することを確認
print(type(fruit))

# 同じ文字列を複数回出力することができる
print((fruit + " ") * 5)

# 文字列の場合、[]を使用すると文字列の中一文字を出力することができる
print(fruit[2])

msg = "ABCDEFGHIJKA"

print(msg.count("A"))

# 該当の文字で始まるかどうか調べることができる
# trueが返ってくる
print(msg.startswith('ABC'))
# falseが返ってくる
print(msg.startswith('JK'))

msg = ' ABCD '
print(msg)
# 両橋を削除する
print(msg.strip())
# 右端を削除する
print(msg.rstrip())
# 左端を削除する
print(msg.lstrip())

```

## 辞書型

```py
# keyに対しての値を宣言する
cart = {'morning': "bread", 'after_noon': 'nudole', 'diner': "psuta"}

# 値を取り出したい時は、keyを選択する
print(cart['morning'])

# 存在しないkeyを選択した時はエラーが返る
# print(cart['hello'])

# keyの値を全て取得する
print(cart.keys())
# 値の一覧を全て取得する
print(cart.values())
# key+値を全て取得する
print(cart.items())

tmp_cart = {'snack': 'candy'}

cart.update(tmp_cart)
# 上のtmp_cartの内容が追加された物が出力されること
print(cart.items())
```
Formオブジェクトパターンを理解する②ActiveModelモジュール紹介

>@kazutosatoさん
>https://qiita.com/kazutosato/items/91c5c989f98981d06cd4

>Railsガイド
>https://railsguides.jp/active_model_basics.html


|モジュール名|機能|
|--|--|
|AttributeMethods|クラスのメソッドにカスタムのプレフィックスやサフィックスを追加できます。|
|Callbacks|Active Recordスタイルのコールバックを提供します。|
|Conversion|クラスでpersisted?メソッドとidメソッドが定義されていれば、このActiveModel::ConversionモジュールをインクルードしてRailsの変換メソッドをそのクラスのオブジェクトに対して呼び出すことができます。|
|Dirty|あるオブジェクトが数度にわたって変更され、保存されていない状態は、「汚れた (dirty)」状態です。ActiveModel::Dirtyモジュールを使うと、オブジェクトで変更が生じたかどうかを検出できます。属性名に基づいたアクセサメソッドも使えます。|
|Validations|ActiveModel::Validationsモジュールを追加すると、クラスオブジェクトをActive Recordスタイルで検証できます。|
|Naming|ActiveModel::Namingは、命名やルーティングの管理を支援するクラスメソッドを多数追加します。|
|Model|ActiveModel::Modelを追加すると、Action PackやAction Viewと連携する機能をすぐに使えるようになります。ActiveModel::Modelをincludeすると、以下のような機能を使えるようになります。|
|Serialization|オブジェクトに基本的なシリアライズ機能を提供します。シリアライズの対象となる属性を含む属性ハッシュを1つ宣言する必要があります。属性は文字列でなければならず、シンボルは使えません。|
|ActiveModel::Serializers|Active Modelは、JSONシリアライズ/デシリアライズ用のActiveModel::Serializers::JSONモジュールも提供しています。このモジュールは前述のActiveModel::Serializationモジュールを自動でincludeします。|
|Translation|ActiveModel::Translationは、オブジェクトとRails国際化（i18n）フレームワーク間の統合機能を提供します。|
|Lintテスト|ActiveModel::Lint::Testsを用いて、オブジェクトがActive Model APIに準拠しているかどうかをテストできます。|
|SecurePassword|ActiveModel::SecurePasswordは、任意のパスワードを暗号化して安全に保存する手段を提供します。このモジュールをincludeすると、バリデーション機能を備えたpasswordアクセサを定義するhas_secure_passwordクラスメソッドがデフォルトで提供されます。|
今更ながらFlutterのDart構文を整理したら、lateとか増えてた

---
# :book: Flutterの記事を整理し本にしました :book:
https://zenn.dev/kazutxt/books/flutter_practice_introduction

* <font color="red"><b>本稿の記事を含む様々な記事を体系的に整理し本にまとめました</b></font>
* 今後はこちらを最新化するため、<font color="red"><b>最新情報はこちらをご確認くださ</b>い</font>
* 20万文字を超える超大作になっています!!

---

# はじめに
* ↑のとおり、Dartで本を書いているのですが、付録にDartの構文を整理することになり、今更ながらまとめたら、意外と知らない構文がありました。
* late とか使えるようになったの知らなかった。。。

## まとめ
* [Flutter系の記事のまとめ](https://qiita.com/kazutxt/items/524acb1c134015682ccf)

# 全体的な特徴
Dartの基本的な構文、文法、予約語を紹介します。

Flutterには、JavaやPythonのような、基本的なプログラミングの変数や定数、制御構文、クラス/メソッドが準備されています。

また、private、static、finalなどの修飾子に加え、ジェネリクスやイテレーション、匿名関数なども一通り使えます。

一方で、javascriptのawait/asyncのような非同期も使えます。

キーワードや特徴的な部分だけを取り上げています。
なお、詳細は公式ドキュメントなどをご参照ください。

# 演算
* +,-,*,/,% (四則演算)
* ++,-- (インクリメント,デクリメント)
* **>>** (シフト) 
* &,^,! (ビット演算)
* &&,||,! (AND,OR,NOT)
* ?? (null判定)
* += (複合代入)
* as (型キャスト)
* is (型チェック)

# 制御構文
* if,else (条件分岐)
* switch,case (多分岐)
* for,while,forEach, for in, dowhile (ループ)
* break,continue (制御)

# 変数の型
* int (整数)
* double (実数)
* num (数値)
* String (文字列(Runesも可))
* bool (ブール値)
* `[]` (配列)
* List (リスト)
* Set (集合)
* Map (Key/Value)
* Symbol (識別子)
* late (遅延初期化)
    * Dart2で導入

# 文字列
```dart:sample.dart
print("文字列の表示") // 文字列の表示
print("$_counter") // 変数の表示
print("${_counter + 1}") // 式の展開
```

""と''で文字列展開される / 文字列展開されないの違いはなし

# 変数修飾子
* final (再代入不可)
* const (定数)
* var (型推論)

# 例外処理
* try (例外が起きる可能性)
* catch (例外が起きたときの処理)
* finally (例外に関わらず実施する処理)
* throw (例外を投げる)

# クラス
* class (クラスの定義)
* コンストラクタ
  * インスタンス生成時に呼ばれる

```dart:MyData.dart
class MyData {
  String name;
  // MyData(String name){ this.name = name;}と等価
  MyData(this.name);
}
```

* new (インスタンスの生成)
  * 省略可
* extends (継承)
    * 1つだけ
* abstruct (抽象クラス)
  * newできない
* implements (インタフェース)
    * interfaceはキーワードは無いが、classでインタフェースを作る
    * 複数可
* with (mixinを作る)


# フィールド/メソッド
* _xxx (プライベート変数)
* static (static化(クラスに属するフィールド/メソッド)
* noSuchMethod() (メソッドがない時に呼ばれるメソッド)
  *  メタプログラミング
* アノテーション (メタ情報を付加)
    * @override (オーバーライド)
    * @deprecated (非推奨)
* get/set (getter,setter)

```dart:main.dart
//hogeクラス
int get data => _data; //getter
set data(int data){this._data = data}; //setter

//使う側
hoge.data = data;
print(hoge.data);
```
* class(String name) : super(name) (イニシャライザリスト)
  * :で区切った初期化処理を実施
* factory (factoryコンストラクタの定義)



# インポート
* import (パッケージをインポート) 
* import as xxx (xxxで名前をつける)
* import show yyy (yyy のみを使う)
* import hide zzz (zzz は除外する)



# メソッド

* method1(param: 1, param2: "data")
  * 名前付きパラメタ
* method2(String key, [String opt])
  * オプションパラメタ
  * 引数がなくても呼び出せる
* method3(ip = '127.0.0.1', port = 8080)
  * デフォルトパラメタ
  * 引数がない時に値を入れる
* methods4(func)
  * funcはメソッド。関数を変数に入れて渡せる
  * 関数の引数を第一級クラスオブジェクトとして扱える
* method5(data) => {print(data)}
  * 匿名関数
  * 簡素な関数の定義の命名することなく定義

# 補足
* enum (列挙型)
* `Sum<Int>` (ジェネリクス)
* async,await (非同期)
* Future (非同期の戻り値)
* assert (アサーション)

# カスケード記法
* カスケード記法
  * ..で同じオブジェクトのメソッドを連続で呼び出せる
  * メソッドチェーンに似ているが、戻り値ではなくオブジェクトの連続操作時のオブジェクト名を省略できる

```
var list2 = new List()..add(1)..add(2)
```
業務で役に立ったgitコマンドまとめ

僕が今まで参加した就業型インターンで、個人開発だとあまり使わないけど、業務だとよく使うgitコマンドを忘れないようにメモしておきます。
`commit`とか`push`のような本当によく使うコマンドの他の、+α 的なところです。

### リモートブランチをローカルに持ってくる
```
$ git checkout -b remote_dev
$ git fetch
$ git reset --hard origin/remote_dev
```
force pull みたいなことをしています。 ローカルのブランチ情報を強制的にリモートブランチに合わせる形でリモートのブランチを持ってきています。
[Git で force pull する方法 ( $ git reset --hard origin/branch_name )
](https://qiita.com/Yinaura/items/30992f25b87f76af3ba2)

### あるローカルブランチに、リモートブランチの情報を取り込みたい
```
$ git branch
* cat
  main

$ git pull origin dev
```
catブランチ上で作業していて、リモートのdevブランチが更新されたとき、最新のdevブランチを今いるブランチに取り組みたい場合がある。これは単純に、pullでリモートブランチを指定すればよい。
このとき強制的にリモートブランチに合わせたいときは、上の通り、`fetch` して `reset --hard` すればいい。

### ある修正を前のコミットに含めたい
```
$ git reset @~
$ git add ファイル名
$ git commit -m 'xxx'
```
オプションなしで `reset` すると、addも取り消してくれる。
[git-resetは結局何を戻すのか](https://qiita.com/fnobi/items/ec036c1b5d7ee5a8517c)
ちなみに、@ は head と同じ意味。
[git コマンドの @ (アットマーク) って何？ > HEAD と同じ意味](https://qiita.com/YumaInaura/items/a7597776a15e8a51306f)

### ブランチ移動する際、未コミットがあるとき
```
$ git branch
* cat
  hoge

$ git stash save

$ git checkout hoge
// hogeで作業
$ git checkout cat

$ git stash pop
```
 catブランチでファイルを追加した後で、hogeブランチで作業することが見つかりにhogeに移動すると、catブランチの情報が反映されている。 このような場合、`stash`を利用し、catブランチの編集情報を一時的に保存しておき、hogeブランチにcatブランチの作業が反映しないようにする。
 hogeブランチで作業が終わってcatブランチに戻ってきたら、`apply`とか`pop`とかして復元する。

ただし、新規ファイルを`stash`するときは、`$ git add`してから`$ git stash`するか、
`$ git stash -u` を実行する。


まだ何かあれば、これから追記していきます。
Ruby　西暦を和暦に変換する（年だけの部分を抽出したい）

# 西暦から和暦に変換させる方法(年だけの部分を抽出したい)
オリジナルアプリを作成している過程で、年表示のとこだけを抽出して「西暦を和暦へ」変換させたいと思ったのですが、私は、以下のような方法で、年号変換を実装してみたので、記事にしてみました。

```ruby
require 'date'

NENGO_EIJI_KANJI = {'M'=>'明治','T'=>'大正','S'=>'昭和','H'=>'平成', 'R'=>'令和'}
# 1988年１月２１日の西暦を和暦に変換させる
input = Date.new(1988, 1, 21).jisx0301 
input = input.split(".")
nengo = input[0].split(//)
nengo[0] = NENGO_EIJI_KANJI[nengo[0]]
nengo = nengo.join
p "西暦を和暦に変換すると#{nengo}年です"
# 西暦を和暦にすると昭和６３年です
```
以下、コードを解説していきます。


# Dateクラスについて
Rubyの標準ライブラリで、日付や曜日を扱う際に使用するものです。
Dateクラスを使用すると、年号変換を英字表示で変換することができます。
ただ、日本語表示には対応していないようなので、英字表示されたものを日本語に変換できるように定数でハッシュを作成してやり、

```ruby
NENGO_EIJI_KANJI = {'M'=>'明治','T'=>'大正','S'=>'昭和','H'=>'平成', 'R'=>'令和'}
```
といった感じで格納してあげ、該当する英字を日本語に変換できるようにしてあげます。

# jisx0301メソッドとsplitメソッド
Dateクラスの`jisx0301メソッド`で和暦 (JIS X 0301 形式) を取得できます。
例えば、

####Ruby 2.6.5
```ruby 
require 'date'
Date.new(2021, 4, 24).jisx0301
# "R03.04.24"
```
といった感じに、西暦を和暦の英字表示に変換してくれます。

[splitメソッド](https://docs.ruby-lang.org/ja/latest/method/String/i/split.html)は、文字列を配列に格納してくれるメソッドです。
ある特定な文字列を分割したいところで様々な方法で分割してくれます。
例えば、先のコードで説明すると、

```ruby　
input = Date.new(1988, 1, 21).jisx0301   # "S63.01.21"
nengo = input.split(".")  # nengo = ["S63", "01", "21"]
```
となり、引数で指定した文字の部分で区切って配列を返してくれます。

これで、`nengo[0]`で`S63`を抜き出すことができるようになります。
また、最終的にほしいのは「S」の部分であり、これを定数で定義した日本語表示の年号に変換させることで当初の目的を達成するのですが、`splitメソッド`の引数に「//」を使うと、１文字づつ配列に格納して返してくれます。
これを使うと、

```ruby
nengo = nengo[0].split(//)  # nengo = ["S", "6", "3"]
```
となり、`nengo[0]`で「S」のみ抽出することができるようになります。
これを`NENGO_EIJI_KANJI[nengo[0]]`と記載して、西暦を和暦に変換することができます。

# joinメソッド
このままの状態だと

```ruby
p nengo  # ["昭和", "6", "3"]
```
となってしまい、配列表示になってしまうので、この配列を１つの文字列にくっつけてやりたいのですが、このときに使うのが`joinメソッド`になります。
`joinメソッド`を使うと、配列の各要素を結合して１つの文字列にしてれるので、

```ruby
nengo = nengo.join # "昭和６３"
p "西暦を和暦にすると#{nego}年です"
# 西暦を和暦にすると昭和６３年です
```
と「年」の部分だけを抽出して西暦を和暦に変換することができるようになります。

他にも、こんな方法があるよ！とか、ご指摘等ありましたら、教えていただけると幸いです。
ご覧いただきありがとうございました。
Pipenv環境でPATHを設定する


Pipenvの仮想環境の中でだけPATHを追加したかったので、調べたことを書く

## 結論

何通りか方法がある

### 1. 環境変数PATHを指定してpipenvを実行する


```shell:shell
PATH=${PATH}:./node_modules/.bin pipenv shell
```

### 2. `.env`にPATHを記載する

`.env`は`Pipfile`と同じ場所に配置する

```file:.env
PATH=${PATH}:./node_modules/.bin
```


> プロジェクトに .env ファイルが存在する場合は、 $ pipenv shell および $ pipenv run は自動で読み込みます:

参考：[.env の自動読み込み](https://pipenv-ja.readthedocs.io/ja/translate-ja/advanced.html#automatic-loading-of-env) より

### 3. exportする

普通にexportしてももちろん大丈夫

```shell:shell
export PATH=${PATH}:./node_modules/.bin
``` 


## 感想
毎回指定しなくてよいので、2が楽でよさそう。
DockerのMySQL接続でテーブル確認する際、ERROR 1046 (3D000): No database selectedが出た時の対処法


DockerのMySQLと接続してテーブル設計がどうなってるか確認しようとしたところ、
ERROR 1046 (3D000): No database selectedというエラーが出てしまったので、
対処法をまとめました。

#MySQLと接続してテーブル設計確認を試みると..

dockerコンテナの名前を確認

```terminal.
docker ps
```

で出てきたDBのコンテナ名（ここでいうと`project_file_db_1`です)をコピペして、

```
ONTAINER ID   IMAGE              COMMAND                  CREATED        STATUS        PORTS                               NAMES
dcba6a097806   project_file_web   "entrypoint.sh bash …"   37 hours ago   Up 25 hours   0.0.0.0:3000->3000/tcp              project_file_web_1
cf035576b002   mysql:8.0.20       "docker-entrypoint.s…"   37 hours ago   Up 25 hours   33060/tcp, 0.0.0.0:3307->3306/tcp   project_file_db_1
```

以下コマンドを実行。(今回だと`docker exec -it project_file_db_1 bash`になります）

```terminal.
docker exec -it DBコンテナ名 bash
root@cf035576b002:/#root@cf035576b002:/#
```

すると`root@cf035576b002:/#`というのが出てくるので、`mysql -u root -p`を打ってEnter。
docker-compose.ymlで設定したパスワードを入力してEnterを押すと、MySQLと接続ができます。

```
 % docker exec -it project_file_db_1 bash
root@cf035576b002:/# mysql -u root -p
Enter password: ここにMySQLのパスワードを入力してください
```

welcomeされました。

```
Welcome to the MySQL monitor.  Commands end with ; or \g.
Your MySQL connection id is 25
Server version: 8.0.20 MySQL Community Server - GPL

Copyright (c) 2000, 2020, Oracle and/or its affiliates. All rights reserved.

Oracle is a registered trademark of Oracle Corporation and/or its
affiliates. Other names may be trademarks of their respective
owners.

Type 'help;' or '\h' for help. Type '\c' to clear the current input statement.

mysql> ここからMySQLにゴニョゴニョしていきます
```

`show tables;`でDBにあるテーブルを確認しようとしました。

```
mysql> show tables; #これでテーブルが見れるはずなのですが。
ERROR 1046 (3D000): No database selected #あれ..??
mysql> select * from users;
ERROR 1046 (3D000): No database selected　#あれ..??
```

#エラー出現！ ERROR 1046 (3D000): No database selected

とりあえずググって出てきた[この記事](https://techsupportwhale.com/mysql-error-1046-3d000-no-database-selected/)を参考に、対処します。

#エラー解決方法STEP1. use <database_name>;

データベース名画わからない場合は、`SHOW databases;`で一覧が出ます。

```
mysql> SHOW databases;
+--------------------+
| Database           |
+--------------------+
| app_development    |
| app_test           |
| information_schema |
| mysql              |
| performance_schema |
| sys                |
+--------------------+
6 rows in set (0.00 sec)
```

`use app_development`を実行。

```
mysql> use app_development
Reading table information for completion of table and column names
You can turn off this feature to get a quicker startup with -A

Database changed
```

okぽい。
`show tables;`します。

```
mysql> show tables;
+---------------------------+
| Tables_in_app_development |
+---------------------------+
| ar_internal_metadata      |
| letters                   |
| schema_migrations         |
| users                     |
+---------------------------+
4 rows in set (0.01 sec)
```

見られる様になりました！
Formオブジェクトパターンを理解するための前提①

Rubyファイルを自作
-

Railsの公式で最初から用意してくれているやり方で実装が難しいと感じた時には行いましょう。
RubyやRailsの仕組みをよく理解して、自作のクラスを作成しRailsに組み込むことで、さらに便利なプログラムを組むことが可能です。

デザインパターン
-

プログラムには必ず「実現したいゴール」があります。「こんなことがしたい」という要望に対して最適な方法や手順をまとめたものがデザインパターンです.


今回の実装の目的
-

・「1つのフォームから複数のテーブルにデータを保存する」
・「バリデーションやエラーメッセージの表示ができない」


使用デザインパターンは「Formオブジェクトパターン」
-

実装手順

|手順1|新たにmodelsディレクトリ直下にファイルを作成し、クラスを定義する|
|-|-|
|手順2|作成したクラスにform_withメソッドに対応する機能とバリデーションを行う機能を持たせる|
|手順3|保存したい複数のテーブルのカラム名全てを属性値として扱えるようにする
|手順4|バリデーションの処理を書く|
|手順5|データをテーブルに保存する処理を書く|
|手順6|コントローラーのnewアクション、createアクションでFormオブジェクトのインスタンスを生成するようにする|
|手順7|フォーム作成の部分をFormオブジェクトのインスタンスを引数として渡す形に変更する|
sketchupでruby その10

# 概要

sketchupでrubyやってみた。
練習問題やってみた。

# 練習問題

スプリングを作れ。

# 写真

![spring.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/18104/10d37111-ec08-43b8-6eb2-08ffd8536a02.png)


# サンプルコード

```

def spring
   turns = 5
   height = 24.0
   r = 12.0
   wireRadius = 1
   verticesPerTurn = 24
   circleRes = 24
   pts = Array.new
   model = Sketchup.active_model
   0.upto(verticesPerTurn * turns) do |i|
      af = (i % verticesPerTurn) / (verticesPerTurn * 1.0)
      angle = af * 6.283185307
      x = r * Math.cos(angle)
      y = r * Math.sin(angle)
      z = height * (i / (verticesPerTurn * turns * 1.0))
      pts[i] = [x, y, z]
   end
   spring = model.entities.add_curve(pts)
   v = Geom::Vector3d.new(pts[1].x - r, pts[1].y, pts[1].z)
   circleEdges = model.entities.add_circle pts[0], v, wireRadius, circleRes
   base = model.entities.add_face(circleEdges)
   base.reverse!
   base.followme(spring)
end


```

以上。
サーバーの判定方法

サーバーを判定する方法です。
>この方法は、ヘッダーに Server 情報を送ってくるサーバーでのみ使えます。

```bash
http example.com
```

Nginx の場合

```text
$ http example_nginx.com
HTTP/1.1 200 OK
Accept-Ranges: bytes
Connection: keep-alive
Content-Length: 1786
Content-Type: text/html
Date: Sat, 24 Apr 2021 02:36:18 GMT
ETag: "5ffa9561-6fa"
Last-Modified: Sun, 10 Jan 2021 05:49:21 GMT
Server: nginx/1.20.0
```

Apache の場合

```text
$ http example_apache.com
HTTP/1.1 200 OK
Accept-Ranges: bytes
Connection: Keep-Alive
Content-Encoding: gzip
Content-Length: 398
Content-Type: text/html
Date: Sat, 24 Apr 2021 02:37:17 GMT
ETag: "323-5c05b434b69d1-gzip"
Keep-Alive: timeout=5, max=100
Last-Modified: Mon, 19 Apr 2021 22:58:07 GMT
Server: Apache/2.4.41 (Ubuntu)
Vary: Accept-Encoding
```

gunicorn の場合

```text
$ http https://httpbin.org/get
HTTP/1.1 200 OK
Access-Control-Allow-Credentials: true
Access-Control-Allow-Origin: *
Connection: keep-alive
Content-Length: 298
Content-Type: application/json
Date: Sat, 24 Apr 2021 02:37:55 GMT
Server: gunicorn/19.9.0
```
辞書型のメソッド

```py
>>> d = {'x': 10, 'y': 20}
>>> d
{'x': 10, 'y': 20}
>>> d.keys()
dict_keys(['x', 'y'])
>>> d.values()
dict_values([10, 20])
>>> d2 = {'x': 1000,'j': 500}
>>> d.update(d2)
>>> d
{'x': 1000, 'y': 20, 'j': 500}
>>> d.get('x')
1000
>>> d['z']
Traceback (most recent call last):
  File "<stdin>", line 1, in <module>
KeyError: 'z'
>>> d.get('z')
>>> r=d.get('z')
>>> r
>>> type(r)
<class 'NoneType'>
>>> d.pop('x')
1000
>>> d
{'y': 20, 'j': 500}
>>> del d['y']
>>> d
{'j': 500}
>>> del d
>>> d
Traceback (most recent call last):
  File "<stdin>", line 1, in <module>
NameError: name 'd' is not defined
>>> d = {'a': 100, 'b': 200}
>>> d
{'a': 100, 'b': 200}
>>> d.clear()
>>> d
{}
>>> d = {'a': 100, 'b': 200}
>>> 'a' in d
True
>>> 'j' in d
False
```
Alt + F4 って押しにくいよね

### "Mac風に Ctrl + Q でウィンドウを閉じたい" 
とか、
### "CapsLock にショートカットキーを割り当てたい"  
といった願望をかなえるために作成したプログラムを公開しました。


https://github.com/starkora3/WinKeyHook

自分用に作成して、かれこれ10年ぐらい使用しているかな？

システムキーイベントを奪ってしまうので、
ご利用は自己責任でお願いします。
sketchupでruby その9

# 概要

sketchupでrubyやってみた。
skpを召喚してみた。

# 写真

![bed.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/18104/fe202dd5-3196-528a-e5ff-ec253a4624d8.png)


# サンプルコード

```

def bed
   model = Sketchup.active_model
   entities = model.active_entities
   point = Geom::Point3d.new 0, 0, 0
   transform = Geom::Transformation.new point
   path = Sketchup.find_support_file "Bed.skp", "Components/Components Sampler/"
   definitions = model.definitions
   componentdefinition = definitions.load path
   instance = entities.add_instance componentdefinition, transform
end

```

以上。
sketchupでruby その8

# 概要

sketchupでrubyやってみた。
add_ngon使ってみた。

# 写真

![ngon.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/18104/59088317-dc3d-d27c-6716-543eb33e8972.png)


# サンプルコード

```
def ngon
   ptc1 = [0, 0, 0]
   normal = [0, 0, 1]
   radius = 20
   r = 7
   h = 10
   model = Sketchup.active_model.entities
   polygon = model.add_ngon(ptc1, normal, radius, r)
   ngon_face = model.add_face polygon
   ngon_face.reverse!
   ngon_face.pushpull h
end


```

以上。
[Django初心者]DjangoでTodoリストを作成する

# 概要

Dajngoの基礎のアウトプットとして「Todoリスト」が挙げられます。

その手順をわかりやすく説明しています。

クラスベースで書かれているので、初学者でも簡単に作成することができます。

リンクだけ載せるようにするので、順番に手順通りやってみてください！

# リンク

https://chaldene.net/django-todolist-1

https://chaldene.net/django-todolist-2

https://chaldene.net/django-todolist-3

https://chaldene.net/django-todolist-4

https://chaldene.net/django-todolist-5

https://chaldene.net/django-todolist-6

https://chaldene.net/django-todo-update

https://chaldene.net/django-login

https://chaldene.net/pythonanywhere-deploy

# 最後に
今回はDjangoで「Todoリスト」を作成する手順のリンクをまとめました。
最初から順番にやればしっかり完成できるので、頑張ってください！
何か質問などがあればTwitterのDMなどから気軽に聞いてください！
VS codeの拡張機能自作時にTreeItemでcommandに引数を渡す方法

## はじめに
Jupyter Labの拡張機能で、サイドバーにTOCを追加してくれる[jupyterlab-toc](https://github.com/jupyterlab/jupyterlab-toc)という拡張機能があるんですけど、これがすごく便利なんですよね。

- TOCの項目を自分で設定できる (VScodeのアウトライン機能はごちゃごちゃしすぎです)
- 項目をクリックすることで移動できる (長いファイルを扱っているときは必須……)

VScodeで探しても同じような拡張機能が見つからなかったので、自分でも作ろうと思いました。

## TreeItem

サイドバーにTreeItemを追加するまでは[【VSCode】サイドバーランチャー的な拡張機能をつくる](https://wood-roots.com/web/tool-editor/2576)で分かったのですが、
項目に関数を設定する段階で困りました。

各Itemに設定できるpropertyの中には`command`と呼ばれるものがありますが、ここには**関数の名前をStringで入れます**。
そして**引数はargumentsに、Arrayの形で渡します**。
下記のScriptでObjectは

```javascript
class vsclauncherView {
	data() {
		return [{
            title: "見出し",
            command: "Command",
            arguments: [arg1, arg2],
            chldren : [{
                title: "小見出し"
            }]
        }];
	}
```

## 補足

ちなみに、VScodeの拡張機能でエディターの表示を上下に移動させる方法は`editor.revealRange()`です。

```javascript
const editor = vscode.window.activeTextEditor;
const lineInd = listNum || 1;
if (editor) {
    editor.revealRange(new vscode.Range(lineInd, 1, lineInd + 3, 1),
        vscode.TextEditorRevealType.InCenter);
}
```

## Reference

- [【VSCode】サイドバーランチャー的な拡張機能をつくる](https://wood-roots.com/web/tool-editor/2576)
- [manualized-toc](https://github.com/TomoTom0/manualized-toc-forVScode)
辞書

```py
>>> d = {'x': 10, 'y': 20}
>>> d
{'x': 10, 'y': 20}
>>> d['x']
10
>>> d['y']
20
>>> dict(a=10,b=20)
{'a': 10, 'b': 20}
>>> dict([('a',10),('b',20)])
{'a': 10, 'b': 20}
```
Seleniumサーバでリモートのブラウザを操作する (python)

記載日：2021/4/24
リモートのブラウザをSeleniumで操作する環境を試しに作ろうと思ったのですが、色々手間取ってしまったので忘れないように記載します。

#### 目標
　**WindowsマシンにインストールしたVirtualBoxでseleniumサーバ（Ubuntu）を起動し、ホストのWindowsマシンのブラウザを操作すること。**
　なお、SeleniumサーバとWindowsマシンとは、ホスト・オンリー・アダプタ経由で通信する。
　SeleniumのテストコードはPythonを用いる。
　システム構成やネットワーク構成は以下の通り。

![System.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1381309/0180340e-1f18-eab5-9262-5a5e4d8b299d.png)
![Network.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1381309/af591a8c-8a71-9f5f-b066-5d867263b0cf.png)


#### バージョン情報
　・Windowsマシン：Windows10
　・Seleniumサーバ：Ubuntu20.04
　・Python：3.8.5（pip：20.0.2）
　・Selenium：3.141.0
　・Selenium-Server-Standalone：3.9.1

#### 流れ
１．サーバ側で Selenium インストール。
２．クライアント側で WebDriver ダウンロード。
３．クライアント側で Selenium-Server-Standalone インストール。
　　Seleniumサーバからブラウザ操作までの道筋は、
　　　Seleniumサーバ　⇒　Selenium-Server-Standalone　⇒　WebDriver　⇒ ブラウザ
　　の流れ。
４．サーバ側でテストファイル作成。
５．テスト実行。

#### 作業
０．事前準備
　・WindowsマシンにVirtualBoxをインストールする。
　・Windowsにjavaをインストールする。
　・VirtualBoxでUbuntuマシンを立ち上げる。
　　ホスト・オンリー・アダプタの設定を行う。
　・UbuntuマシンにPython、pipをインストールする。

１．Seleniumのインストール
　・本章はUbuntuマシンで行う。
　・Seleniumサーバにプロジェクトディレクトリを作成する。
　　　`mkdir ~/Desktop/selenium`
　　　`cd ~/Desktop/selenium`
　・Seleniumをインストールする。
　　　`pip3 install selenium`

２．Selenium-Server-Standalone立上げ
　・本章はWindowsホストマシンで行う。
　・Selenium-Server-Standaloneをダウンロードする。
　　　https://www.selenium.dev/downloads/
　・WebDriverをダウンロードする。
　　※注意：適切なバージョンをダウンロードすること。
　・Selenium-Server-StandaloneとWebDriverを同一フォルダ下へ移動させる。
　　（WebDriverのパスを通した場合は、同一フォルダ下へ移動させる必要は無いと思います。）
　・Selenium-Server-Standaloneを起動する。
　　`cd C:\Users\xxx\Downloads\selenium`
　　`java -jar selenium-server-standalone-x.x.x.jar`

　　なお、Edgeも操作する場合は、以下のようにオプションを含めて実行する必要がある。
　　`java -Dwebdriver.edge.driver=msedgedriver.exe -jar selenium-server-standalone-x.x.x.jar`

３．テストコード作成
　・本章はUbuntuマシンで行う。
　・プロジェクトディレクトリ下に、テストファイルを作成する。
　　　`touch ~/Desktop/selenium/test.py`
　　ディレクトリ構成は以下のようになる。
　　　　selenium
　　　　　　|-　test.py
　・test.pyに以下コードを記載する。
　　なお、ホスト・オンリー・アダプタ―経由でUbuntuマシンから見たWindowsホストマシンのIPアドレスが10.0.2.2なので、以下コードで10.0.2.2と記載している。

```Python
from selenium import webdriver
from selenium.webdriver.common.desired_capabilities import DesiredCapabilities
driver = webdriver.Remote(
  command_executor='http://10.0.2.2:4444/wd/hub',
  desired_capabilities=DesiredCapabilities.CHROME
  # desired_capabilities=DesiredCapabilities.FIREFOX
  # desired_capabilities=DesiredCapabilities.EDGE
)
driver.get("https://[IPやドメイン]")
```

４．テスト実行
　・本章はUbuntuマシンで行う。
　・プロジェクトディレクトリ下のテストファイルを実行する。WindowsホストマシンのChromeが立上り、目的のサイトが表示される。
　　　`python3 ~/Desktop/selenium/test.py`

#### 参考にさせて頂いたサイト
・基本について
　https://www.selenium.dev/documentation/ja/
・Remote Web Driverについて
　http://unagi-tabetai.hatenablog.com/entry/2015/05/25/125030
・Edge対応について
　https://github.com/microsoft/edge-selenium-tools/issues/13
【Heroku】にデプロイできなくて最初からやり直した話

Vue.jsで作成したアプリをHerokuにデプロイできず最初からやり直しました。

#前提条件
・Herokuにアプリが作成されている
・デプロイがされていない

#アプリを削除

方法は2通りあります。

#Heroku側で削除

[https://id.heroku.com/login](https://id.heroku.com/login)にアクセスしてログインする。
削除したいアプリを選択して、settingの一番下にある「Delete app」を選択します。この時にアプリ名の入力を求められるので、アプリ名を入力して実行すると削除されます。

この時にgitにherokuのリポジトリが残ったままなので、こちらのコマンドを入力するとgitのリポジトリから削除されます。

```
$ git remote rm heroku
```

<br>

$ gitのリモートリポジトリからherokuがなくなっているのが確認できます。

```
$ git remote -v
```

#gitコマンドで削除

gitのコマンドからも削除できます。

```
$ heroku apps:destroy --app アプリ名
```
実行すると確認のためアプリ名を聞かれるのでアプリ名を入力して再度実行するとアプリが削除されリモートリポジトリからも削除されます。

##補足
--confirm アプリ名をつけて実行すると、アプリ名を求められません。

```
$ heroku apps:destroy --app アプリ名 --confirm アプリ名
```

この手順で最初からやり直せます。
【AWS】SCPとは？(SCPとIAMの違い)

#プログラミング勉強日記
2021年4月24日
[昨日の記事](https://qiita.com/mzmz__02/items/bbb3987a73f2fe817359)ではAWS Organaizationsについて説明している。

#SCPとは
　Service Control Policyの頭文字をとったもので、複数のAWSアカウントに対する権限の制御ができる。AWSアカウントまたは組織単位(OU)内のアカウントのグループに対してAWSサービスへの権限境界を設定できる。
　SCP自体は権限を与えるものではなく、「ここまでは許可できる」という境界を設定するもの。なので、AWSアカウントまたはOUに関連付けられているSCPが許可していないAWSサービスは、SCPに関連付けられているAWSアカウントまたはOUへのアクセスを拒否する。

#IAMとの違い
　SCPはIAMの境界設定と似ているが、IAMはAWSアカウント内のユーザを管理する。Organizationsは複数のAWSアカウント自体を管理する。
　SCPは組織単位でざっくりとした権限を明確に設定する。SCPを設定した組織の方では、許可・拒否された範囲においてIAMの方で個別に許可権限を与える。個別の設定はIAMで行う。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/642821/f0789035-6224-e14d-001f-53428aa7a758.png)
plunkerでopenjscad その6

# 概要

plunkerでopenjscadやってみる。
sandbox作ってみた。
テキストエリアに、コード書いて、ボタンで実行するやつ。

# 成果物

https://embed.plnkr.co/plunk/VMGkUZ513cDTdD9U


以上。
plunkerでopenjscad その5

# 概要

plunkerでopenjscadやってみる。
setcolor使ってみた。

# 写真

![無題.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/18104/bcaaeaf6-6ea8-ce5b-282c-d6d0ec66eaa4.jpeg)


# サンプルコード

```
function main() {
	var cube1 = CSG.cube({
		radius: 10
	});
	cube1 = cube1.setColor([0.8, 0, 0]);
	var cube2 = CSG.cube({
		radius: 10
	});
	cube2 = cube2.setColor([0, 0.8, 0]);
	cube2 = cube2.translate([5, 1, 4]);
	var result = cube1.subtract(cube2);
	return result;
}
```

# 成果物

https://embed.plnkr.co/plunk/0SNIfJKP8Piw2kIY

以上。
お問い合わせフォーム~JS側~


今回は、ユーザーがフォームの内容をsbmitつまり送信ボタンをクリック(イベント発生)したときに内容がサーバーに送信されるように実装していきます。
イベントのDOM動作を行います。


```index.js
 form.addEventListener('submit', e =>{
       
      });
```
コールバック関数とは、もとが名前のない関数であり、そのままでは使えないことになっています。そこで、使えるようにするために、関数の引数にして使います。これをコールバック関数と言います。
また、今回はアロー関数を使います。これは、function、関数名をかきません。アロー関数は主に、関数の引数に使用します。

```index.js
const btn = document.querySelector('[type="submit"]');
```
querySelectorでボタンの属性を取得します。定数、btnに代入。

```index.js
 btn.addEventListener('submit', e =>{
       const name = name.value;
       const mail= mail.value;
       const tell= tell.value;
       const password = password.value;
       const message = message.value;

       console.log(name,mail,tell,password,message);
       e.preventDefault();
      });
```
addEventListener(e,f)
イベントeが起きたときの関数を登録してくれます。

イベントターゲットには、Element,Document,Windowがあります。

①Elementはdocumentの中にある要素すべてを指します。
②Documentはブラウザーに読み込まれたウェブページを表します。
③Windowは DOM 文書を収めるウィンドウを表します。
VBScriptからAccessDatabaseFileにアクセスしたいときのコード例

# 困っていたこと

2021年も三分の一が終わりつつある昨今ですが、こんな時代にもかかわらずへーしゃではVBScriptでAccessのファイルをこちょこちょしたいみたいな話が出てきました。

で、色々とインターネットの海をさまよったのですが
「ADODBで接続文字列を組み立てて繋ごう」
「ODBCドライバつかって接続文字列で…」みたいな例が目立って散見されました。

接続文字列も別に悪くは無いんですが、嬉しくない点があります。

次の様な例で接続文字列を定義してやる必要があって、バージョンを明示してあげないとダメなんですよね…

```vb:接続文字列の例
"Provider=Microsoft.ACE.OLEDB.12.0;Data Source=" & ファイルパス & ";"
```

どちらかというとアプリケーションとしてAccess呼び出してそのAccessアプリケーションとやりとりできたらいいんじゃないの？という気がしていたのですが、綺麗にそれを実現したコード例がなかったので色々試した結果、意外に簡単にできる事が判明しました。

以下にコード例を置いておきます。

# コード例
VBSのファイルにドラッグアンドドロップしたり、送る(SendTo)に入れてAccessファイル(accdb、accdeとかmdbの拡張子になっているファイル)に対し、使うイメージで作っています。

```vb:コード例
Option Explicit

Sub Main()
    Dim objAccessAppli
    Dim objAccessDB
    Dim objAccessRS
    Dim AccessSQL
    Dim hogehoge_str
    Dim objFSO

    ''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''
    ' 起動時各種チェック
    ''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''
    '起動時引数チェック
    if Wscript.Arguments.Count <> 1 then
        msgbox "リリースするaccessファイルをこのスクリプトに送って下さい。" & vbcrlf _
             & "処理を終了します。"
        WScript.Quit
    end if

    Set objFSO = CreateObject("Scripting.FileSystemObject")

    ''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''
    ' Accessファイルオープン
    ''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''
    Set objAccessAppli = CreateObject("Access.Application")

    objAccessAppli.Visible = False
    objAccessAppli.AutomationSecurity = 1   'Accessのセキュリティダイアログ抑止

    objAccessAppli.OpenCurrentDatabase(Wscript.Arguments(0))
    set objAccessDB = objAccessAppli.CurrentDb()

    ''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''
    ' AccessファイルからSelectする
    ''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''
    set objAccessRS = objAccessDB.OpenRecordset("Select * From hogehogetable;")

    hogehoge_str = objAccessRS.Fields("hogehoge")

    ''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''
    ' AccessファイルにVersionを格納する
    ''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''
    AccessSQL = "UPDATE hogehogetable"
    AccessSQL = AccessSQL & " SET hogehoge = 'hogehoge';"
    objAccessDB.Execute(AccessSQL)

    objAccessAppli.CloseCurrentDatabase()
    objAccessAppli.quit

    objAccessDB.Close()
    set objAccessDB = nothing
    set objAccessAppli = nothing

End Sub

call Main()
```

# 補足
恐らくですが、ExcelVBAとかからAccessに繋ぎたい場合なども同様のコードで対応できると思います。
(Accessのアプリケーションがばーん！と上がってくるのが良いかどうかという問題は別途ありますが。)

なお、インターネットに散見される記事について。あまり明示的に書かれていなかった様な気がするので記載しておくと、Accessのオブジェクトモデル(≒データベースエンジン)に対して直接処理をするときは、昔のVB6とかの時代にあったDAO(Data Access Object)というライブラリがベースになっているはずで、今はADOという別のライブラリが主流なので狙って情報を探さないと探せないし、よくわからんなーってなってる人が多い印象です。

普通に「DAO」でググるとデザインパターンの方のDAOばっかり情報として引っかかるので、「DAO microsoft」みたいなキーワードでググると情報が出てくると思います。
【iOS】古いアプリのユニバーサル対応で最初に確認すること【初心者】

#古いアプリのユニバーサル対応で最初に確認すること

iOSアプリ初心者の私が、iPadで作られたアプリをiPhoneにも対応させようとしたときにちょっとハマった部分がありましたので、備忘録として残しておこうと思います。

##まずSafeAreaに対応させる

最初、ここにSafe Areaというのが表示されていない状態でした。あとあとConstraintsを付けるときに絶対必要になりますので、表示させておきます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/106969/09b9d4de-df63-ade3-55d8-7da844de5133.png)
やり方は、File inspectorのInterface Builder DocumentにあるUse Safe Area Layout Guidesにチェックを入れるだけです。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/106969/a9e9882e-ef4a-d54f-52ef-76f8d5316981.png)
##ナビゲーションバーをコードで表示させている場合
Attributes inspectorのSimulated MetricsにあるTop BarやBottom Barの設定を確認します。私の場合はNavigation Barを使用している画面なのに、ここの設定がInferredになっていました。不透過ナビゲーションバーの場合はOpaque Navigation Barを選択します。Bottomは使用していないのでNoneにしました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/106969/e9bdd0d7-f8ff-9ec5-0ac0-e425e51a81d8.png)
これはどうして必要だったかというと、ナビゲーションバーの高さがiPadとiPhoneとで異なっているのに、配置されているViewなどがSuperViewからナビゲーションバーの高さ分、固定でマージンを取ったConstraintsになっていたからです。ナビゲーションバーの直下に配置したパーツが、iPhoneで見るとナビゲーションバーに隠れてしまってました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/106969/0fc82c1a-3b13-c4d9-13f6-c27ec873f4ac.png)
Simulated MetricsでOpaque Navigation Barを設定すると、こんな感じにxib上でナビゲーションバーの線が見えるようになります。ここはSafe Area外となるので、ConstraintsをSafe Area基準でつけていけば、ナビゲーションバーと重なることはなくなるというわけです。

以上、知っている人からすればなんてことない当たり前の知識かと思いますが、初心者はハマりましたので同じく初心者の方のお役に立てれば幸いです。
「競プロ典型 90 問」のページに解説へのリンクを追加したりするChrome拡張機能

@e869120 さんがTwitterで投稿していた「競プロ典型90問」というコンテンツが、[AtCoderに追加されました](https://atcoder.jp/contests/typical90)。

解いていたら気づいたのですが、解説への導線がないのに気づきました。

解説へのリンクを追加するChrome拡張を作ったので、よければ使ってください。

# インストール

https://chrome.google.com/webstore/detail/typical90extension/olilmbfbgdnilofdfbladkgbbfecbidb

# 機能

## GitHubへのリンク追加
![キャプチャ.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/78100/5677ed5c-8bc2-e224-5dbe-c07035c47874.png)

* 「Problem List」をクリックすると[問題画像のリストページ](https://github.com/E869120/kyopro_educational_90/tree/main/problem)に飛びます
* 「Editorial List」をクリックすると[解説画像のリストページ](https://github.com/E869120/kyopro_educational_90/tree/main/editorial)に飛びます
* 「Code List」をクリックすると[コードのリストページ](https://github.com/E869120/kyopro_educational_90/tree/main/sol)に飛びます

## 【ver.1.2.0追加】問題を難易度順に並び替え

問題を難易度順に並び替えることができるようになります。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/78100/cf2a0d50-6bfc-0f03-0c44-2eb738c7185a.png)


# 要望・問題報告
もしなにかあれば、[GitHubのissue](https://github.com/taketakeyyy/typical90_extension/issues)によろしくお願いします。
カスタムCellに乗せたButtonのタップアクション

## はじめに
躓きやすいポイントだと思うので、記事に残しておきます。
いくつか方法があると思いますが、Delegateを使うパターンでいきます。

## 準備
#### CustomCellの作成
1. xibを作成して、TableViewCellの上にButtonを設置
2. Identifierを"Cell"に設定
![スクリーンショット 2021-04-24 10.12.49.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/253564/74197d63-6d43-6009-7c83-46ca533a84b0.png)

#### クラスの作成
``` Swift
class CustomCell: UITableViewCell {
    
    override class func awakeFromNib() {
        super.awakeFromNib()
    }
    
    override func setSelected(_ selected: Bool, animated: Bool) {
        super.setSelected(selected, animated: animated)
        
        
    }
    
}
```

#### セルのカスタムクラスを設定
![スクリーンショット 2021-04-24 10.16.55.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/253564/e99433f4-0c19-4c46-f458-7d584c613435.png)

#### ButtonをAction接続
``` Swift
class CustomCell: UITableViewCell {
    
    override class func awakeFromNib() {
        super.awakeFromNib()
    }
    
    override func setSelected(_ selected: Bool, animated: Bool) {
        super.setSelected(selected, animated: animated)
        
    }
    
    @IBAction func onButtonClick(_ sender: Any) {
        
    }
    
}
```

## Delegateを作成
``` Swift
//追加
protocol CustomCellDelegate {
    func customCellDelegateDidTapButton(cell: UITableViewCell)
}

class CustomCell: UITableViewCell {
    
    var delegate: CustomCellDelegate? //追加
    
    override class func awakeFromNib() {
        super.awakeFromNib()
    }
    
    override func setSelected(_ selected: Bool, animated: Bool) {
        super.setSelected(selected, animated: animated)
        
    }
    
    @IBAction func onButtonClick(_ sender: Any) {
        delegate?.customCellDelegateDidTapButton(cell: self) //追加
    }
}
```
## ViewController側からの呼び出し
``` Swift
class ViewController: UIViewController {
    
    @IBOutlet weak var tableView: UITableView!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        tableView.register(UINib(nibName: "CustomCell", bundle: nil), forCellReuseIdentifier: "Cell")
        tableView.dataSource = self
    }
}

extension ViewController: UITableViewDataSource {
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return 5
    }
    
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: "Cell", for: indexPath) as! CustomCell
        cell.delegate = self
        return cell
    }
}

extension ViewController: CustomCellDelegate {
    func customCellDelegateDidTapButton(cell: UITableViewCell) {
        //タップされたときの処理
        
    }
}
```

以上です。
FileMaker に JDBCとMyBatisで接続する

##私もつい最近JDBCやってみました

* Java8(Java1.8)
* FileMaker Pro 18 Advanced
* FileMaker Pro 19

と思ったら、既に記事を書かれている方がいました。

[FileMaker ServerからJDBCで検索する](https://qiita.com/megasys1968/items/25199d419a2274faace5)


私の場合はFileMakerServerは使わず、ローカルのFileMaker Proを立ち上げて、そこにJavaからlocalhost(127.0.0.1)で接続しました。

で、結果はというと、JDBCを直接使う場合は、ほぼ問題なし。

但し、MyBatisを使う場合には、色々問題が起こってしまいました。

com.filemaker.jdbc3.CommonJ3ResultSet.isClosed の例外発生

[FileMaker ServerからJDBCで検索する](https://qiita.com/megasys1968/items/25199d419a2274faace5)

こちらに書かれているのと同じ症状。

また不便だなと思ったのは、上記に書かれているのと同じ
「日本語のテーブル名やカラム名は"で括る必要がありました。」
の症状です。

##別の解決策があったので、ご紹介します。たまたま見つけました!

私が普段使っていたMyBatisは以下のバージョンです
* mybatis-3.5.3.jar

このバージョンを古くするのです。

* mybatis-3.4.6.jar

これで、isClosed問題は発生しなくなりました。

念のため、MyBatisのソースを見たのですが 3.4.6の頃は isClosedは
使っていませんでした。

最新ソースには isClosedが十数か所使ってありました。

どのバージョンのソースから、isClosedが使われるようになったのかは、まだ調べておりません

##今のところの私の結論

* JDBCからアクセスする予定があるFileMakerのDBは表名も、カラム名も英字にする
* 英字であれば、MyBatis Generatorは問題ありませんでした。
* そして、mybatis-3.4.6.jar を使う

##今のところの気に入らないところ

insert をしてみたのですがFileMakerの数字型がJavaではdoubleです。
double x = 4;
とかして、insertしたものをFileMakerで見ると
4.0 と見えてしまいます

# insertした後の主キーの取り出し方

PreparedStatement ps;
を使ってinsert した後、 
ResultSet rs = ps.getGeneratedKey();
を実行すると、どうも ROWIDが、帰ってくるようです。

ROWIDというのは、FileMakerの画面上は見えませんが、DBの裏で
１行毎につけられている連番のようなものです。

それを使って、もう一度 Selectを投げると、insertした時、自動発番された
主キー(UUID)がとりだせました

Select table01_pk From Table01 Where ROWID=?

(かなり面倒ですね。Java からは、あまりInsertしない方が良さそうです)
タプルのアンパッキング

```py
num_tuple = (10, 20)
print(num_tuple)

#タプルのアンパッキング
x, y = num_tuple #xとyにそれぞれ10,20が入る
print(x, y)

#タプルのアンパッキングを利用した変数の入れ替え
i = 10
j = 20
i, j = j, i
print(i, j)
```
実行結果：

```txt
(10, 20)
10 20
20 10
```
UbuntuにmongoDBをインストールしてリモートアクセスでデータを登録する

# 環境
- サーバー：
    - [NVIDIA JETSON AGX XAVIER](https://www.nvidia.com/ja-jp/autonomous-machines/jetson-agx-xavier/)
    - os：Ubuntu 18.04 LTS
- クライアント：
    - 普通のデスクトップPC
    - os：windows 10

# 背景
IoTやAIなどで大量データを扱うシーンがこれから増えてくると思います。
しかし、従来の業務システムで使われてきたRDBでは大量データを扱おうとすると、
高いマシンスペックや高い専門性を要するチューニングが必要になります。
そこで、比較的ロースペック（あくまでも比較的）でそれほど専門的なチューニングをしなくても大量データを高速で扱えるNoSQLがこれから重要になります。
本記事では、NoSQLの一つであるMongoDBのインストールからデータの登録までを説明します。


# 手順
1. [MongoDBのインストール](#mongodbのインストール)
1. [サービスの開始・終了](#サービスの開始と終了)
1. [サーバー側でのMongoShellの起動](#サーバー側でのmongoshellの起動)
1. [リモートアクセスを許可する](#リモートアクセスを許可する)
1. [クライアント端末からのMongoShellの起動](#クライアント端末からのmongoshellの起動)
1. [DB作成](#db作成)
1. [collection作成](#collection作成)
1. [collectionにデータを登録する](#collectionにデータを登録する)
1. [MongoDBのアンインストール](#mongodbのアンインストール)

### mongodbのインストール
ターミナルから下記コマンドを実行することでMongoDBがインストールできます。

```
sudo apt-key adv --keyserver hkp://keyserver.ubuntu.com:80 --recv 9DA31620334BD75D9DCB49F368818C72E52529D4
echo "deb [ arch=amd64 ] https://repo.mongodb.org/apt/ubuntu bionic/mongodb-org/4.0 multiverse" | sudo tee /etc/apt/sources.list.d/mongodb-org-4.0.list
sudo apt-get update
sudo apt-get install -y mongodb
```

- 参考
    - https://lab4ict.com/system/archives/1137

### サービスの開始と終了
ターミナルから下記コマンドを実行することでMongoDBのサービスを開始できます。

```
sudo service mongodb start
```


状態を確認したいときは下記コマンドを実行します。

```
sudo service mongodb status
```


サービスを終了したいときは下記コマンドを実行します。

```
sudo service mongodb stop
```

### サーバー側でのmongoshellの起動
MongoDBのサービスを開始している状態で下記コマンドを実行することでMongoShellが起動できます。
collectionの作成やデータ登録などはMongoShellから実施します。
なお、MongoDBのサービスの状態は先述のコマンドにて実施します。

```
mongo
```

### リモートアクセスを許可する
リモートアクセスする場合は下記サイトに設定下さい。
リモートアクセスが不要な場合は本処理は不要です。

- 参考
    - [Mongodb への外部接続を許可する](https://qiita.com/Chanmoro/items/cbf4e451d0a89f4d7c1a)

### クライアント端末からのmongoshellの起動
クライアント端末からMongoShellを起動するには下記コマンドを実行します。

```
mongo <URL>
```

### DB作成
MongoShellにて下記コマンドを実行することで、データベースを作成できます。

```
mongo <db名>
```

※下記のようなメッセージが出力されますが気にしないでください。

```
2021-04-24T10:14:40.368+0900 E QUERY    [thread1] SyntaxError: missing ; before statement @(shell):1:6
```

次に、下記コマンドを実行して使用するデータベースを切り替えます。

```
use <db名>
```

なお、下記コマンドを実行することでデータベースの一覧が確認できますが、collectionが作成されていないデータベースは表示されません。従って、データベース作成直後はこの一覧には出力されないのでご注意ください。

```
show dbs
```

### collection作成
MongoShellにて使用するデータベースを切り替えた後、下記コマンドを実行することで、collectionを作成できます。

```
db.createCollection('<collection名>');
```

MongoShellにて下記コマンドを実行することで、collectionの一覧が出力できます。
ここでは、先ほど登録したcollectionが出力されます。

```
show collections
```

### collectionにデータを登録する
MongoShellにて使用するデータベースを切り替えた後、下記コマンドを実行することで、collectionにデータを登録することができます。

```
db.<collection名>.insert(<json形式ならOK>)
```

登録したデータは下記コマンドにて確認できます。

```
db.<collection名>.find()
```

### mongodbのアンインストール
ubuntuのターミナルから下記コマンドを実行することでMongoDBのアンインストールが出来ます。

```
sudo apt-get purge mongodb
sudo rm -r /var/log/mongodb
sudo rm -r /var/lib/mongodb
```
オルンシュタイン＝ウーレンベック過程について調べてみた

#オルンシュタイン＝ウーレンベック過程を使用したノイズの振る舞いについて調べてみた。

強化学習アルゴリズムの一つDDPG(Deep Deterministic Policy Gradien)の解説[Continuous control with deep reinforcement learning](https://arxiv.org/abs/1509.02971)のなかで オルンシュタイン＝ウーレンベック過程(**Ornstein-Uhlenbeck process**)が探索のためにノイズ(以降 **OUノイズ**)として使われている。


 - DDPGの実装はWebに沢山挙げられており、OUノイズを採用したものはほぼ同内容の実装がされている。
 - OUノイズには　$\theta$, $\mu$,$\sigma$ の3パラメータがある。今回、オルンシュタイン＝ウーレンベック過程と3パラメータのouノイズでの役割について調べた。
 
### オルンシュタイン＝ウーレンベック（Ornstein-Uhlenbeck Process）過程とは
3つのパラメータについて知りたい人はここを飛ばしてください。
**1.確率過程**
確率過程とは $X$が確率変数であり、タイムステップで起こる$X_1,X_2 \cdots X_t $　が並んだ列。

以降は$X$はある1ステップでの動点の移動、時刻 $ｔ$ での動点位置を$x_t= \sum_{k=1}^tX_k$として話を進めます。

**2.ウィーナー過程 $W$**
時刻ｔでの$x_t$からの微少変化を考えたとき、ある正の定数 $\sigma$ に対して　$\Delta x= \sigma\sqrt{\Delta t}$　を満たしつつ　　$\Delta x \rightarrow 0$,$\Delta t \rightarrow 0$で　$x_t$ が近づく分布をウィーナー過程 $W$と呼ぶ。

**3.オルンシュタイン＝ウーレンベック過程**
ウィーナー過程$W$の一つ。 
${U(t)} = e^{-\mu{t}}W(\frac{\sigma^2{e^{2\mu{t}}}}{2\mu})$ で定められる。
Ornstein-Uhlenbeck 過程は平均　${0}$ 分散 $\frac{\sigma^2}{2{\mu}}$ の正規分布 $N(0,\frac{\sigma^2}{2{\mu}})$ に従う。

##OUノイズの振る舞い

本題. 上で書いた式のままではある時刻$t$の動点位置 $\ x_t$ は計算できない。実装で使われている式は[Wiki:Euler–Maruyama method](https://en.wikipedia.org/wiki/Euler%E2%80%93Maruyama_method)で導出されています。

実装されている式は $dX(t)=\theta \cdot{(\mu-X_t)}dt+\sigma W(t)$  　　$(X_0 = X_{init})$

[Wiki:Euler–Maruyama method](https://en.wikipedia.org/wiki/Euler%E2%80%93Maruyama_method)に記載されているPython実装を使用して各パラメータを変化させてみました。

- $\theta$: 0.1, 0.1, 1.0 と変化させました。$x_{t-1}$と$x_t$での振れ幅を保ったまま全体の変動が変化します。
![thta.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/489806/f6dc5bfe-c732-e20c-e1f8-6c119a0c710f.png)
- $\mu$: 1.0,1.5,2.0 と変化させてみました。漸近平均が$\mu$に近づきます。
![mu.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/489806/c72204e4-95ac-76df-6a00-1e479c90bc42.png)
- $\sigma $:0.1, 0.5, 1.0 と変化させました。ノイズの変動が変化します。
![sigma.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/489806/da1f22c3-2b91-3b21-b6cd-f8f3ee3d6aff.png)

##終わりに
[Continuous control with deep reinforcement learning](https://arxiv.org/abs/1509.02971)を参考にしたとき探索ノイズのふるまいが気になったので調べてみました。
記事内の数学的な表現はイメージを伝えたいために記載したもので厳密ではありません。
参考にした書籍[	数学のかんどころ 【26】
確率微分方程式入門―数理ファイナンスへの応用― ](https://www.kyoritsu-pub.co.jp/bookdetail/9784320110670)もしくは他の書籍を参考にして頂きたいです。
DjangoのDateTimeFieldのorder_byについて

これは、自分の備忘録として記録しています。

# ListViewで目的にあった一覧表を作りたい。

今回作りたかった表は次のようなもの

|id| date | group |
|:-:|:-:|:-:|
| 1 | 2021年04月01日（木）09:34:09 | A  |
| 2 | 2021年04月01日（木）13:19:04 | A  |
| 3 | 2021年04月01日（木）12:32:05 | B  |
| 4 | 2021年04月01日（木）12:32:58 | B  |
| 5 | 2021年03月31日（水）09:34:09 | A  |
| 6 | 2021年03月31日（水）13:19:04 | B  |

```python:models.py
    # 必要なところだけ抜き出しています。
    # idはprimary keyとして生成されるものなので固定値

    date = models.DateTimeField(verbose_name='登録日', default=timezone.now)
    group = models.CharField(verbose_name='担当グループ', max_length=32)
```

「目的の順番に並べ替えるには、登録日、担当グループでorder_byすれば良さそう。」

```python:views.py
            order = ('date', 'group',)
            return Report.objects.all().order_by(*order)
```

とでやってみると

| id | date | group |
|:-:|:-:|:-:|
| 1 | 2021年04月01日（木）09:34:09 | A  |
| 3 | 2021年04月01日（木）12:32:05 | B  |
| 4 | 2021年04月01日（木）12:32:58 | B  |
| 2 | 2021年04月01日（木）13:19:04 | A  |
| 5 | 2021年03月31日（水）09:34:09 | A  |
| 6 | 2021年03月31日（水）13:19:04 | B  |

できているようで、思ったものと違う（1,3,4,2）。

しばらく悩んだ末、DateTimeFieldなので、時刻も含んだ形でグルーピングされてしまうためだと気づいた。
同一時刻であれば思ったように表示されるが、そうならないのが現状。

つまり、DateTimeFieldの値から、日付部分でグルーピングできれば思った形にできそう。

```python:views.py
            order = ('date__date', 'group',)
            return Report.objects.all().order_by(*order)
```

というようにQueryset filterを使って**date__date**としてやれば、第一グループはDateTimeFieldの日付部分のみでorder_byされるようになり、思った形の一覧表が出来上がった。
タプル

```py
>>> t = (1,2,3,4,1,2)
>>> t
(1, 2, 3, 4, 1, 2)
>>> t[0] = 100
Traceback (most recent call last):
  File "<stdin>", line 1, in <module>
TypeError: 'tuple' object does not support item assignment
>>> t[-1]
2
>>> t[2:5]
(3, 4, 1)
>>> t.index(1)
0
>>> t.index(1,2)
4
>>> t.count(1)
2
>>> t = ([1,2,3],[4,5,6])
>>> t
([1, 2, 3], [4, 5, 6])
>>> t[0]=[1]
Traceback (most recent call last):
  File "<stdin>", line 1, in <module>
TypeError: 'tuple' object does not support item assignment
>>> t[0][0]
1
>>> t[0][0]=100
>>> t
([100, 2, 3], [4, 5, 6])
>>> t=1,2,3
>>> t
(1, 2, 3)
>>> type(t)
<class 'tuple'>
>>> t=1,
>>> type(t)
<class 'tuple'>
>>> t
(1,)
>>> new_tuple=(1,2,3)+(4,5,6)
>>> new_tuple
(1, 2, 3, 4, 5, 6)
```
postgresqlのDBを作成してTablePlusで確認するまで

```
brew install postgresql
```
homebrewでpostgresqlをインストール

```
sql —-version
```
インストールできていれば、バージョンが表示される

```
brew services start postgresql
```
postgresqlをスタートする

```
createdb test
```
testという名前でDBを作成する

```
psql -l
```
DBが作成されていれば、DB名が表示される

```
psql test
```
testデータベースに接続することができる。このコマンドを実行すると、コマンドでtableを作成したりする事ができる。

```
test=#
test=# create table tet (
test(# id integer,
test(# name varchar(10)
test(# );
CREATE TABLE
```

テーブルが作成される。

```
test=# create role test login password 'test'
test-# ;
CREATE ROLE
```

上記のコマンドでユーザーを作成する。

```
test=# \d
        List of relations
 Schema | Name | Type  |  Owner
--------+------+-------+---------
 public | tet  | table | masashi
(1 row)
```
テーブルが作成できていれば、\dコマンドで確認する事ができる。

```
test=# \q
```
postgresqlを終了する。

```
brew services stop postgres
```
postgresql自体を停止する。


※必要であれば、以下を実行して、postgresqlの設定を書き換える。

```
cd /usr/local/var/postgres
```

```
vi postgresql.conf
```
vimで設定ファイルを開き、以下の部分のコメントアウトを外す。

```
listen_addresses = ‘localhost’
~
port=5432
```


```
brew services start postgresql
```

上記のコマンドを実行し、サービスを開始し、tableplusで接続を試みる。


・TablePlusの設定

create a new connectionをクリックし、postgresqlを選択

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/436942/d365de1f-3946-f4d3-9317-c8fd5e871ac5.png)
create a new connectionをクリックし、postgresqlを選択

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/436942/11d40c29-edb9-7be1-1092-2eead7b2e675.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/436942/10f66e17-a333-b90b-7766-51e787c5ef80.png)