OmniAICreator/Qiita-1.07M huggingface dataset:
PHP5上級試験/準上級試験の上級合格に挑戦(3)　３章関数中編

# 前回
[上級Ⅱ3章関数前編](https://qiita.com/Atsulabo/items/1697299314441ff22105)

+ 副作用をもつ関数
+ 関数表記方法・変数との表記方法の違い

# スコープ
+ グローバル（つまり関数の外側）スコープ・関数レベルのスコープ
+ マクロで言う、Public/Private
+ 関数内から、外にある変数にアクセスしたいときは<b>global</b>を使う
+ ここからの出題は、スコープを使って出力がどうなるかを問う問題が多い

# スコープに関する問題
さて、下記は1を出力するか否か？

```index.php

function test() {
  $x = 1;
 }
$x = test();
echo $x; 
```

# 解答
正解は、「何も出力しない」
なぜなら、　関数内で、$x = 1を出していてもそれを関数の外に出す処理をしていないため
外側の$xには何も値が入らないからである。

正確には、下のように書けば、１が出力される。

```index.php

function test() {
  $x = 1;
  return $x;
 }
$x = test();
echo $x; 
```
つまり、「<b>return</b>」で、＄ｘを外に出せるようになるということ。

# スコープに関する問題２
さて、下記は1を出力するか否か？

```index.php

function test() {
  global $x;
  echo $x;
 }
$x = 1;
test();
```
# 解答
正解は「Yes」
functionは本処理の前でも後ろでもどこにおいてもOK。（今回は前においてる）
ただし、処理の順番は本処理からで、＄ｘ＝１がはいり、test()をコールする、という順番になる。
関数の外で$xに１が代入され、その後にtest()をコール。
globalがついているので、関数内の＄ｘには１が入る。
それを出力するので１となる。
　　　　　　　　　　　　　　　　※

こんなふうに出題されるときは、スコープ変換、returnのあるなしによって値が入るかどうかを見る問題が多いです。

#　スタティック（静的）変数
+ 関数内の変数は関数の呼び出しが完了したら消える
+ それを防ぐのがstaticキーワード。関数呼び出し後も変数の値を保持する
+ ただし、staticキーワードがついた関数の代入は最初の呼び出しのときだけ

さて、以下の出力は何になるか？
答えを見る前に考えよう　（問題以下にちょっと空白入れます）

```index.php

function test() {
  static $x = 0;
  $x++;
  echo $x,"\n";
 }
test();
test();
test();
```
　
　
　
　
　
呼び出されるのは$xだが、１回目は0から１に変化。
<b>staticの場合、その（親）関数の最初の呼び出しのときだけ変数の代入が行われる</b>
そのため２回めに呼び出されたときは、staticで$xは０に初期化されない。
そのため、結果は、下記の通り、

１
２
３

というような文字が出力される。（\nは「改行」。なければ１２３に）
これが大原則。

問題としては、複数のスタティック変数を用意し、処理結果が何になるかという応用問題が考えられる。
というわけでちょっと作ってみた。

さて、以下の出力は何になるか？
答えを見る前に考えよう。

```index.php
static $y = 10;
function test() {
  static $x = 0;
  global $y;
  $x++;
  $y++;
  echo $x."<br>";
  echo $y. "<br>";
 }
test();
test();
test();
echo $x."<br>";
echo $y;
``` 
自分で適当にやっててこんな凶悪な、もとい、応用問題作れると思わなかった。
ですがこれは解きがいがあっておもしろい。

まず大原則として、プログラムは上から下へ流れるという性質がある。

したがって、１行目のstatic変数$y＝１０；は
グローバル・スタティックな変数としてまず認識される。

つぎの行はfunctionなので、とばしていくと、test()が３回ある。
test()を３回繰り返すということ。

では次にfunction内で、test()の中身を。
static変数＄ｘが定義され、＄ｘの値は０。
次に、globalでグローバル変数＄ｙへアクセス可能に。
ここで＄ｙには10が入る。
つぎに＄ｘと＄ｙにそれぞれ１ずつ足す。　それぞれ１と、１１。
それらがエコー。
それを２回繰り返す。ただし、staticは最初の１回だけなので、ここは無視される。
そしてそれぞれ２回繰り返されるので２と１２，３と１３がでる。
つぎにグローバルで、＄ｘをエコーするが、
＄ｘは関数の中だけの変数なので、＄ｘは何も入っていないため空白が出力。
＄ｙはグローバル変数でかつ、関数内にアクセスされ、＋３されたので、１３が出力

というわけで答えは、

1
11
2
12
3
13
（空白）
13

となる。

# 記事作成の裏側
上記の問題を実際にコードで書いて実行してみたら、エラーになってしまって、修正をしていたが、
＄ははいってる、；もある、なぜだ。。。とドツボにハマった。
結局はコードの前のスペースが半角ではなく全角スペースになっていたから。
Qiitaだとタブがきかないので、スペースで入れるが、時々半角にするの忘れて全角で入れるミスがある。
気をつけたい。
こういうこともあるのだなということで共有。
次回は、値渡しと参照渡し、パラメータのデフォルト値、可変関数、匿名関数、言語構造になる。
AWS SessionManager（セッションマネジャー)でEC2に接続出来ない時に確認するポイント

# 要約
- 適切なロールをつけてもセッションマネジャーでEC2に接続出来ない。
- 正しいAMIを使用しているのにセッションマネージャーでEC2に接続出来ない。
- これでハマりましたので、メモを記載します。

# 確認する点
- EC2のIAMロールに「AmazonSSMManagedInstanceCore」が割り当てられている事。
- **Private SubnetにEC2を配置している場合、そのPrivate Subnetの「ルートテーブル」に「NAT Gateway」が関連付けされており、インターネットの手口が確保されていること。**

簡単ですが、以上です。
ConvertFromFileMakerPath

こないだ感動した話を少ししたいと思います。

FileMakerを利用しているとEventを送信やその他でもデスクトップパスやドキュメントパスを変換するシーンが多々あります。

？？？？
ないか。

まぁそういう事は一旦置いておき、自分にはあったのです。
私はWindowsユーザーなので非常に助かったので残しておきます。

今まで、Get（デスクトップパス）で引っ張ってき、￥に置換える処理がありました。

例えば、

```
Substitute ( Get ( デスクトップパス )  ; "/" ; Char ( 92 ) ) 
```

この様な処理の上で、もう少し加工をする必要がありました。
強調しますが、もう少し加工が必要です。

 Char ( 92 ) は自分がかっこつけて使ってるだけです。
かっこつけてごめんなさい。下記でも同じ結果が返ってきます。

```
"\\"
```

これでもいいです。エスケープ現象があるので、それだけ注意が必要です。
ASCIIコードって響きがいいですよね。←こないだ読み方覚えた。チンパンジー脳みそのワイ。
 Char ( 32 )はスペースなので、こういうのも活用できますね。

https://www.kanaya440.com/contents/script/vbs/others/ascii1.html

自分的に見やすかったです。


FileMaker19からはこんな処理が不要。

```
ConvertFromFileMakerPath ( Get ( デスクトップパス ) ; WinPath )
```

たったこれだけで、全て解決。
そして加工ももういらない。
なんて素敵なんだ。

っていう話でした。

色々活用方法があると思います。
FileMaker19からの関数なので、19以前ならバージョンアップをするか、加工するかが必要です。
今までやってこられた方は加工する方が慣れてらっしゃるんでしょうね。
こないだやってみて腰抜けたわ。


現場からは以上です。
Wordpress 子記事を無限階層辿る

# 追記、それっぽいのがありました
https://wpdocs.osdn.jp/%E9%96%A2%E6%95%B0%E3%83%AA%E3%83%95%E3%82%A1%E3%83%AC%E3%83%B3%E3%82%B9/get_children
get_children()。子供記事持ってるか？チェックくらいならこれがお手軽ですね。。

# get_ancestorsの逆が欲しい
親記事IDをもとに、所属する子供を辿りまくりたい。
子記事の親を辿りまくるのはget_ancestorsという便利なものがあるがその逆がない。検索しても引っかからない。
どういうときに使うのか。
子ども記事が条件を満たしている場合のみ、表示するケースに必要になった。
親から辿るコードを書くとどうしても何段階まで、という記述になりがちだしコードも重複が増えたりする。
別に逆順でもシステム構築はできるケースもあるだろうが、、記事をまとめて特別にシュリンクして表示したい要件とか、意外と面倒な処理が必要だったりする。

# 再帰が最適かどうか悩んでるうちにできたもの
再帰はそれほど見かけないし、なじみがないので読み解くときカロリーが必要だったりする。
ただ、手が動いてなんとなくできた再帰型を掲載。

```php:untara.php
$args_base = array(
    'numberposts'      => -1,
    'post_type'        => 'page',
    'post_parent'        => 0,
);
$mposts = get_posts($args_base);
global $_ret;
global $func_get_familyline;
$func_get_familyline = function($_mposts) {
    global $_ret;
    global $func_get_familyline;
    $args = array(
        'numberposts'      => -1,
        'post_type'        => 'page',
    );
    foreach ($_mposts as $_mpost) {
        $args2 = array(
            'numberposts'      => -1,
            'post_type'        => 'post',
        );
        $args2['meta_query'] = array();
        $args2['meta_query'][] = array(
            'key'     => "belong_page",
            'value'   => $_mpost->ID,
            'compare' => '='
        );
        $myquerytmp = new WP_Query();
        $myquerytmp->query($args2);
        if ($myquerytmp->found_posts) {
            $_ret[$_mpost->ID] = get_posts($args2);
        }
        $args["post_parent"] = $_mpost->ID;
        $func_get_familyline(get_posts($args));
    }
};
$_ret = array();
$ret = $func_get_familyline($mposts);
```

ページに紐づく投稿が存在する場合のみ、投稿を収集する。
ページの孫やひ孫玄孫までどこまでもpost_parentをたぐって検索する。というような意図。
再帰は引数をちょっと変えて自分を呼びなおすとこだったり、
結果はグローバルで初期化しないと意図しない感じになったり、まあコツがありそう。

美しくない・・ブラッシュアップしたい・・
ただ、コード行数は1/3になったので、まあ。。徐々にね…
子記事まで、孫記事までって決まってるケースでも、やっぱりシステムとしては無限に追えるようにしときたいときにどうぞ。
【Rails】 画像の複数投稿


はじめに
---
今回は、初めて実装した複数画像投稿の機能につきまして、自身の備忘録として、またこれから実装する初心者の方の参考になればと思い投稿していきたいと思います。

（参考記事）
・refileの基本と複数画像のアップロード
https://qiita.com/nekosuke_/items/501e7ba1b286c51c1be9
<br>

開発環境
---
ruby 2.6.3
Rails 5.2.4.4
<br>

見本（投稿のためアップロードした画像）
---
※画像自体に背景が無いので少し分かりづらいかもしれません。申し訳ありません。
![スクリーンショット 2021-02-16 10.53.55.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/942338/d58d8f4d-5caa-5306-d4d2-870f2e7c99c2.png)



今回使用するモデル
---
口コミサイトのように店舗情報を掲載させるということが目的でしたので、モデルはShop、ShopImage（その店舗の複数画像をアップする用）で実装しております。
また店舗情報のカラムは、最小限に省略させていただいております。

|モデル名|カラム名|
|:-- |:--    |
|Shop|id     |
|    |name   |
|    |caption|


|モデル名|カラム名|
|:--        |:--     |
|Shop_image |id      |
|           |shop_id |
|           |image_id|
<br>

gemをインストール
---
※refile: アプリケーション向けのファイル・アップロードのライブラリ。
※refile-mini_magick： 画像のサイズを変更するためのもの。

```Gemfile.
gem "refile", require: "refile/rails", github: 'manfe/refile'
gem "refile-mini_magick"
```
```terminal.
$ bundle install
```
<br>

モデルを作成
---
複数画像用のモデルを新しく作成し、マイグレーションへ反映させます。

```terminal.
$ rails g model Shop name:string caption:text
$ rails g model ShopImage shop_id:integer image_id:string
$ rails db:migrate
```
```db/schema.rb
ActiveRecord::Schema.define(version: 2021_02_16_101010) do

  create_table "shops", force: :cascade do |t|
    t.string "name", null: false
    t.string "caption", null: false
  end

  create_table "shop_images", force: :cascade do |t|
    t.integer "shop_id", null: false
    t.string "image_id", null: false
  end

end
```
<br>

モデルファイルの編集
---
```models/shop.rb
class Shop < ApplicationRecord
  has_many :post_images, dependent: :destroy
  accepts_attachments_for :post_images, attachment: :image
end
```

```models/shop_image.rb
class Post < ApplicationRecord
  belongs_to :shop 
end
```
<br>

コントローラーの設定
---
private以下のパラメータの記述の中に複数画像の情報、shop_images_images: []を追加します。複数画像を投稿する場合は、配列として渡す必要があります。→ []

```shop.contorller.rb

  def index
    @shop = Shop.all
  end

  def new
    @shop = Shop.new
  end

  def create
    @shop = Shop.new(shop_params)
    @shop.save
  end

  private
  def shop_params
    params.require(:shop).permit(:name, :caption, shop_images_images: [])
  end
```
<br>

Viewの作成
---
店舗情報を追加するための入力フォーム画面です。
複数画像の投稿には、「multiple: true」こちらの記述を加える必要があります。

```shops/new.html.erb
<%= form_with model: @shop, url: shops_path, local: true do |f| %>
　<%= f.label :"店舗名"%>
　<%= f.text_field :name %>
　<%= f.label :"店舗画像"%>
　<%= f.attachment_field :shop_images_images, multiple: true %>
　<%= f.label :"紹介文"%>
　<%= f.text_area :caption %>
<% end %>
```

先ほども補足で記載しましたが、複数画像は配列として取得する必要がありましたので、each文で全店舗の中から１件の店舗情報を取得し、そこから１件の店舗情報に紐づく複数の画像を更にeach文で配列として取得する形になります。

```shops/index.html.erb
<% @shops.each do |shop| %>
　<%= shop.name %>
　<%= shop.caption %>
　<% @shop.shop_images.each do |shop_image| %>
　　<%= attachment_image_tag shop_image, :image, size: "130x130" %>
　<% end %>
<% end %>
```

こちらの手順で、先ほどの見本のような複数投稿が可能になりました！


終わり
---
今回は以上になります。
私自身もプログラミング初心者ですが、同じ様な立場の方に少しでも参考になれば幸いです。
また、もし内容に誤りなどがございましたら、ご指摘いただけますと幸いです。
(メモ)pythonでの処理速度出力

# 概要

pythonにて、処理速度を計測したい時に、簡単に試せる方法のメモ。

`time`ライブラリを使用。

## 実装

```python
import time
# 処理前の時刻
t1 = time.time() 

# ここに処理を入れる。

# 処理後の時刻
t2 = time.time()

# 処理速度の出力
print(f"処理時間：{t2-t1}")
```
Power BI を Azure SQL DB に接続していい感じに分析する

# はじめに
PowerBIをAzure SQL DBに接続すると、溜めたデータをかなり簡単に分析することができたので設定方法を紹介します。

BI系のールって個人的に正規化されたDBとかに接続しにくいんだよな～と食わず嫌いしていたのですが、やってみると超便利でした。


さっそく、PowerBIの設定から記載していきます。

# データソースを選択する
Power BI Desktop を起動して初めに出てくる画面で「データを取得」→「詳細」→「Azure SQL  DataBase」を選択して接続します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/489752/e597a8b5-2698-9529-a19a-4ea34b99c804.png)

接続先のデータベースの情報を入力します。
今回、"データ接続モード" は DirectQuery を選択します。
これを選択することで "SQLステートメント" に記載した任意のSQLでDBに接続できます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/489752/41402cbf-04db-1ed4-20a4-303c5e5b16c4.png)

# 任意のSQLで取得したデータを分析する
接続すると任意のSQLで取得したデータがデータのフィールドに出てくるので、それを使ってグラフとか作っていくだけです。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/489752/1201c71c-6876-03d7-0d5f-9faf3dc685ee.png)

今僕の所属する組織では日報データ（誰がどんな作業をいつやったのか）をAzure SQL DBに蓄積しています。
入力のUIはWEBアプリなのでDBは完全に正規化されているのですが、今回の方法を使うと3分くらいでこんな感じのグラフが作れて動的に分析することができました。

![キャプチャ.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/489752/e82d7609-845c-cc51-648f-0550c42044b0.png)


# さいごに
たぶん、ゴリゴリSQLを書くのが好きな人はこのやり方をするとハッピーになれるのではないかと思います！

というかたぶん、BIツールは"いかにして整理しやすいデータセットをつくれるか"が重要になると思うので個人的にこのやり方おすすめです！
tarコマンドよくつかうオプションまとめ

# 概要
(個人的に)よく使う`tar`コマンドのオプションをまとめました。

# `tar`コマンドとは
アーカイブファイルを作成・展開するコマンド。

一般的なWindowsにおけるファイル操作で、右クリックなどで"ファイルを圧縮・展開する"という動作を、
実行できるLinuxコマンドという認識。

# ファイルを圧縮する基本コマンド

```
tar -czv　対象ファイル
```

`-c`: 新しいアーカイブを作成する

`-z`: アーカイブをgzip形式で圧縮する

`-v`: 処理内容を出力する

# 他の圧縮時によく使うオプション

`-f`: 出力するアーカイブ名を指定して圧縮する。拡張子を指定する時にも使えそう。
tar -czvf <アーカイブ名.tgz> <圧縮するファイル>

# ファイルを展開する基本コマンド

```
tar -xzvf アーカイブ.tgz
```

`-x`: アーカイブファイルを展開する

`-z`: gzip形式のアーカイブを展開する

`-f`: 対象のアーカイブ名を指定する

# 参考
https://www.atmarkit.co.jp/ait/articles/1608/15/news015.html
Google API×Python memo


## スプレッドシート操作初期設定とスクリプト
- GCP設定
    - GCPプロジェクト作成
    - Google Drive/Spreads Sheet APIを許可
    - 認証情報を取得（サービスアカウントキー選択/役割：Project 編集者選択）
    - JSONファイルから、client_emailコピー
- スプレッドシート
    - 共有設定に、client_emailを追加
    - スプレッドシートキーコピー「*****」（https://docs.google.com/spreadsheets/d/*****/edit#gid=000000）
- スクリプト

```
import gspread
import json

#ServiceAccountCredentials：Googleの各サービスへアクセスできるservice変数を生成します。
from oauth2client.service_account import ServiceAccountCredentials 

#2つのAPIを記述しないとリフレッシュトークンを3600秒毎に発行し続けなければならない
scope = ['https://spreadsheets.google.com/feeds','https://www.googleapis.com/auth/drive']

#認証情報設定
#ダウンロードしたjsonファイル名をクレデンシャル変数に設定（秘密鍵、Pythonファイルから読み込みしやすい位置に置く）
credentials = ServiceAccountCredentials.from_json_keyfile_name('ダウンロードしたJSONファイル名.json', scope)

#OAuth2の資格情報を使用してGoogle APIにログインします。
gc = gspread.authorize(credentials)

#共有設定したスプレッドシートキーを変数[SPREADSHEET_KEY]に格納する。
SPREADSHEET_KEY = 'スプレッドシートキー'

#共有設定したスプレッドシートのシート1を開く
worksheet = gc.open_by_key(SPREADSHEET_KEY).sheet1

#A1セルの値を受け取る
import_value = int(worksheet.acell('A1').value)

#A1セルの値に100加算した値をB1セルに表示させる
export_value = import_value+100
worksheet.update_cell(1,2, export_value)
```
[参照](https://tanuhack.com/operate-spreadsheet/)
【SwiftUI】公式 Tutorials「 Animating Views and Transitions」の解説Part.3

#この記事は何？
Section1「Add Hiking Data to the App」で作成するビューのコードを読んでみました。

###環境
macOS 11.2.1
Xcode 12.4
Swift 5.3

#HikeGraph

````Swift:HikeGraphの定義
struct HikeGraph: View {
    var hike: Hike
    var path: KeyPath<Hike.Observation, Range<Double>>

    var color: Color {
        switch path {
        case \.elevation:
            return .gray
        case \.heartRate:
            return Color(hue: 0, saturation: 0.5, brightness: 0.7)
        case \.pace:
            return Color(hue: 0.7, saturation: 0.4, brightness: 0.7)
        default:
            return .black
        }
    }

    var body: some View {
        let data = hike.observations
        let overallRange = rangeOfRanges(data.lazy.map { $0[keyPath: path] })
        let maxMagnitude = data.map { magnitude(of: $0[keyPath: path]) }.max()!
        let heightRatio = 1 - CGFloat(maxMagnitude / magnitude(of: overallRange))

        return GeometryReader { proxy in
            HStack(alignment: .bottom, spacing: proxy.size.width / 120) {
                ForEach(Array(data.enumerated()), id: \.offset) { index, observation in
                    GraphCapsule(
                        index: index,
                        height: proxy.size.height,
                        range: observation[keyPath: path],
                        overallRange: overallRange)
                        .colorMultiply(color)
                }
                .offset(x: 0, y: proxy.size.height * heightRatio)
            }
        }
    }
}
````

````Swift:ヘルパー関数
func rangeOfRanges<C: Collection>(_ ranges: C) -> Range<Double>
    where C.Element == Range<Double> {
    guard !ranges.isEmpty else { return 0..<0 }
    let low = ranges.lazy.map { $0.lowerBound }.min()!
    let high = ranges.lazy.map { $0.upperBound }.max()!
    return low..<high
}

func magnitude(of range: Range<Double>) -> Double {
    return range.upperBound - range.lowerBound
}
````
Yahoo!ジオコーダAPIを使用して2点間の距離を測ってみた

とある地点から地点までの距離を求めるプログラムを作成してほしいという依頼があったので、その際にやったことを公開する。

仕様
１．基準となる住所を決める。
２．住所の一覧があるので、それぞれの住所から基準までの距離を求める。
３．求めた距離の一覧をcsvファイルで出力する。

といったシンプルな仕様になっている。

但し、YahooAPIには住所から２点間の距離を求める機能は無いため
住所を緯度、経度に変換してから求めている。

YahooAPI用のappidは下記のURLを参考に取得した。
https://www.gyro-n.com/sfs/faq/sfs_YahooID/

以下、実際に作成したソース。

```python

import hashlib
import hmac
import requests
import datetime
import json
import csv
import urllib.parse
import xml.etree.ElementTree as ET

"""
基準となる地点とそれぞれの地点の距離を測るプログラムです。
"""

# yahoo API のID
app_id = "YahooAPIのID"

# 基準となる住所
CRITERIA_ADDRESS = "東京都千代田区永田町１丁目７−１"

# 住所から経度、緯度を求めるAPI
MAP_REQUEST_URL = "https://map.yahooapis.jp/geocode/V1/geoCoder?appid={YahooAPIのappID}&query="

# ２点間の経度、緯度から距離を求めるAPI
tude_REQUEST_URL = "https://map.yahooapis.jp/dist/V1/distance?coordinates="

# 住所から緯度、経度を取得する。
def calc_tude(address):
	print(address + "の経度、緯度を取得")
	request_address = MAP_REQUEST_URL + urllib.parse.quote(address)
	print( request_address)
	point = requests.get(request_address)
	print( point.text)
	print( point.status_code)
	root = ET.fromstring(point.text)
	print(root[0][0].text)

	# 取得に失敗した場合は空の配列を返す。
	if root[0][0].text == '0':
		return []
	tude = root[1][3][1].text
	return tude

def calc_distance(tude1, tude2):
	# 距離をリクエストするためのURIを作成する。
	request_URL = "https://map.yahooapis.jp/dist/V1/distance?coordinates=" + urllib.parse.quote(tude1) + "%20" + urllib.parse.quote(tude2) + "%20" + "&appid=" + app_id
	
	# リクエストを送信する。
	print(request_URL)
	point = requests.get(request_URL)
	root = ET.fromstring(point.text)
	print(root[1][0][1].text)
	return root[1][0][1].text+"km"


# 基準点の経度、緯度情報を取得する。
criteria_tude = calc_tude(CRITERIA_ADDRESS)

# csvファイルの読み出しを行う。
csv_file = open("test.csv", "r", encoding="ms932", errors="", newline="" )

# 住所情報の数だけ繰り返す。
f = csv.reader(csv_file, delimiter=",", doublequote=True, lineterminator="\r\n", quotechar='"', skipinitialspace=True)

total_info = []

for row in f:
	address = row[0]
	
	# 住所情報から輝度、緯度情報を取得する。
	tude = calc_tude(address)

	if tude == []:
		continue

	# 取得した２つの住所情報を用いて距離情報を取得する。
	distance = calc_distance(criteria_tude, tude)

	# 住所と距離のリストを作成。
	info_list = []

	info_list.append(address)
	info_list.append(distance)

	total_info.append(info_list)

print(len(total_info))

# 取得した距離情報をcsvに追記する。
with open('sample_writer_row.csv', 'a', newline='') as f:
	writer = csv.writer(f, lineterminator = '\n')
	writer.writerows(total_info)

```

といった感じになった。
Unityで突然Visual Studioがusingエラーで見つかりません等のエラーを吐き出した時の解決

# 症状

タイトルの通り、UnityでVisual Studioを使って開発中に、`using`が突然効かなくなりビルドエラーが大量に発生しました。

# 環境

* Visual Studio 2019 Ver 16.8.3
* Unity 2020.2.2f1

# 解決策を試す

## 解決策1: 再起動

UnityとVSを再起動する。

解決せず。

## 解決策2: VSバージョン更新

Visual Studioの更新を確認したところ、更新できるのでバージョンを上げる。

`Ver 16.8.3` → `Ver 16.8.5` 

解決せず。


## 解決策3: .csproj .slnファイルの削除

Unityフォルダ内の以下のファイルを削除してVisual Studioを立ち上げる。

* `Assembly-CSharp.csproj`
* `(プロジェクト名).sln`

→解決した！！


# 参考にしたページ

* https://raspberly.hateblo.jp/entry/usingUniRx
* https://tomolog.reafo.io/jp/article/unity-no-vscode-de-monobehaviournadono-error-gadetara
Python boot camp by Dr.Angela day3

#if/else構文
```python
print("Welcome to the rollercoaster!")
height =int(input("What is your height in cm?"))

if height >= 120:
  print("You can ride the rollercoaster!!")

else:
  print("Sorry, You cannnot ride the rollercoaster...")
```
>:Greater than
<:Less than
>=:Greater than or equal to
<=:Less than or equal to
==:Equal to              # <--「=」(代入)とは異なるので注意！
!=:Not equal to

#Nested if/else/elif 構文
##Mission>> BMI program
```python
h =float(input("enter your height in m: "))
w =float(input("enter your weight in kg: "))

bmi =round(w/(h**2))
if bmi < 18.5:
  msg = "underweight"
elif 18.5 <= bmi <25:
  msg = "normal weight"
elif 25 <= bmi < 30:
  msg = "over weight"
elif 30 <= bmi < 35:
  msg ="obese"
else:
  msg = "clinically obese. Go to the hospital immediately"

print(f"BMI:{bmi}\nStatus:{msg}")    # f-stringsでstring型とint型/float型を一気に変換!!
```

##Mission>> Leap year program (うるう年)
みなさんご存じ「うるう年」を西暦から選出するプログラム。
うるう年がどのように表れるのか知らないとコーディングできないので調べました。

_「ユリウス暦」で4年に1度のうるう年が制定されましたが、長い長い年月を経ていくと、暦と季節にズレが生じ、やがてそれが無視できないレベルにまで到達します。そこで、ローマ教皇グレゴリウス13世が、地球が太陽をまわる時間を「365日よりわずか0.2422日だけ長い」ことを天体観測で実証し、1582年、現在も使われている「グレゴリオ暦」に改暦されました。
このグレゴリオ暦では、うるう年を次のように定めています。
（1）西暦が4で割り切れる年をうるう年とする
（2）西暦が100で割り切れて、400で割り切れない年は、平年とする
2020年や2024年は（1）に当てはまるので、うるう年となりますが、2100年、2200年、2300年は（2）に当てはまり、うるう年にはなりません。_(出典：https://precious.jp/articles/-/16720)
とのことです。「4年に1度にくるが、誤差がある」程度の認識しかなかったので、勉強になりました(笑)

```python
year =int(input("Which year do you want to check?"))
if year %400 ==0:
  if year %100 ==0 year % 400 !=0:
    print("Normal year")
  else:
    print("Lead year")
else:
  print("Normal year")
```
このように入れ子(Nest)でif/else文を記述する際、どのifにどのelseが対応していくかわからなくなるため、if文書いたら、ネストする前に同じインデントでelse文を記述すると、ミスを減らせます。また、else:でやることがなければ「pass」を記述するか、「else:」自体書かない。

##Mission>> Online AMASON BOOK Order
ECサイト「AMASON BOOK(架空のブランド)」での注文画面

```python
print("Welcome to AMASON BOOK!")
print("What category book do you want?")
size =input("[(P)paperback, (S)softcover, (H)hardcover]: ")
add_bj =input("Do you want to a book jacket?[Y,N]: ")
add_pb =input("Do you want a purchase bag?[Y,N]: ")

total =0
if size =="P":
  total +=5
elif size =="S":
  total +=10
elif size =="H":
  total +=15

if add_bj =="Y":
  total +=2

if add_pb =="Y":
  if size =="P":
    total +=1
  elif size =="S":
    total +=2
  else:
    total +=3
else:
  total -=1
  print("Thanks your ecological activity!!")

print(f"Your final bill is ${total}")
```
最後の方で、if文のネストがありましたね。
今後、HTMLで動くwebアプリとして使えそう。Flaskあたりで「AMASON BOOK」のサイト作ってみよう。
WebAuthnってなんです？ザックリ言うと、オンライン認証技術です。

WebAuthnってなんじゃ？となったときに、ちょっとでも参考になれば。
---

まず、WebAuthn ってのは FIDO認証って呼ばれる仕様のものの一つです。

* FIDOって？
FIDO(Fast IDentity Online)の略称です。
「サーバーとユーザーで秘密の情報を共有しない」のが、
FIDO認証の持つ大きな特徴、って言われてます。
電子メールの秘密鍵と公開鍵を例として考えてもらえたらわかりやすいかも。
あれも秘密の情報を共有しない形だから。

* 秘密鍵と公開鍵って？


* WebAuthnって？
WebAuthn(Web Authentication API) の略称です。
Web上で安全な認証を行うAPIですね。


参考
---
* 指紋認証機器の一例として yubico のオンラインストアがここ
https://www.yubico.com/jp/store/

* DDSさんのサイト
https://www.dds.co.jp/ja/topics/9736/

* Webで指紋認証を行ってみよう
https://qiita.com/sa2taka/items/3cdbe16fc09cca607e6f

* WebAuthnのやさしい解説！安全にパスワードレス認証ができる仕組みとは？
https://techblog.raccoon.ne.jp/archives/1594945638.html
Cognos Analytics 11.1 のSDKでデバッグコードを仕込んでのデバッグメモ

#Cognos Analytics 11.1 のSDKでデバッグコードを仕込んでのデバッグメモ
Javaのスキルが無い事がモロバレで恥ずかしいのですが、同じ様にCognosはできるけどJavaができない人には役立つ情報なので、恥を忍んで投稿します。
こうやったら出来たという投稿なので、もっと良い方法があるというJavaスキルある方のご指摘を頂けるとうれしいです。

#背景
Cognos SDKの開発では、過去に投稿したようなリモートデバッグを設定して、デバッグをやってました。
**Cognos SDKのリモート・デバッグ**
https://qiita.com/shinyama/items/f3cccdfb22bb79effe45

しかしながら、Cognos Analytics 11.1.5で、startwlp.batファイルが廃止されてしまい、Windows環境ではどうやれば良いのやらになった結果、原始的なデバッグコードを仕込んで、ログファイルに変数の値などを出力する事にしました。

自分のためのメモも兼ねて共有します。

#実装
JDBCSampleの例でやってます。

先頭に以下のimportを追加します。
![003.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/147246/9bd31cb2-ea2a-1a3c-14d9-16049a636cee.png)

```html
import java.util.function.Supplier;
import java.util.logging.FileHandler;
import java.util.logging.Formatter;
import java.util.logging.Handler;
import java.util.logging.Level;
import java.util.logging.Logger;
import java.util.logging.SimpleFormatter;
import java.util.Arrays;
```

デバッグコードを仕込む箇所の例として、getFormFieldValues()の中に、以下の赤枠を追加します。
![004.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/147246/46c07c69-8d48-b515-1184-62306eb8d286.png)

```html
	//Debug Start
	String username0 = Arrays.toString(usernames);
	try {
		Logger logger = Logger.getLogger("COGSDK");
		Formatter formatter = new SimpleFormatter();
		Handler loggerHandler = new FileHandler("/work/CJAP/test.log");
		logger.addHandler(loggerHandler);
		loggerHandler.setFormatter(formatter);
		logger.log(Level.INFO,"Username" + username0);
	} catch (IOException ex) {
		ex.printStackTrace();
	}
	//Debug End
```

ビルドして、CAM_AAA_JDBCSample.jarを置き換えて、Cognos Analyticsを再起動します。

Cognos Analyticsにcogadminユーザーでログインします。
![001.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/147246/23340e27-66d6-cd76-de49-93416d97c3e2.png)

test.logに以下のように[cogadmin]が出力されます。
![002.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/147246/daa292d3-3b7a-ecb3-5a1f-e25b1f28b5b8.png)

ご活用下さい！
Herokuでデプロイ後、日時表示がUTCになってしまう(time_zoneの設定)


#環境
Mac
PHP 7.3.24
ClearDB MySQL(MySQL Workbenchで操作)
Heroku(本番環境)

##現状
・Heroku clearDB MySQLにおいてデフォルトでUTCで保存されている
・デプロイをしてから、本番環境でUTC表示になってしまった(ローカル環境で使用している時は日本時間で表示されていた)

##実現したいこと
・投稿した際に、日本時間で表示させる
・発生している９時間の時差を解決する方法を知りたい

##調べたこと
・clearDB MySQLでデフォルト設定されているUTCは変更できない。(自動的にUTCで保存されてしまう)
・PHPプログラムで実装する方法が良さそう

##試したこと
・php.ini、HerokuのtimezoneをAsia／Tokyoに変更

・date_default_timezoneを使用。効果なし。これで、データ登録の際に、日本時間で登録してくれると思っていた。(取り扱うデータベースによってはこの方法で登録できる？)

##解決
接続の際に、タイムゾーンを設定することで、日本時間で登録され表示されるようになった。
解決まで1週間程費やしてしまい、遠回りしてしまいましたが改めて諦めない事って大切だなと実感いたしました笑

```
<?php
function connect()
{
    $db = parse_url(getenv("CLEARDB_DATABASE_URL"));
    $db['dbname'] = ltrim($db['path'], '/'); //pathのみ取り出す
    $dsn = "mysql:host={$db['host']};dbname={$db['dbname']};charset=utf8";
    $driver_options = [PDO::MYSQL_ATTR_INIT_COMMAND => "SET time_zone='+09:00'"];
    try {
        $db = new PDO($dsn, $db['user'], $db['pass'], $driver_options);
        $db->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
        $db->setAttribute(PDO::ATTR_EMULATE_PREPARES, false);
    } catch (PDOException $Exception) {
        die('DB接続エラー: ' . $Exception->getMessage());
    }
    return $db;
}

```

参考記事&質問サイト

[HerokuにデプロイしたはいいがDBはどうやって使うのだ？（ClearDBの使い方)](https://qiita.com/kakudaisuke/items/782e5982eec4a85ecb70)
[Herokuでデプロイ後、日時表示がUTCになってしまうので、日本時間で表示させたいです。]
(https://teratail.com/questions/322656?sip=n0070000_019&uid=177126)
↓英文ですが翻訳すれば何とかなります笑
[Working with Timezone in PHP PDO and MySQLPost author](https://becomingfullstack.com/working-with-timezone-in-php-pdo-and-mysql/)

他にも関連記事や参考になった記事が沢山あるのですが、混乱を避ける為に絞りました。
rails sでA server is already running.になった場合の対処

rails sしたら`A server is already running. Check /Users/ユーザー名/projects/test/tmp/pids/server.pid.`になった場合の対処を書いていきます。

# 発生する原因

railsサーバー内での処理中にサーバーを切ったりすると起きます。

エラーに書かれているまんまですが、
「Railsサーバーは実行中です。`Users/ユーザー名/projects/test/tmp/pids/server.pid.`をチェックしてくれ」と言っています。

# 結論
処理中となっている`Users/ユーザー名/projects/test/tmp/pids/server.pid.`を終了させれば解決ということです。

# 手順
処理しているPIDを確認する

```
lsof -i:3000
```
を実行

以下のような処理の一覧が出る

```
COMMAND   PID   USER   FD   TYPE             DEVICE SIZE/OFF NODE NAME
ruby    81471  ユーザー名   35u  IPv6 0xedd3fed85444d6b7      0t0  TCP localhost:hbci->localhost:56482 (CLOSE_WAIT)
ruby    81471  ユーザー名   36u  IPv6 0xedd3fed855599197      0t0  TCP localhost:hbci->localhost:56706 (CLOSE_WAIT)
```

COMMANDに`ruby`が書かれた箇所の`PID`をコピーする（ここでは`81471`です）


以下を実行してプロセスを強制終了します

```
kill 81471
```


これだけです！
`rails s`すると問題なくRailsサーバーは立ち上がります。
「実践ドメイン駆動設計」から学ぶ DDDの実装入門  2.2ドメイン をマインドマップでアウトプット 


Coggleというサービスを使ってアウトプットしたものをこちらに載せておくただの自分メモ。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/190685/55698b30-bf6c-b3ac-7a73-5a79bf47aebc.png)

一口メモ的な補足的な物も書いていこうと思うけど、一旦これだけ。
LINEでお風呂を操作する装置つくってみた

# はじめに
今日も家に帰って
「お湯を入れる」ボタンを押して
30分待機….

どうも皆さん初めまして、駆け出しのエンジニアです。

IoTが進んでいる今の世の中、お風呂や洗濯機などをスマホから
操作できるものが普通に存在していて
便利だなーって思いました。

そんなある日、妻からの要望があがりました
__「お風呂沸かす時間、毎日待っているの無駄だから、スマホでできるやつ買おうよ」__

そう、我が家のお風呂には時代遅れでそんな便利な機能はついていません。
特に我が家では毎日お風呂に入っているので確かに無駄を感じていました！

ただ、そのためだけに新しいのを付け替えるのは、コストかかるな～て思って
いろいろ調べてたら、2000円もいかずに安価に作れるかもしれない！
と思って作ってみました！

# 完成するとこんな感じ
LINEで依頼
![39CC9684-3A55-4651-8AB6-0A32425D1339.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/498588/eff604bc-630b-c0f9-0209-f7c6621dba59.png)

装置が動き出す
![イメージ.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/498588/a5e893d6-b0eb-003a-9bfc-ab1e44769f53.gif)

見た目とか、原始的なスイッチ押しだったり以外に関しては、妻も私も要望通りの機能が再現できました！！
退社するときにラインでチャットしとけばいいですね！
これで時間を有意義に使えます。

一応機能としては、追い焚きとお風呂沸かすことの2つです

# 部品や構成図
__使用したもの__

- [esp32](https://www.amazon.co.jp/waves-ESP32-DevKitC-ESP-WROOM-32-ESP-32/dp/B06XWP81GP/ref=pd_sbs_2?pd_rd_w=RSDRg&pf_rd_p=051ec0f2-89dd-40f5-9dc7-0162d5cbdbb9&pf_rd_r=7VZ5GZQQVRGSFE95089V&pd_rd_r=9c9b7e90-4d78-4684-97e0-92b3b3a970a7&pd_rd_wg=zRrZk&pd_rd_i=B06XWP81GP&psc=1)
- 電池は4本入りのやつを近くの店で70円で買いました
- ブレッドボードは家にあったやつを使用
- [モーターsg90](https://akizukidenshi.com/catalog/g/gM-08761/)

__構成図といてはこんな感じです__
全体図
![38A9BB83-49C1-4842-8591-C705A06039A2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/498588/b28f8efb-3f5c-1a82-617d-22aa4d81e19b.png)
回路
![67D564C6-52E7-44B![60E8845E-FF92-45B3-B0A6-4DFB7D9F82CC.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/498588/7e013976-f4f4-4bb7-83f2-37d9a2ab4296.png)
C-B45E-FEA5835BE1AE.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/498588/06d10045-41d5-268d-891f-8faece3392b2.png)
回路に関しては、まったくの素人でしたので
とても調べました。（あってるのかな….)

#今後の予定（いつやるか未定だが...)
- Linebotにリッチメニューというものがあるので、洗濯機やエアコンなど機能を増やしていきたいですね
- <details><summary>リッチメニュー</summary>
![ECBAF70F-9A2B-45FD-B394-D19670D30F04.png]
(https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/498588/0da123fe-41ae-322b-eab2-6fd99486628f.png)
</details>
- 予約機能を実装したい（LINEから端末の予約を操作)
- 家にいる誰かが、ボタンからお風呂を操作した時、 それを知らない家族がLINEで依頼をしたら2度押しになってしまい、お風呂入れが中止になってしまうので、画像識別できるものを追加したい。
- DIYで見た目をもう少し…

#その他
もし、ハックでもされたら家が水没してしまうので、何とかする必要があるのかな....

あと、発熱で火事にならないか、めちゃくちゃ心配しています。

# 参考にさせていただいたサイト様
- [電子回路の基礎](https://speakerdeck.com/fumimaker/dian-zi-gong-zuo-falsetamefalsedian-qi-hui-lu-ji-chu-jiang-zuo?slide=36)
- [ESP32入門:arduinoでモータを動かす方法](https://deviceplus.jp/hobby/arduino_f05/)
- [ESP32のチュートリアル](https://wak-tech.com/archives/888)
- [ESP32の回路図](https://dl.espressif.com/dl/schematics/esp32_devkitc_v4-sch.pdf)
- [ESP32のPINの内容など](https://trac.switch-science.com/wiki/esp32_tips)
- [ESP32でモータ複数](https://homemadegarbage.com/mecanum01)
- [ESP32のモータやWifi接続など](https://massapple.hatenablog.com/entry/2018/10/30/012359)
- [ESP32とモータ2個](https://homemadegarbage.com/esp32_minirobot01)
- [LINEとHerokuの連携](https://qiita.com/shimajiri/items/cf7ccf69d184fdb2fb26)
STM32F767のMbedでのSWOで表示


元ネタ

Wim Huiskamp /  SWO
https://os.mbed.com/users/wim/code/SWO/

X何らかの方法でMbedにユザー登録しておく

1.compiler画面を開く
2.一番右上のボードボタンでNUCLEO-F767ZIを選ぶ
3.マイプログラム->右クリック->プログラムのインポート->
ウィザートからのインポート
4.インポートウィザード画面でSWOを検索
5.mbed_nucleo_swoを選択しインポート
6.Import Program画面を実行
7.コンパイル、転送
8.STM32 ST-LINK Utility画面でST-LINKを選択し、SWOを選ぶ
9.クロックに216000000を入力し実行
10.表示されたらおわり

![SWO_F767_a_1.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/840352/f265eb30-57ec-b818-c8b9-c0b0ae2d7f77.jpeg)

![SWO_F767_a_2.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/840352/369c9a08-f171-73fe-4131-cfe3225b9643.jpeg)

![SWO_F767_a_3.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/840352/935fc8fb-4c76-086f-df06-69ccdf42e964.jpeg)

![SWO_F767_a_4.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/840352/8a643e81-f846-20f5-c315-599dfb86aec6.jpeg)
migrationをやり直したい時の対処法

2021/2/15

1.新しいテーブルを追加したい時はmodels.pyにテーブルを追加する
2.python manage.py makemigrations
↓
3.python manage.py migrateで新しいテーブルを追加する

もう一度やり直したい時は
db.sqlite3のファイルを削除（⇦データベース）
↓
python manage.py migrateコマンドを打つ
react-router-domをvue-routerっぽく使おうとしたら嵌った


Vueはそこそこ使い倒していて、Reactもちょっと触っておくかくらいの気持ちで簡単なWebアプリを作っていたら、思わぬところで嵌ったので記事として残しておきます。

# 経緯 
`react-router-dom`を使おうとしたのですが、`vue-router`と大分勝手が違ったので、`vue-router`と同じような使い方ができる以下のようなコンポーネントを作りました。  
ちなみに[公式のサンプル](https://reactrouter.com/web/example/route-config)を参考にしました。

```jsx
import loadable from '@loadable/component'
import PropTypes from 'prop-types'
import {
  Switch,
  Route
} from 'react-router-dom'

export const routes = [
  {
    name: 'A画面',
    path: '/',
    component: loadable(() => import('./views/A'))
  },
  {
    name: 'B画面',
    path: '/Bgamen',
    component: loadable(() => import('./views/B'))
  }
]

const RouterView = (props) => {
  const _routes = props.routes || routes
  const routerProps = props
  return (
    <Switch>
        {_routes.map((route, i) =>
            (<Route
                key={i}
                path={route.path}
                render={props => (
                    <route.component 
                        {...props}
                        routes={route.routes}
                        {...routerProps}>
                    </route.component>
                )}/>
            ))
        }
    </Switch>
  )
}
RouterView.propTypes = {
  routes: PropTypes.arrayOf(Object)
}

export default RouterView
```

vue-routerの`<router-view>`っぽく、パスが`/(ルート)`の時にA画面を表示し、`/Bgamen`の時にB画面を表示するコンポーネントができたぜと思い、使ってみると...  

- `/`でA画面が表示される
- **`/Bgamen`でもA画面が表示される**  

という状態でした。

## なぜ`/Bgamen`でもA画面が表示されたか

最初は全然検討がつかなくて、色々ググったもののこれといって原因がわからなかったのですが、結論から言うと、実は**A画面もB画面も表示されている**状態でした。  
ルーティングの仕組みだけ勇足で作って、肝心のB画面は空のコンポーネントだったため気付くのに数時間かかりました🥺

react-routerはパスに部分一致したルートを全て表示する仕様で、`/Bgamen`も`/`にマッチするという動きになっていたようです。

## 対処方法
Routeコンポーネントにexactプロパティを設定すると完全一致した時のみ表示されるようになります。

```diff_jsx

const RouterView = (props) => {
  const _routes = props.routes || routes
  const routerProps = props
  return (
    <Switch>
        {_routes.map((route, i) =>
            (<Route
                key={i}
+               exact
                path={route.path}
                render={props => (
                    <route.component 
                        {...props}
                        routes={route.routes}
                        {...routerProps}>
                    </route.component>
                )}/>
            ))
        }
    </Switch>
  )
}
```

最初はなんでこんな仕様になってるんだと思いましたが、よく考えると小画面を親画面の一部に表示するようなUIだとこの仕様が正しいことに気づきました。
よく言われる、vueは開発者に甘く、reactは厳しいというのを実感しました...

以上です。

PS
この記事投稿した後react-router-domのタグの記事見たらおなじ内容の記事が１週間前にあった（笑
猫の画像と日記投稿サイト　課題や今後の目標

###現在、猫の画像と日記（記事）投稿ポートフォリオサイト制作中。
https://cat-lover4432.herokuapp.com/

###☆会員登録、ログイン機能、ページネーション（多分）あり。

###☆現在の課題
・ログイン後に、画像のアップロードと日記（記事）投稿画面に行けるボタンがない（画像のアップロードだけは/output/image/upload/imageなどと自分でURL飛ばしたらいける。投稿フォームはおそらくない）、自身のプロフィールの画面とそこに行けるボタンがない、投稿一覧の画面とそこにいけるボタンがない
https://cacoo.com/diagrams/1bvOuNN5mwuDAzLc#C2FB6

・ユーザー一覧に行こうとしたらエラーがでるようになった

###☆2月下旬からの1ヶ月で付けたい機能（頑張れるなら）
・投稿フォーム作成
・投稿、プロフィールボタン作成
・日記（記事）編集機能（余裕があれば）
・日記（記事）削除機能
・投稿に対するコメント機能（余裕があれば）
・プロフ写真や自己紹介テキストなどがあるプロフィール
・お気に入り機能（余裕があれば）
・投稿一覧、お気に入り一覧
・現在、HerokuにデプロイしているがAWSにデプロイしたい
Google Apps Script V8 エンジンでの JDBC に注意

Google Apps Script(GAS) からデータベースにアクセスする場合は、GAS に組み込まれている JDBC を使用します。

[External databases via JDBC](https://developers.google.com/apps-script/guides/jdbc)

GAS の JDBC は、Google が提供する Cloud SQL はもちろん、他のクラウドデータベースサービスである、Oracle Cloud や Azure SQL Server にも接続することができます。

新しい GAS の V8 ランタイムエンジンが登場し、多くの方が Rhino から移行したのですが、突然データベースにアクセスできなくなったとの報告が大量に挙がりました。

[Issue Tracker: Chrome V8 : ReferenceError: Jdbc is not defined](https://issuetracker.google.com/issues/149273194)

投稿日は 2020/2/12 で１年以上も前で、50件以上も同様の症状が報告されているのですが、2021/2/16 現在、改善されてはいないようです。

V8 エンジンの JDBC の実装に問題があるようで、Google の Cloud SQL でも障害が再現します。
このため、JDBC を使っていた人は、やむを得ず Rhino に戻して使用している状況です。

GAS で JDBC の利用を検討されている方はご注意下さい。
useReducerの処理の流れ

学習の備忘録として残しています。

データをコンポーネントが受け取ってブラウザに表示するための方法としてReact Hooksを使用し、コンポーネントにstateを注入する方法がある。
useStateとuseReducerの２つ。

# useReducerを使う場面
複数の値にまたがる複雑なstateロジックがある場合や
前のstateに基づいて次のstateを決める必要のある場合。

# 処理の流れ
全体像

```react:jsx

const initialState = {count: 0};

function reducer(state, action) {
  switch (action.type) {
    case 'increment':
      return {count: state.count + 1};
    case 'decrement':
      return {count: state.count - 1};
    default:
      throw new Error();
  }
}

function Counter() {
  const [state, dispatch] = useReducer(reducer, initialState);
  return (
    <>
      Count: {state.count}
      <button onClick={() => dispatch({type: 'decrement'})}>-</button>
      <button onClick={() => dispatch({type: 'increment'})}>+</button>
    </>
  );
}

```
この場合、
Counterコンポーネント内の一行目でuseReducerが定義されている。
簡単に解釈すると、stateはinitialState,actionがdispatchに該当する。

```react:jsx
return (
    <>
      Count: {state.count}
      <button onClick={() => dispatch({type: 'decrement'})}>-</button>
      <button onClick={() => dispatch({type: 'increment'})}>+</button>
    </>
```
この中のdispatchで、reducerの関数を呼び出して、stateがセットされる。
dispatchの引数は１つで、慣習としてtypeをキーにもつ値を入力する。
もし、dispatchの引数が{type: 'decrement' なら

```react:jsx
case 'decrement':
      return {count: state.count - 1};
```
この部分が読み込まれ、stateのcountが１下がる。
そのため

```react:jsx
Count: {state.count}
```
の返り値は-1となる。
【Android】MaterialDatePickerの色を変更する

MaterialDatePicker の色を変更したい場合があると思うのでメモ。
ガイドラインは https://material.io/components/date-pickers

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/696817/ad5918fd-a79a-78c3-b721-58a0f5ecfff2.png" width=600>


```style.xml
<resources>
    <style name="AppTheme" parent="Theme.MaterialComponents.DayNight.NoActionBar">
        
        ...

        <item name="materialCalendarTheme">@style/MyMaterialCalendarTheme</item>
    </style>
</resources>
```

スタイルの定義が少々長いので style.xml とは別のリソースファイルを用意するのが良いと思います。

```style_material_date_picker.xml
<resources>
    <!-- MaterialDatePicker のテーマ -->
    <style name="MyMaterialCalendarTheme" parent="ThemeOverlay.MaterialComponents.MaterialCalendar">
        <item name="materialCalendarStyle">@style/MyMaterialCalendar</item>
        <item name="buttonBarPositiveButtonStyle">@style/MyMaterialCalendarTextButton</item>
        <item name="buttonBarNegativeButtonStyle">@style/MyMaterialCalendarTextButton</item>
        <item name="materialCalendarHeaderTitle">@style/MyMaterialCalendarHeaderTitle</item>
        <item name="materialCalendarHeaderSelection">@style/MyMaterialCalendarHeaderSelection</item>
        <!-- 曜日や手入力テキスト色 -->
        <item name="android:textColorPrimary">@color/...</item>
        <!-- ヘッダーの背景色 -->
        <item name="colorPrimary">@color/...</item>
        <!-- 日付の背景色 -->
        <item name="colorSurface">@color/...</item>
        <!-- 日付の前景色 -->
        <item name="colorOnSurface">@color/...</item>
        <!-- ヘッダーのアイコン色 -->
        <item name="colorOnPrimary">@color/...</item>
    </style>

    <!-- MaterialDatePicker のスタイル -->
    <style name="MyMaterialCalendar" parent="Widget.MaterialComponents.MaterialCalendar">
        <item name="dayStyle">@style/MyMaterialCalendarDay</item>
        <item name="daySelectedStyle">@style/MyMaterialCalendarDaySelected</item>
    </style>

    <!-- MaterialDatePicker のヘッダータイトル -->
    <style name="MyMaterialCalendarHeaderTitle" parent="Widget.MaterialComponents.MaterialCalendar.HeaderTitle">
        <item name="android:textColor">@color/...</item>
    </style>

    <!-- MaterialDatePicker の選択されたヘッダータイトル -->
    <style name="MyMaterialCalendarHeaderSelection" parent="Widget.MaterialComponents.MaterialCalendar.HeaderSelection">
        <item name="android:textColor">@color/...</item>
    </style>

    <!-- MaterialDatePicker の日付 -->
    <style name="MyMaterialCalendarDay" parent="Widget.MaterialComponents.MaterialCalendar.Day">
        <item name="itemTextColor">@color/...</item>
    </style>

    <!-- MaterialDatePicker の選択された日 -->
    <style name="MyMaterialCalendarDaySelected" parent="Widget.MaterialComponents.MaterialCalendar.Day.Selected">
        <item name="itemFillColor">@color/...</item>
        <item name="itemTextColor">@color/...</item>
    </style>

    <!-- MaterialDatePicker のボタン -->
    <style name="MyMaterialCalendarTextButton" parent="Widget.MaterialComponents.Button.TextButton">
        <item name="android:textColor">@color/...</item>
    </style>
</resources>
```
SpannerマイグレーションツールRatchetを作りました

Spannerのマイグレーションツール [Ratchet](https://github.com/hiracchy/ratchet) を作りました。

## 背景
プロダクションで使えるSpannerのマイグレーションツールを調査していて、
wrenchが良さそうだったのですが、以下のような問題がありました。

-  マイグレーションファイルの名前が連番で作られるため、複数人の開発で競合する
- DMLやパーティション化DMLへの対応がない（現在は、一部対応があるようです）

そこで、それらを解決したシンプルなマイグレーションツールを作りました。

## インストール
[リリースページ](https://github.com/hiracchy/ratchet/releases/latest)からダウンロードしてパスを通してください。

## 使い方
以下のステップで使えます。シンプルに使えるように心がけました。

### 1. マイグレーション用のテーブルを作成する（1回目のみ実行が必要）
```console
$ ratchet init -p {プロジェクトID} -i {インスタンス名} -d {データベース名}

Creating migration table...
Migration table has been created!!
```

### 2. マイグレーション用のファイルを作成する
```console
$ ratchet new

New migration file has been created in migrations/2021-02-07_07-38-03_23229.sql
```
- 実行したディレクトリにmigrationsフォルダが作られ、その中にマイグレーションファイルが作られます。
- 何もオプションを指定しなければDDL用のファイルが作られます。DMLやパーティション化DMLを使いたい場合は `--dml`、 `--pdml` を付与してください。

### 3. マイグレーションを実行する
```console
$ ratchet run -p {プロジェクトID} -i {インスタンス名} -d {データベース名}

Migration started.
running 2021-02-07_07-38-03_23229 ... done.
Migration completed!
```
- 2にて作成されたmigrationsフォルダと同じ階層で `ratchet run` を走らせる必要があることに注意してください。

## 終わりに
現状プロダクションで使用していますが、特に問題はありません。
かなりシンプルに使えるツールなので、是非試してみてください。
改善点などありましたらIssueで投げていただければと思います！
hpのパソコンでVirtualBoxが起動できない場合

自分的メモになりますがHpのパソコンで同じことが起こった
人がいたら解決策になればと思い残します。
VirtualBoxを起動しようとしたとき以下のエラーが発生しました。
>>
stderr: vboxmanage.exe: error: not in a hypervisor partition (hvp=0) (verr_nem_not_available). vboxmanage.exe: error: vt-x is disabled in the bios for all cpu modes (verr_vmx_msr_all_vmx_disabled) vboxmanage.exe: error: details: code e_fail (0x80004005), component consolewrap, interface iconsole

調べたところ
コマンドプロンプトを管理者権限で起動
＞　bcdedit

こちらを実行する
hypervisorlaunchtype Auto
こちらをoffにすることで解決するとのことだったので実行

＞　bcdedit /set hypervisorlaunchtype off
を入力

hypervisorlaunchtype    off
になっていたので再起動をし確認。

変わらずエラーが発生。

頭にはてながたくさん出つつ
調べれば調べるほど沼へはまり込みました。

仮想空間の設定をoffにしないと起動できない
起動にさまたげになっている設定がある
【Windows起動時】
ロゴマークが出たらF10を押す

【Windowsを起動している状態からの場合】
Windows+I
左のメニューから回復
その他の回復オプションから
「PCの起動をカスタマイズする」
「今すぐ再起動」
をクリック
するとオプションの選択画面に出ます

そこから
「トラブルシューティング」→「詳細オプション」→「UEFIファームウェアの設定」
の順に遷移します。
すると再起動ボタンがあるので
ぽちり

【起動メニュー】があるので
F10を押します。

「セキュリティ」の項目があると思うのでそこに
方向キーで移動して
システムのセキュリティを選択

【仮想化技術（VTx/VTd）】があるので
そこを無効に
（お前が原因だったのか…）

そして無効にして
再起動をし改めてコマンドプロンプトで

C:User￥Username￥●●￥ファイル名>vagrant up
で起動したところ無事に起動されました。
初めて作るアプリのデザインを整える

##なぜ記事にするのか
本当に無知（アプリ開発初心者）の段階で、どのような考え方、過程でアプリのデザインをしたかを記録するため

##どんなアプリを作っているのか
以下の記事で説明していますが、台湾中国語および日本語勉強アプリです。

###関連記事
[初めて作るアプリのタイトルを決める](https://qiita.com/atamakonkurii/items/a38281091f5b8e1ed4a5)
[初めて作るアプリのアイコンを作成する](https://qiita.com/atamakonkurii/items/7fa73decc85475d0f4af)


##作る過程
まずイメージを作るため簡単なスケッチを書きました。
<img width="600" alt="IMG_0583.JPG" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1010233/b1da0596-9bb4-b861-1b3c-35a9f524f651.jpeg">

①アプリ起動時に映るページ
②学習開始ボタンがあるページ（拡張性を考えて）
~~③例文一覧ページ~~<font color="Red">実装に時間がかかると判断したため、今回は見送り（いつかやります）</font>
④学習ページ

の４つをデザインしていこうと思います。

###①アプリ起動時に映るページ
このページのことをxcodeではLaunchScreenと言うそうで、標準装備のLaunchScreen.storyboradを編集すれば良さそうです。

参考URLに手こずった後が残されていますが、完成しました。
<img width="300" alt="IMG_0583.JPG" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1010233/3a918426-2473-0018-54eb-110f60e2ecc7.png">



手こずった点は、
・画像が（Auto rayoutで）中心に配置できない
・画像がシミュレータ上で表示されない
・Launchページの時間が短すぎる
でした。

ちなみに真ん中のイラストは、テトラポットです。
コンクリートといえばテトラポットと言う感じです。

###②学習開始ボタンがあるページ

ボタンの装飾はまだしていませんが、以下のようになりました。
<img width="300" alt="IMG_0583.JPG" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1010233/7360606b-423f-bd46-4a3e-168af2e41d84.png">

ちなみに右側のイラストは「頭コンクリくん」です。
頭コンクリの意味→頭固い→頭おかしい→ゾンビ
と言う感じで安易に作ったキャラクターです。

###~~③例文一覧ページ~~

###④学習ページ
学習ページは以下のようになりました。
<img width="400" alt="IMG_0583.JPG" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1010233/5b9e8096-1d49-6053-9efa-54013b10c0f8.png">

翻訳表示＆音声読み上げ

<img width="300" alt="IMG_0583.JPG" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1010233/fd319d2f-6690-5767-a4cd-aba631645f59.png">

文章を切り替えると、翻訳表示が「？」に戻ります
<img width="300" alt="IMG_0583.JPG" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1010233/ee2b332c-a441-4819-d265-20bfc281c5d2.png">

言語切り替え（日本語を学習したい台湾人にも利用してもらいたいからです）
<img width="300" alt="IMG_0583.JPG" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1010233/40e26aa9-1ee2-de2e-3865-92d56841dd3f.png">



##参考URL
LaunchScreenの表示時間を変更する方法
https://qiita.com/e9d26/items/26fab0bed16aec69d176

Swift3 Storyboardで画面の中心にViewを配置する
https://qiita.com/suzuki_y/items/8706eda26c3a1b156506

Storyboard で指定した画像が表示されないときは Asset Catalog を使うと解決する
https://qiita.com/ynii/items/2877f8f935f823c7ee00

LaunchScreenの表示時間を変更する方法
https://qiita.com/e9d26/items/26fab0bed16aec69d176

Swift：超初心者向け！UITableViewControllerの使い方（１）
https://programming-beginner-memo.com/?p=17

【Swift】Swift入門 ~ NavigationControllerを使ってみる ~
https://swallow-incubate.com/archives/blog/20200205/

【Swift/iOS】ナビゲーションコントローラーの使い方
https://capibara1969.com/907/![Simulator Screen Shot - iPhone 8 - 2021-02-16 at 06.19.51.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1010233/7218e37c-7e0d-e7ea-64b9-1e0667b6a304.png)
leela ubuntu

https://www.sjeng.org/leela.html

から

Leela 0.11.0 for Ubuntu (deb package)
をダウンロード


前準備
 apt install libsdl1.2debia


そして
cd　Download

```
# dpkg -i leela_0.11.0_amd64.deb

```
![1.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/211097/49b77d29-58f1-3a80-bc09-45d40552d002.jpeg)

とできてます

leela は碁盤を　**13路盤**にできるのが素晴らしい



--------
--------
--------

## arch系　arco linux で　katagoを試行　

```

http://go-w.jp/?p=1555
にならうと


[.../Lizzie]$ java -jar lizzie.jar
で **Engine is loading **にはなります
が　５分待ってもこのままです
メモリ不足か？　あるいは　駄目か？

```
git commit messageは命令形、小文字始まりで書く（git標準）

# 命令形、小文字始まりで書く

https://git.kernel.org/pub/scm/git/git.git/tree/Documentation/SubmittingPatches?id=HEAD

```
[[imperative-mood]]
Describe your changes in imperative mood, e.g. "make xyzzy do frotz"
instead of "[This patch] makes xyzzy do frotz" or "[I] changed xyzzy
to do frotz", as if you are giving orders to the codebase to change
its behavior.  Try to make sure your explanation can be understood
without external resources. Instead of giving a URL to a mailing list
archive, summarize the relevant points of the discussion.
```

> 変更を命令系で書くこと。
 「make ...」と書くべきで、「[This patch] makes ...」や「[I] changed ...」ではありません。
コードベースに変更を指示するかのように、書いて下さい。
説明が他を参照しなくても理解できるように書くことを心がけて下さい。

```
[[summary-section]]
It's customary to start the remainder of the first line after "area: "
with a lower-case letter. E.g. "doc: clarify...", not "doc:
Clarify...", or "githooks.txt: improve...", not "githooks.txt:
Improve...".
```

> 小文字で始めること。

# ツール

JS/TS環境では、[commitizen](https://github.com/commitizen/cz-cli) を使えば、規約通りの commit message が保証されます。
【NestJS/TypeORM】STIを実装する

# 環境

- [NestJS 7.5.4](https://nestjs.com/)
- [TypeORM 0.2.29](https://github.com/typeorm/typeorm)

# 実装例

コード内のコメント部分が、STIに必要な実装です。

```typescript
// 子テーブルの enum を定義する。
export enum ContentType {
  PHOTO = 'PHOTO',
  QUESTION = 'QUESTION',
}
```

```typescript
@Entity()
// @TableInheritance を指定する。
// enum を指定する。
@TableInheritance({ column: { type: 'enum', enum: ContentType, name: 'type' } })
export class Content {
  @PrimaryGeneratedColumn()
  id: number;

  // type カラムを enum で明示的に定義する
  @Column({
    type: 'enum',
    enum: ContentType,
  })
  type: ContentType;
  
  @Column()
  title: string;
}
```

```typescript
// @ChildEntity を指定する。
// 引数は、enum を使って明示的に指定する。
@ChildEntity(ContentType.PHOTO)
export class Photo extends Content {  
  @Column()
  size: string; 
}
```

```typescript
// 同上
@ChildEntity(ContentType.QUESTION)
export class Question extends Content { 
  @Column()
  answersCount: number; 
}
```


# 参考ページ

- https://github.com/typeorm/typeorm/blob/master/docs/entity-inheritance.md

- https://github.com/typeorm/typeorm/issues/5088#issuecomment-555106385
redux-thunkで非同期処理を学んだ

#はじめに
・クエリを投げたり、APIを叩いて何かしら通信を発生する際に返ってきた実行結果やデータベースの中の情報を使って次の処理を進めたい
・Reduxだけではレスポンスを待つことができない。Reduxの中で非同期処理をしたい。(storeに保存)

こういった悩みを解決してくれるのがredux-thunkというライブラリです。
今回はこのライブラリについて学んだことを備忘録として書き留めます。

#redux-thunkとは
**Reduxで非同期処理を制御するライブラリ**

通常のActionsはaction objectを受け取る = 関数を受け取ることはできない = async/awaitやpromiseを使えない
しかし、redux-thunkを使えばActionで非同期処理を管理することができる。

#redux-thunkの導入方法
storeに対して導入します。
1.モジュールimport
2.applyMiddleware()に追加　*applyMiddlewareは導入したいMiddlewareの数だけ引数に取ることができる。

#redux-thunkを用いた非同期処理の基礎文法
ここでは、仮にoperations.jsというファイルにredux-thunk使って非同期処理行います。
ファイルの役割 =>
1.複雑な処理を任せられる
2.redux-thunkで非同期処理を制御する
3.Actionsを呼び出す

```react:operations.js
export const signIn = (email, password) => {
    return async (dispatch, getState) => {
　　　　　//現在のsigned inの状態を取得する
        const state = getState()
        const isSignedIn = state.users.isSignedIn
           
        if (!isSignedIn) {
              const userData = await emailSignIn(email, password)
              dispatch(signInAction({
                  isSignedIn: true,
                  uid: "00001",
                  username: "john",
              }))
         }
    }
}
```

getState() = 現在のstoreのstateを取得できる

そして、この後ログインを管理するファイルの中でこのoperations.jsをimportする。

```react:login.js
<button onClick={() => dispatch(signIn())}>
```

#参考
[日本一わかりやすいReact-Redux入門#9...redux-thunkで非同期処理を制御すべし](https://www.youtube.com/watch?v=wKQwCgZlEUY)