OmniAICreator/Qiita-1.07M huggingface dataset:
【Swift】UILabelをUITextViewに変更する際の注意点(メモ)

UILabelで作っていたが、後々ハイパーリンクにしたいなどで、
UILabel→UITextViewに変更しなくては。。などというケースの注意点メモ。。。

#環境
- Xcode: 11.3.1
- Swift5

##・UITextViewのスクロールをオフ
オートレイアウトを使用している場合、スクロールがONだと高さが計算されないので、
以下コードを追記

```Swift:
    textView.isScrollEnabled = false
```
##・UITextViewの余白(padding)を削除
実際に文字を表示してみると上下に余白ができてしまう。
以下コードを追記

```Swift:
    textView.textContainerInset = .zero
```
Windows10向け メモリダンプ取得ツールの検証

サイバー攻撃の被害が発覚した際、メモリダンプを取得しておくことは非常に有意義である。
侵害された端末上では不正プログラムが動作している可能性が高く、物理メモリの情報から、ユーザの挙動、攻撃の痕跡、プログラムそのものなどを発見することができる。

本記事ではWindows10でメモリダンプを取得するためのツールを紹介する。

#Windows10のメモリダンプの課題
Windows10ではCredential Guardという機能が新たに実装されている。
Credential Guardの解説はAtmarkITの下記の記事がわかりやすかったため参照のこと。
[認証情報を守るWindows 10の「Credential Guard」](https://www.atmarkit.co.jp/ait/articles/1709/20/news016.html)

Pass the hashなどの攻撃から守るために非常に有意義な実装であるが、この実装により従来Windows7等で使われていた**メモリダンプツールの使用時にBSoDが発生するようになる**。

#Windows10で利用可能なメモリダンプツール３点
情報のソース元としてSANS DFIR Summit にて Jason Hale氏が公開した情報を利用させて頂いています。
https://www.dfrws.org/sites/default/files/session-files/pres_virtualization-based_security_-_a_forensics_perspective.pdf

##メモリダンプの前提
ツール取得前の前提であるが、メモリは揮発性であるため電源をシャットダウンすると不正な動作や痕跡も消えてしまう。
そのため、被疑端末のメモリダンプを取得する際は、**シャットダウン前**に取得することを強く推奨する。
また、完全メモリを取得する場合、メモリサイズと同等のファイルサイズで取得されるため、**事前に十分な空き容量が確保できているか確認することも必須**である。

##memory dump tool 3選
###１．DumpIt v3.0.20170620
メモリダンプツールの定番DumpItのWindows10対応版である。
ただし2020/9/15現在インターネット上で検索しても本バージョンを見つけることができなかった。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/102081/41f07560-990b-553a-1382-c1e36db613b3.png)


###２．osforensics v5.1.1001
私は未検証であるため詳細は割愛するが、ファイルサイズが300Mを超えている点がやや懸念ではある。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/102081/de5c1667-57b7-936d-488f-68870689d7e4.png)

###３．Berksoft
ユーザ登録することで下記のサイトよりダウンロード可能。
https://belkasoft.com/ram-capturer
UIが大変シンプルで分かりやすく、必要要件を満たしている。
今回は本ツールを検証したため、使用方法の流れを記載する。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/102081/418ac82c-a1f2-c76d-36ce-c1750d99ed53.png)


##Belksoftの利用手順
１．OSに合わせてx86（32bit）およびx64（64bit）を選択
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/102081/eba488a1-7931-5f6e-a859-fed509f8a860.png)


２．格納されているexeを実行
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/102081/6dacff56-f216-ed91-3345-16a897e8488f.png)


３．「Capture!」ボタンを押下
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/102081/152d0c76-e4f5-19c8-5763-461d6ea8650c.png)


４．完了を待つ（Memory dump completed. と表示されたことを確認する）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/102081/e9d4fe2c-a048-628b-55e7-aba7506ef5b2.png)


５．ダンプファイルが生成されていることを確認する
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/102081/39b2729a-6e02-cc71-1c2f-06b5d048cbc0.png)



以上、どなたかの役に立てば幸いです。
修正点などありましたらコメントお願いいたします！
Udemyの人気講座「フルスタック・Webエンジニア講座」を受講してみた(その1)

# はじめに

今回はUdemyの講座の1つである、[【世界で30万人が受講】フルスタック・Webエンジニア講座（2019最新版）](https://www.udemy.com/course/completeweb2_jp/)を受講してみる事にしました。
内容としては、以下を学習しながらウェブサイト・ウェブアプリを作成していく、というものになっております。

- HTML5  
- CSS  
- javascript  
- jQuery  
- BootStrap4
- WordPress
- PHP
- MySQL
- Python

もちろんこの講座を受けるだけでフルスタックエンジニアになれるとは思っておりません。
今回は**フロントエンドの技術を浅く広く体系的に触る事**が主な目的です。
 
セクション1から15まである為、概要を記載していきます。

# 目次
- [セクション1:はじめに](#セクション1:はじめに)
- [セクション2:HTML5](#セクション2:HTML5)
- [セクション3:CSS](#セクション3:CSS)
- [おわりに](#おわりに)

# セクション1:はじめに

講座の概要説明と環境セットアップがメイン。

- Chrome
- Brackets(エディター)
- MAMP(ApacheやMySQL等をパッケージしたもの)


# セクション2:HTML5

セクション2はHTML。HTMLの説明及び、記載に必要なタグやリンクの挿入等について学習。
以下は学習内容の一例。

- ウェブページの基本構造
- 基本的なタグ
  - ヘッダー（見出し）タグ
  - パラグラフタグ
  - テキストのフォーマット
  - リスト
  - イメージ
  - フォーム
  - テーブル
  - リンク
- ウェブページを作ってみる


# セクション3:CSS

セクション3はCSS。HTMLと同じく、説明及び記載方法等について学習。
以下は学習内容の一例。

- スタイルシート
- インラインCSSと外部CSS
- 各種スタイリング
  - インラインCSS
  - 内部CSS
  - Class・id・span
  - Div要素
  - Color属性
  - Floatレイアウト
  - Position属性
  - マージン(margin）
  - パディング（padding）
  - ボーダー（border）
  - フォント（Fonts）


# おわりに
まだ序盤ですが、動画を見ながら手を動かして実装していくので、理解しやすいという印象です。
9月中に完了するペースで進めていきます。
Pubmedデータをxml形式で取得する

#はじめに
自分用の覚書記事です。

[以前の記事](https://qiita.com/yoho/items/30ae56d34fa1fecc3d74)で、pubmedから取得したxml形式の論文データを解析するためのpythonクラスを作成しました。

このときはxml形式のデータをpubmedのページから簡単に入手できたのですが、ウエブページが変更されて、簡単に入手できるのがPubmed idだけになってしまいました。

本記事では、Pubmed idのリストから、xml形式の論文データを入手するpythonスクリプトについて記述します。

#E-utilities
[E-utilitiesについてはこちらに記事](https://www.ncbi.nlm.nih.gov/books/NBK25497/)があります(英語)。E-utilitiesは、NCBIデータベースが提供するAPIです。

NCBIからprogram的にデータを入手するには、このAPIのお世話になる必要がありそうです。

ブラウザ経由でデータを入手するには、https://eutils.ncbi.nlm.nih.gov/entrez/eutils/ 以下にある各種fcgiにアクセスすれば良いようです。ただし、1秒間に3回以上アクセスするなということで、これを守らないとアクセス元ネットワークからのアクセスを遮断されてしまうこともあるかもしれません。同僚に迷惑をかけないように注意しましょう。

例えば2件のpubmedデータをxml形式でブラウザ越しに取得するには以下のURLにアクセスします。

```
https://eutils.ncbi.nlm.nih.gov/entrez/eutils/efetch.fcgi?db=pubmed&id=12345678,2345678&retmode=xml
```
[unixからもデータベースにアクセスしやすいように、いろいろ提供されているようです](https://www.ncbi.nlm.nih.gov/books/NBK179288/)が、ここでは取り扱いません。

このようにブラウザ経由などでもデータを入手できますが、この記事では[Biopython](https://biopython.org/docs/1.75/api/Bio.Entrez.html)のEntrezを利用します。

#BioPythonでのデータの取得
コードは以下のようになりました。

```py
import ssl
ssl._create_default_https_context = ssl._create_unverified_context

from Bio import Entrez

Entrez.email = "your.e-mail.address@example.com"#名乗る

pmids = [12345678,2345678]
handle = Entrez.efetch(db="pubmed", id=pmids,retmode="xml")
content = handle.read().decode()
handle.close()
content = content.split("\n",2)[2] +"\n";#最初の2行(htmlヘッダーを取り除く)

```
最初の2行は、接続エラーを回避するためです。この2行を入れないと以下のエラーが出ます。

```.py
ssl.SSLError: [SSL: CERTIFICATE_VERIFY_FAILED] certificate verify failed (_ssl.c:852)
```
https://shinespark.hatenablog.com/entry/2015/12/06/100000 に従ってこの2行を入れましたが、これがなんの処理なのかはわかりません(元記事には注意して使うよう書かれています)。

問い合わせる前に、連絡用のメールアドレスを登録する必要があるようです。
Entrez.efetch()の戻り値(handle)は、

http.client.HTTPResponseクラスのオブジェクト

handle.read()の戻り値はbytesクラスのオブジェクトです。

これを文字列に変換するには、decode()すれば良いようです。

#終わりに
pmidさえ持っておけば、xmlデータを入手できるようになりました。業績リストとかを提出しなくてはいけないシーンがよくありますが、pmidだけ提出すれば良いようになればいいのに、と思います。

が、しかし、当分そうはならなさそうなので、次の記事ではpmidのリストから業績リストを作成するpythonスクリプトを書く予定です。
スマホの時、htmlをfont-size:62.5%;にしないと画面に余白ができる

## iPhone(safari)では大丈夫なのに、Androidは余白が！！！

パソコンでの開発では出なかったのですが、
実機チェックした時、
Android端末では、以下のような空白ができました。。。
chromeだけでなく、chatworkやslackのプレビューでもこの空白ができました。
![スクリーンショット-2020-09-15-14.24.58.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/616900/ea4ac307-3899-f946-d5cb-e76e574db8ee.png)

## 原因
スマホの時、**html**を**「font-size: 62.5%;」**にしていなかったためです。

これは**「ルートのフォントサイズ」**で、
あるサイトにはこう書いていました。
> font-size: 62.5%;は呪文みたいなもの」

[引用][[css]html, bodyのfont-sizeはいくつにしてる？~よく見る62.5%ってなに!?~](https://swallow-incubate.com/archives/blog/20190617/)

有無を言わずに入れとけ!ということですね。


## 対処法

とはいえ、全部のフォントサイズを変えるのは大変なので、
以下のように応急処置しました。
ポイントは、htmlとbody両方に**overflow-x: hidden;**を入れること。
※overflow:hidden;にすると、スクロールできなくなります。

````scss
@media screen and (max-width:768px) { //スマホ時
    html {
        font-size: 90%; //自分が設定したい大きさで
        overflow-x: hidden;
    } 
    body{
        overflow-x: hidden;
    }
}
````
GASを使ってGoogleスプレッドシートからFilemakerにデータを持ってくる方法

# 目的
* スプレッドシートが親のケースで任意のタイミングでFilemakerにデータを同期する。
* 特にそこまでセキュリティが必要無いシートを想定しています。<br>もう少し固めるなら[次の記事](https://qiita.com/unkonow/items/b23dd66d446074b456a2)で解説しています。

## 方法
* タイトルにもあるがGASを用いる事でサーバーを立てることなく実現した。<br>恐らくデータが一定を超えるとGASの6分ルールに抵触するのでダメになりそう。
* データを一括でスプレッドシートの内容に入れ替えるので、更新があったものだけやる場合は面倒そう<br>……ﾔﾀﾞﾔﾀﾞ

### GAS
ソースは以下からお借りし、元ネタはJSONP向けのようでそのままでは使えないっぽかったので改変しました。
具体的にはjsondataあたりを消してMimeTypeをJSONにしました(これいる？)(素人)。
> 元ネタ：https://www.koreyome.com/web/make-spreadsheet-to-json-at-google-apps-script/
> 引用記事：https://qiita.com/taichi0514/items/ee6dedff45f9d9e58ef4

#### Script
~~~javascript
    function getData(id, sheetName) {
      var sheet = SpreadsheetApp.openById(id).getSheetByName(sheetName);
      var rows = sheet.getDataRange().getValues();
      var keys = rows.splice(0, 1)[0];
      return rows.map(function(row) {
        var obj = {}
        row.map(function(item, index) {
          obj[keys[index]] = item;
        });
        return obj;
      });
    }
    
    function doGet(request) {
      var data = getData('～ここにスプレッドシートのID～', '～シート名～');
      return ContentService.createTextOutput( JSON.stringify(data, null, 2) )
      .setMimeType(ContentService.MimeType.JSON);
    }
~~~

#### 設定
公開＞Webアプリケーションとして導入
公開範囲は`Anyone, even anonymous`にする(cURLでアクセスするため)。
後はFM側でシコシコスクリプトいじり。

### Filemaker
こっちでやることは、cURLでデータをよこせオラァ！して新規レコードつくってぶち込むだけ(だけとは)。
#### Script
    URLから挿入 [選択; ダイアログあり:オフ; ターゲット:$result;
    "https://script.google.com/macros/s/hogefuga/... ;
    cURL オプション: "-L"
* ターゲットを変数の`$result`
* URLの指定はさっきGASで発行したURL。もろちん$URLとかの変数にした方が管理しやすいよ。
* cURLオプションはいるかわからんけど`-L`をいれとく

レコードの更新は公式のここを参考にしました。`[" & $i & "]`の後に半角スペースあると泣くので詰めよう。
> https://fmhelp.filemaker.com/help/17/fmp/ja/index.html#page/FMP_Help%2Fjson-functions.html%23

    変数を設定 [$ProductCount ; 値: 
       ValueCount ( 
          JSONListKeys ($result ; "") //←例のようにオブジェクトは無いので""にした 
       )] 
    変数を設定 [$i ; 値: 0]
    If [$ProductCount > 0]
       全レコードを表示
       対象レコード削除 [ダイアログあり:オフ] //←消さないと同じレコードがどんどん増えるよ
       Loop
          新規レコード/検索条件
          フィールド設定 [製品::ID ; 
             JSONGetElement ($result ; "JSONGetElement ( $result ; "[" & $i & "]ID" )")] 
       //↑この部分、例では[" & $i & "]の後に半角スペースあるけど、オブジェクトが無い場合？詰めないとnullが出力される(なんで？)
          フィールド設定 [製品::価格 ; 
             JSONGetElement ($result ; "JSONGetElement ( $result ; "[" & $i & "]品名" )")] 
          フィールド設定 [製品::在庫 ; 
             JSONGetElement ($result ; "JSONGetElement ( $result ; "[" & $i & "]価格" )")]
          レコード/検索条件確定 [ダイアログあり: オフ]
          変数を設定 [$i ; 値 : $i + 1] 
          Exit Loop If [$i ≥ $ProductCount]
       End Loop
    End If

* レイアウト作ったら更新ボタンでも作ってスクリプトを仕込めば完成。

## まとめ
1. 便利なAPIとかコネクタは無いのでcURLで無理やり持ってくる
1. JSONに加工して出力する
1. FM側の全データをスプレッドシートのデータに入れ替える

今回は、スプレッドシートがマスターだったのでこういった感じになりました。
Laravel8 AppかApp\ModelsにModelファイルがない場合にdatabase/factoryは同じフォルダ構成にしないと動かない



Laravel 8にアップグレードして、testを実行したところfactoryのファイルが見つからないとエラーが出ました。
(ModelにHasFactoryは追加済)
```Class 'Database\Factories\Infrastructure\Eloquents\Models\PostFactory' not found```

実際ファイルは下記のように配置していたのでパスが一致してません。
Database\Factories\PostFactory

```修正前PostFactory.php

<?php declare(strict_types=1);

// Factoriesの直下に配置
namespace Database\Factories;

use App\Infrastructure\Eloquents\Models\Post;
use Illuminate\Database\Eloquent\Factories\Factory;

class PostFactory extends Factory
{
    /**
     * The name of the factory's corresponding model.
     *
     * @var string
     */
    protected $model = Post::class;

    /**
     * Define the model's default state.
     *
     * @return array
     */
    public function definition()
    {
        return [
            'name'=> 'test'
         ];
    }
}

```


エラーの該当箇所を見ると、AppかApp\Models以外にmodel.phpが置かれている場合にエラーになるようです。
今回のプロジェクトではInfrastructure\Eloquents\Models配下にModel類を置いているので今更変えるのは難しいです。


```Factory.php
public static function resolveFactoryName(string $modelName)
    {
        $resolver = static::$factoryNameResolver ?: function (string $modelName) {
            $modelName = Str::startsWith($modelName, 'App\\Models\\')
                ? Str::after($modelName, 'App\\Models\\')
                : Str::after($modelName, 'App\\');

            return static::$namespace.$modelName.'Factory';
        };

        return $resolver($modelName);
    }
```  

参考記事にあるようにDatabase\Factories配下にModelフォルダと同じフォルダ構成を作成すれば良さそう。

例

```PostFactory.php
<?php declare(strict_types=1);

// PostModelの配置場所と同じ構成にする
namespace Database\Factories\Infrastructure\Eloquents\Models;

use App\Infrastructure\Eloquents\Models\Post;
use Illuminate\Database\Eloquent\Factories\Factory;

class PostFactory extends Factory
{
    /**
     * The name of the factory's corresponding model.
     *
     * @var string
     */
    protected $model = Post::class;

    /**
     * Define the model's default state.
     *
     * @return array
     */
    public function definition()
    {
        return [
            'name'=> 'test'
         ];
    }
}

```

無事テストが通過するようになりました!



参考記事
https://laracasts.com/discuss/channels/laravel/laravel-8-model-factory-namespaces
gitの使い方(チームメンバー用)

# チームメンバー向けgit,cmd,railsの使い方説明

※チームメンバー用なので雑です

*ディレクトリを移動する*
```cd path\to\railsapp```

*git初期化*
```git init```

*gitのユーザー設定*
```git config --global user.name "ユーザー名"```
```git config --global user.email "メールアドレス"```

*リモートリポジトリをクローンする*
```git clone {URL}```

*読み込み元,書き込み先のURLを確認する*
```git remote -v```

*リモートリポジトリの最新状態を取得する*
```git pull origin master```

*現在の状態をステージに上げる(仮保存的なもの)*
```git add [ステージに上げるファイル]```

*仮保存をコミット(保存)する*
```git commit -m "コミットメッセージ" ```

*リモートリポジトリに反映させる(最新状態でないとエラー)*
```git push origin master```

---------------------------------------
*DBを削除する*
```del db\development.sqlite3```

*マイグレーションする(テーブル作成)*
```rails db:migrate```

*DBにデータを挿入する*
```rails db:seed```

*Railsサーバー起動*
```rails s```
※Ctrl+Cでサーバーを止める

Permission deniedのエラーが発生した場合はtmpフォルダを消すと治る時がある
Qiitaを書き始めてようやくLGTM100いったので、良かった点９選と良くなかった点を言語化してみた

## まえがき

2019/07/01から「Qiitaに記事を投稿し始めてみよう」と決めて投稿をしていました。
そして、時間はかなりかかりましたが、１年ちょっと経ってようやくLGTMが100件つけていただき到達しました。

LGTM（途中までは"いいね"だった）目当てで始めたわけではないですが、ちょうど数としては区切りがいいのでこれを機に良かったこと、そして反省点も踏まえて自分の整理としてもまとめてみました。

結果としては2019/07/01から始めて現在**129**記事です。
※途中からブログに移行したので現在はあまり更新していません。

## 前提、ルール

始めるにあたって自分で設定したルールが下記２点です。

- 平日は朝仕事始める前に1記事あげる
- 内容は、難しいこと・目新しいこと・テクニカルなことなどハードルは高くなくてもいいのでこだわらない、たとえコマンド1つでもいいのでなんでもあげる

## 良かったこと

### 1.言語化能力がつく

モノを書くということは、インプットしたものを自分の頭で考えて、腑に落として、考えて、噛み砕いてアウトプットするので言語化する能力が少しは上がったかなと感じます。
論理的に順序立てて説明するために、話をする時や人に教える際にもより分かりやすく伝えるにはどうしよう？と考えるようになりました。

### 2.ルーティンができる

朝仕事を始める前に１記事書くので、朝から頭の整理をしつつルーティン化して流れを決めた生活ができるようになったのは良かったです。

### 3.要点をわかりやすく意識するようになった

要約はすごく奥が深いです。無駄なことを長々と書いても大事な部分が伝わらないですし、かといって短すぎてポイントが抜けていると意味がない。

要点をまとめるってことは普段から多くの場面であります。
要件を確認する時も、設計をする時も、プログラムする際のタスク整理も、デバッグする時もずっとです。
自分でもまだまだだなとは感じますが、少しずつそれらのことを意識的にできるようになってきたのは大きいかなと思います。

### 4.発信することの大切さを感じる

よく発信等をしている方は「何じゃそれ？」という今更な感じかもしれませんが、
エンジニアはとくに、インプットは皆積極的にするが、自分のことを発信するとなると極端に人数が少なくなるように感じます。

また、すごいことを発信しないといけないんじゃないかという懸念。
簡単なことを出しても馬鹿にされるんじゃないか、など色々思うこともあると思います。
ただ、誰しもグーグル先生に聞きながら調べていくわけで、
人それぞれのフェーズがあります。
自分が新人の時からお世話になった分、発信もしないとなと思います。
内容はピンきりでも、それを見て活用する側は役に立つこともあるでしょう。

もちろん、間違った内容を上げていいとは思いません。
ただ、間違えることは誰にでもあるので、見る側のリテラシも同時に大切だと思います。
人の揚げ足を取ってもしかたありません。
そうして懐広く、裾野を広げることでもっとエンジニア業界も発展していくのではないかと感じます。

### 5.自分の思考を整理できる

日々、考えるということをしていると、なにか頭の中でフワフワとモヤモヤすることもあります。
ただ、それを書いていると自分で自分の思考が整理できるのでこれは副次的な効果でいいなと思いました。

### 6.継続することで自己肯定できる

これは良かったことの中でも自分的にはかなり上位にきます。
人は誰しも承認欲求があると思いますが、同時に、承認されることでの成長には限度があるとも感じます。
自分のことは自分が一番褒めてあげるのが大切だなと思いました。
毎日継続することで自分を肯定して自信につながるのはとてもいいことです。

### 7.インプットが増える

エンジニアとして情報収集する方は多いと思いますが、私は割と逼迫しないとやらないタイプなので、
ネタ切れになるから自然と追い込まれて情報収集・検証する癖がつきました。

途中でコロナ禍という状況に陥り、テレワークに移行しました。
テレワークになってからは人との雑談や周りの雑談、MTG等で受動的に入ってくる情報が減ったので能動的に情報をとりにいくのはこれからの時代更に大事だと感じるようになりました。

### 8.アウトプットする前提なのでインプットの効率があがる

プログラムでエラーになっても、なにかの記事を読んでいても、アウトプットする前提で話を聞いたり見たりするので頭に入ってくる効率がかなり上がったかなと思います。
ライブラリなどを見ていても、
初見でなんとなくは理解できて使う分には使えそうだけど
という時に、これを自分で他人に説明するとなるとちょっとしたことが気になったり気づけたりします。

### 9.メモすることで思考に集中できる

アイデアやネタベースでメモをする癖がついたので、仕事の業務上もその癖がつきました。
例えば、
メールやチャットが来たときの返信やちょっとしたタスクの時に、覚えてて順番に後でやればいいやというスタンスだったのですが、
ちょっとしたことでもタスク管理してメモすることで、「覚える」という記憶することから「考える」という思考することにエネルギーを使えるようになった気がします。
これは副次的ないい効果だったなと思います。

## 良くなかったこと、特に変わらないこと

### 圧倒的に作業量が足りない

前述の通り、作業は平日週５でした。
プログラミング好きでやっている人なんかはとんでもない時間を自然とこなしているわけで
実のところやっているようで、実はあまり作業量としてはまだまだ足りないなと実感しました。
毎日やっている方は改めてすごいなと尊敬の念を抱きます。

### 言葉の選択肢は増えるがにわかに使いたがる

言葉を覚えるということは、言語化の選択肢が増えるので楽しいです。
言語化してモノを書くということは、言葉を多く知っていると伝え方の幅が広がるので良いのですが
IT用語だけに関わらず、ビジネス用語も横文字を覚えると使いたくなります。
コンセンサスやステアリングコミッティやホワイトカラーなど、使いたくなって普段の会話で出ちゃいます。

そしてルー大柴みたいだなと自分で感じてウザいかな？と思うことがあります。

適度にがちょうどいいですね。というか使い慣れていない言葉は相手に伝わらないですよね。

### スカウトなどない

なんかスカウトメールとか来るとか聞いたことあるのであるのかなと思っていました。

そんなものはありませんでした。
内容も薄かったですからね。
（来てもちょっと困りますが‥）

## あとがき

とまあ、
長々と書かせていただきましたが、
書いてみるとありふれたビジネス書に書いてあるような内容になりました。
ただ、本を読んだだけではない自分で経験できたことにすごく意味を感じます。


今はQiitaからブログの方に移行しました。
理由としては技術記事も楽しかったですが、ネタも切れてきますし
ネタのカテゴリの幅も広げたかったのでというところが大きいです。

ふざけた内容の記事も上げていますが真面目に書いています。

https://www.wow-creators.com
【C#】アクセシビリティーに一貫性がありません でちょっと詰まった話

C#でリソースを管理するクラスを作った時に
『CS0053　アクセシビリティに一貫性がありません。
プロパティ型 'Resources' のアクセシビリティはプロパティ 'ResourceManager.Resources' よりも低く設定されています。』
というエラーが出た。

コードとしては以下のような感じ。

```C#:リソース管理クラス
    public class ResourceManager : INotifyPropertyChanged
    {
        /// <summary>
        /// インスタンス
        /// </summary>
        public static ResourceManager Current { get; } = new ResourceManager();

        /// <summary>
        /// 多言語化されたリソース
        /// </summary>
        public Resources Resources { get; } = new Resources();

        /// ここから下は関係ないので省略
    }
```

エラーを見た時はResourceManagerクラスもResourcesプロパティも
『public』なので問題無いのに何故？と思ってたけどよくよくエラーを見ると
プロパティの方ではなくでResourcesクラスがダメだって書いてる。

で、原因はコレ↓
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/373724/a1050a4e-884c-497f-1f0e-3bc44e25311b.png)

リソースのアクセス修飾子が『internal』になってる。
それを『public』として公開したのでエラーになっていたというオチ。
PervasiveデータベースにNode.jsから接続するサンプル

## はじめに
20世紀に作られ現在も稼働中のVBのシステムにデータ出力の要件があったので、Node.jsで実装してみました。
あまりにも情報が少なすぎて苦労したので備忘録として残します。

## 環境

|項目|内容|
|---|---|
|データベース|Pervasive PSQL v10<br>（サービスとして起動）|
|OS|Windwos10|
|node|v13.9.0|
|jdbcライブラリ|jdbc@0.7.2|

## 準備
Pervasiveのインストールディレクトリ配下にある以下の３ファイルが必要です。

* pvjdbc2.jar
* pvjdbc2x.jar
* jpscs.jar

プロジェクトディレクトリに drivers というディレクトリを作ってコピーしておきます。

## ソース
PervasiveのMYDATAデータベースのMYTABLEテーブルから全レコードを取得してJSONを返すAPIサーバーのサンプルです。
なお、このプログラムにルーティングするExpress／Routerのプログラムが別途必要です。
Pervasiveのサービスが起動しているホスト上でプログラムが実行されることを前提としています。

```javascript
const express = require("express");
const router = express.Router();
const JDBC = require("jdbc");
const jinst = require("jdbc/lib/jinst");

if (!jinst.isJvmCreated()) {
  jinst.addOption("-Xrs");
  jinst.setupClasspath([
    "./drivers/pvjdbc2.jar",
    "./drivers/pvjdbc2x.jar",
    "./drivers/jpscs.jar"
  ]);
}

const conf = {
  url: "jdbc:pervasive://localhost:1583/MYDATA?transport=tcp",
  drivername: "com.pervasive.jdbc.v2.Driver",
  minpoolsize: 10,
  maxpoolsize: 100,
  properties: {}
};

const initializeCB = err => {
  if (err) {
    console.log(err);
  }
};

const reserveCB = (err, connObj, sql) => {
  return new Promise((resolve, reject) => {
    if (!connObj) {
      console.log("connObj is undefined");
      reject(err);
    }
    const conn = connObj.conn;
    conn.createStatement((err, statement) => {
      if (err) {
        console.log(err);
        reject(err);
      }
      statement.executeQuery(sql, (err, resultset) => {
          if (err) {
            console.log(err);
            reject(err);
          }
          resultset.toObjArray((err, result) => {
            resolve(result);
          });
      });
    });
  });
};

module.exports = router;

/**
 * テーブルから全レコードを取得しJSONを返す
 */
router.post("/", (req, res) => {
  const jdbc = new JDBC(conf);
  jdbc.initialize(initializeCB);
  jdbc.reserve((err, connObj) => {
    reserveCB(err, connObj, "SELECT * FROM MYTABLE")
    .then(data => {
      const headers = {"Content-Type": "text/json;charset=utf-8"};
      res.set(headers).json(data);
    })
    .then(() => {jdbc.release(connObj, (err) => {if (err) {console.log(err.message);}})
    })
    .then(() => {jdbc.purge(err => {});});
  });
});

```
Beautiful Soupで数字始まりのidをselectする

## 急いでいる人用
* BeautifulSoup 4.7.0 **以降** で以下の処置が必要です。
* cssエスケープで記述します。
* 先頭の`1`を `\\31` にエスケープすると記述できます。
* 0〜9までの数字は `\\30` 〜　`\\39` のようにエスケープします。
* `1234`の場合は `\\31 234` として、先頭の1桁をエスケープしてスペースを入れます。

```
from bs4 import BeautifulSoup
html = '<h1 id="1">test</h1>'
soup = BeautifulSoup(html,'lxml')
soup.select('#\\31')
# >>> [<h1 id="1">test</h1>]
```
```
from bs4 import BeautifulSoup
html = '<h1 id="0123">test</h1>'
soup = BeautifulSoup(html,'lxml')
soup.select('#\\30 123')
# >>> [<h1 id="0123">test</h1>]
```

## BeautifulSoup 4.6.xでの動作
* cssエスケープなしでヒットします。
* cssエスケープをするとヒットしません。

```
from bs4 import BeautifulSoup
html = '<h1 id="1234">test</h1>'
soup = BeautifulSoup(html,'lxml')
soup.select('h1#1234')
# >>> [<h1 id="1234">test</h1>]
```

## BeautifulSoup 4.7.0以降の変更
BeautifulSoup 4.7.0からcss slector のparserの実装がBeautifulSoup独自からsoupsieveに変更になりました。
これにより、複雑なcssセレクタや最新のcssセレクタに対応できるようになっているようです。
https://github.com/facelessuser/soupsieve


## cssエスケープ
こちらの記事が大変参考になりました。
https://qiita.com/ka-ko/items/feacb4d3ff22666d51b1

cssエスケープを行うツールも紹介されています。
https://mothereff.in/css-escapes
WPFのListViewで選択時のスタイルを変更する

# はじめに
ListViewで表示しているテンプレートの選択時のスタイルを変更したかったけど、意外と記事が少ないので残しておくことにしました。

# 環境
Windows 10
Visual Studio 2017

# 完成系
完成系といったけど、関係するところだけ抜粋。

```xml
<Window.Resources>
    <ResourceDictionary>
        <Style x:Key="listBoxItemStyle" TargetType="{x:Type ListBoxItem}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type ContentControl}">
                        <Border
                            Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}">
                            <ContentPresenter />
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
            <Style.Triggers>
                <Trigger Property="IsSelected" Value="True">
                    <Setter Property="Background" Value="Transparent" />
                    <Setter Property="BorderBrush" Value="Silver" />
                    <Setter Property="BorderThickness" Value="10" />
                </Trigger>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="Background" Value="Transparent" />
                    <Setter Property="Opacity" Value="0.5" />
                </Trigger>
            </Style.Triggers>
        </Style>
    </ResourceDictionary>
</Window.Resources>
```

```xml
<ListView>
    <ListView.ItemContainerStyle>
        <Style BasedOn="{StaticResource listBoxItemStyle}" TargetType="ListBoxItem" />
    </ListView.ItemContainerStyle>
</ListView>
```

## テンプレートのスタイルを適用
Borderの背景、ブラシ、線の太さはテンプレートの設定に準拠しますという宣言。

```xml
<Setter Property="Template">
    <Setter.Value>
        <ControlTemplate TargetType="{x:Type ContentControl}">
            <Border
                Background="{TemplateBinding Background}"
                BorderBrush="{TemplateBinding BorderBrush}"
                BorderThickness="{TemplateBinding BorderThickness}">
                <ContentPresenter />
            </Border>
        </ControlTemplate>
    </Setter.Value>
</Setter>
```

## 実際に選択時のスタイルを決める
`IsSelected`が選択時のスタイル。
`IsMouseOver`がマウスオーバー時のスタイル。

この指定だと、マウスオーバー時はちょっと透明に、選択時はグレーの枠線が表示されます。


```xml
<Style.Triggers>
    <Trigger Property="IsSelected" Value="True">
        <Setter Property="Background" Value="Transparent" />
        <Setter Property="BorderBrush" Value="Silver" />
        <Setter Property="BorderThickness" Value="10" />
    </Trigger>
    <Trigger Property="IsMouseOver" Value="True">
        <Setter Property="Background" Value="Transparent" />
        <Setter Property="Opacity" Value="0.5" />
    </Trigger>
</Style.Triggers>
```

## リストビューのスタイルに設定
BasedOnでStaticResourceを設定してOK。

```xml
<ListView>
    <ListView.ItemContainerStyle>
        <Style BasedOn="{StaticResource listBoxItemStyle}" TargetType="ListBoxItem" />
    </ListView.ItemContainerStyle>
</ListView>
```
AWS SAAテスト対策ノート：一問一答集＆試験に出るポイントまとめ

<font color="red">※随時更新していきます！</font>

関連ページ：[AWS SAAテスト対策ノート：暗記すべき数値一覧](https://qiita.com/Kohei-Sato-1221/items/804e437bb2c0a89410ce)


#一問一答集
## EC2
|Question|Answer|
|:---|:---|
|インスタンスがインターネットに接続できない原因|1.PublicIP,ElasticIPが付与されていない<br>2.NACLで許可されていない<br>3.セキュリティグループで許可されていない<br>4.インターネットゲートウェイにルーティングされていない<br>5.インスタンスがDNSを受け取っていない(VPCの設定の問題)|
|CloudWatchの①標準メトリクス、②カスタムメトリクス で取得できる情報|①CPU使用率・DiskReadBytes・NetworkInOut・インスタンスの状態<br>②OSメモリ使用率・ディスク使用率|
|インスタンスの停止時・終了時・再起動時のそれぞれで、インスタンスストアのデータは維持されるか？|**再起動**時のみ維持される。|
|インスタンス終了時にルートボリュームを維持する方法は？|**DeleteOnTermination**をfalseに設定する|
|AMIを作成したリージョンと異なるリージョンで利用する方法はあるか？|利用したいリージョンにコピーすれば可能。|
|インスタンス作成後プライベートIPは変更可能か？また、可能ならその方法は？|変更できない。|
|拡張ネットワーキングとは？|高いパフォーマンスや低レイテンシーを求めるアプリに使用すべきオプション。※インスタンスファミリーTでは使えない。|
|スポットインスタンスの中断時に削除でなく停止にさせる方法|EBSボリュームを使用・persistentで起動|

## ELB
|AutoScalingのデフォルトの終了ポリシーの基準|以下の優先順位で決定。<br>1. 一番多く起動しているAZのインスタンス<br>2. 起動設定が古いインスタンス<br>3. 課金タイミングが違いインスタンス|

## EBS
|Question|Answer|
|:---|:---|
|ColdHDDとスループット最適化HDDの使い分け|前者はデータのアクセス頻度が低い場合に使う。後者はアクセス頻度が高い用途（ログ処理・データウェアハウスなどに使われる）|
|プロビジョンドIOPSとスループット最適化HDDの使い分け|前者はデータベース等のI/Oが頻繁な場合に使うべき。後者はI/O能力は求められないが、アクセス頻度が多い場合に適切。|


## VPC
|Question|Answer|
|:---|:---|
|VPCからIPv６経由でインターネットへの送信を可能にする冗長で高可用性なコンポーネントは？|Egress-Onlyインターネットゲートウェイ|
|サブネットで予約されているIPアドレス（インスタンスに割当できないIP）にはどのような種類がある？|CIDRブロックの最初の４つと最後の１つ<br>(1.ネットワークアドレス 2.VPCルーター用 3.DNSのマッピング用 4.予備 5.ブロードキャストアドレス)|

## S3
|Question|Answer|
|:---|:---|
|新規ファイルPUT時の整合性は？|書き込み後の読み込み整合性|
|既存ファイルPUT・DELETEの整合性は？|結果整合性|
|バケットポリシーとACLはどちらが優先されるのか？|バケットポリシー|
|データ破損検出のためのチェックサムは？|Content-MD5,周期的な冗長性チェック|
|Glacierで無料で取得できる条件は？|「標準」で月に10GBまでなら取り出し可能。|


<br>
<br>

#ポイントまとめ
##EC2
###インスタンスファミリーの選び方
|タイプ|特徴|
|---:|:---|
|M|基本|
|T|バースト可能（要求されるCPUが変動するときとか）|
|C,Z|CPU性能が求められるとき|
|R,X|メモリ性能が求められるとき|
|I,D,H|ストレージ(IはSSD, D,HはHDD)性能が求められるとき|
|F,P,G|GPUやFPGAを使いたい(高速コンピューティング)|
|A|ARMのチップを使いたい|

###リザーブドインスタンス
|項目|説明|
|---:|:---|
|契約期間|1年 or 3年|
|支払い方法|全額前払・一部前払い・前払いなし|
|スタンダードで変更可能な点|AZ・サイズダウン|
|コンバーティブルのみで変更可能な点|インスタンスファミリー・OS・支払い方法・サイズアップ|
|オンデマンドとの比較|稼働率が**70％**を超える場合はリザーブドを選んだ方が安い|

###スポットインスタンス
|項目|説明|
|---:|:---|
|選び方|**バッチ処理**等に向いている。<font color="red">※ミッションクリティカルなタスクには不向き</font>|
|スポットブロック|1~6Hの間で**継続時間を指定**する（停止しないようにブロックする）|
|スポットフリート|インスタンスが停止しても**指定台数の稼働を維持**してくれるオプション|

###ハードウェア占有インスタンス(Dedicated Instance)
- **他利用者とは分離したハードウェア**で実行できる。<font color="red">※物理ホストの指定はできない！</font>

###専用ホスト(Dedicated Hosts)
- **他利用者とは分離したハードウェア**で実行できる。
- **物理ホストを指定可能**なので、BYOLのソフトウェアライセンスを使いたいときに選択する。’


##ネットワーク関連
|項目|説明|
|---:|:---|
|Elastic IPが課金される条件は？|1. EIPがインスタンスにアタッチされていない。<br>2. EIPがアタッチされているインスタンスが停止している。<br>2. 複数のEIPがインスタンスにアタッチされている。|
|EC2インスタンスを停止して起動した場合のIP|Private IP →　変更されない<br>Public IP　→　変更される|

##暗号化に関して
|項目|説明|
|--:|:--|
|RDSのリソースの暗号化|・DBインスタンス作成時にのみ有効化できる。<br>・有効化するとログ・バックアップ・スナップショットが全て暗号化される（個別に指定しない）|
|EBSの暗号化|・ボリューム作成時に暗号化（使用中のEBSは暗号化できない）|
|S３の暗号化|1. SSE-S3（デフォルト・AES-256で暗号化・オブジェクトの**メタデータは暗号化されず**） <br>2. SSE-KMS(デフォルト・KMSのキーで暗号化・証跡を管理可) <br>3. SSE-C(自分で用意したキーで暗号化)|
|S3 Glacier|AES-256で暗号化|
|デフォルトで暗号化されるストレージ・DBサービス|DynamoDB, S3 Glacier, Storage Gateway|
sudoは止めよう！

# はじめに
sudoとはrootでない一般ユーザーがsu commandを実行しなくても1 commandだけroot権限で実行できる便利なcommandです。
しかし危険です。理由を説明してsudoを無効にする方法。sudoを無効にした場合代替オペレーションを解説します。

sudoの挙動について理解し、範囲を限定して設定している方には『釈迦に説法』なので読み飛ばしてください。

- RasPi, NanoPiのような一般にrootが一人しかいないSystem
- Linuxマシンを管理するのが初めてで、入門書に書いてあることを意味も分からずに使っている
- Securityの事は他の本に任せて、とりあえず流行のRasPi入門書で「食いつきがいい」物を書いた作者

が読むことを念頭に書きました。

# ２段階認証方式
Loginにはpasswordが必要です。sshできるLinuxマシンはpasswd一枚で外界から保護されてます。でもpasswdはとっても脆弱です。どんなpasswdを設定しようと現代の技術をもってすれば必ずクラックされます。
しかし２段階認証ではどうでしょう。passwdをクラックしてから実際にログインして、もう一度別のパスワードでsuしなければいけない認証です。
建物の入り口のカギを開け、更に制御室の入り口にもドアがあって別の鍵がかかっている状態を想像するとわかりやすいと思います。

# root loginを禁止する
security確保するため大抵は外部からrootがssh loginできないように設定します。

```
/etc/ssh/sshd_config:
PermitRootLogin no
```

の設定がそれです。

# ドア一枚に戻す
よくできたシステムですね。でも考えてもて下さい、sudoを実行するときrootのpasswdは必要ですか？要りませんね。

```
/etc/sudoers.d/*
/etc/sudoers
```

に書いてあるuserはpasswdなしにsudoを実行できます。
2重だった入り口のドアを1枚はずしてしまったのと同じです。sudoersの設定は、PermitRootLogin yesにしておくのと同程度、systemを弱くしてしまいます。

# 安全対策
2重ドアに戻すのは簡単です。sudoersに一人もユーザーを設定しなければよいのです。
そんなことしたら
「マシン管理ができない！」
悲鳴が聞こえそうですね。
私がunixを覚えたころ、sudoはありませんでした。sudoは後からできた危険極まりない悪commandで、なくてもsystem管理には何ら支障はありません。

# sudoをはずす手段
まずroot passwdを変えます。sudoだけ使っていればroot passwdを知らないってこともあるのではないでしょうか？

```
sudo passwd root
```

sudo最後のお仕事です。まさか"1234"なんて設定しませんよね。しっかり8文字以上英文字記号数字の混じったのをお願いします。金庫の鍵なんです。

```
su
cd /etc/sudoers.d
rm *
```

# マシン管理の代替オペレーション
今既にやりました。

```
su
Password: <root_pass>
```
と、rootになる必要があるときだけrootになればよいのです。

# その他のトラップ
マシンの初期設定は簡単に塞げる危険な罠があります。

- pi, demo, guest, test, nanoといった簡単に推測できるuserは消した方が良いです。
- ftp, sshdのような存在は必要だが、loginしないuserは

```
su
vipw
ftp:x:1005:1005:,,,:/home/ftp:/bin/false
```
のようにlogin shellを/bin/falseに設定します。

# 終わりに
流行の小さなSBCでも、あまり流行ってない小さな小さなSBCでも、ネットに繋いだらクラッカーはやってきます。
小さいから対策も小さくて済む『わけがない！』のです。しっかり対策してください。

Raspberry Pi入門本を見て驚きました。
どれもがpiでloginしてsudoで設定をしているのです。
最初にすべきはたとえわからなくたって

```
sudo passwd root
su
adduser your_name
deluser pi
```
です。
そのままネットワークにつなげられるデバイスです。
ネットワークセキュリティを考えて著作していただきたい。
初心者は書いてある通りに操作するのです。
【Windows】コマンドプロンプトでUTF8の文字コードに対応する方法


コマンドプロンプトの文字コードは日本語がShift−JISで表示されているのでUTF8の文字を見る場合は文字コードを変更する必要がある。

## やり方

以下コマンドを実行する

`chcp 65001`

Shift-JISに変更したい場合
以下コマンドを実行

`chcp 932`

参考URL

[Windowsコマンドプロンプト　文字コード設定 - Qiita](https://qiita.com/user0/items/a9116acc7bd7b70ecfb0)
[chcp | Microsoft Docs](https://docs.microsoft.com/ja-jp/windows-server/administration/windows-commands/chcp)

#Tools/windows#
WPFでImageのSourceにパスを指定していたら削除できなかった話

# TL;DR
* ListViewでとあるフォルダ内の画像一覧を表示しようとした
* WPFのImageのSourceにBindingで画像そのもののパスを与えた
* 表示を終わった時点で使った画像を削除したかったけど、削除できなかった
* 画像のパスじゃなくて、BitmapImageを与えるようにしたら解決

# 環境
Windows 10
Visual Studio 2017

# 最初

```xml:MainWindow.xaml
<Image Margin="10,20,10,20" Source="{Binding ImgPath}" />
```

```cs:MainWindowViewModel.cs
public class ThumbnailImage : BindableBase, IThumbnailImage
{
    private string_imgPath;
    public string ImgPath
    {
        get { return this._imgPath; }
        set { SetProperty(ref this._imgPath, value); }
    }

    public ThumbnailImage(string filePath) {
        this.ImgPath = filePath;
    }
}
```

# 最終

```xml:MainWindow2.xaml
<Image Margin="10,20,10,20" Source="{Binding ImgPath}" />
```

```cs:cs:MainWindowViewModel2.cs
public class ThumbnailImage : BindableBase, IThumbnailImage
{
    private BitmapImage _imgPath;
    public BitmapImage ImgPath
    {
        get { return this._imgPath; }
        set { SetProperty(ref this._imgPath, value); }
    }

    public ThumbnailImage(string filePath) {
        this.ImgPath = CreateBitmapImage(filePath);
    }

    public static BitmapImage CreateBitmapImage(string filePath)
    {
        BitmapImage img = new BitmapImage();
        img.BeginInit();
        img.CacheOption = BitmapCacheOption.OnLoad; // ←ここが重要
        img.UriSource = new System.Uri(filePath);
        img.EndInit();

        return img;
    }
}
```

`CacheOption`を`BitmapCacheOption.OnLoad`にすると、読み込み後に画像ファイルを占有しなくなるそうです。
別WindowにDataFrameを表示する



動画 → https://twitter.com/urekat/status/1305719610956677120?s=20


```.py
from IPython.display import HTML

def popup(df, windowName="default", width=1200, height=1350, top=30, left=-1):
    css = """<style>
    table { border-collapse: collapse; border: 3px solid #eee; }
    table tr th:first-child { background-color: #eeeeee; color: #333; font-weight: bold }
    table thead th { background-color: #eee; color: #000; }
    tr, th, td { border: 1px solid #ccc; border-width: 1px 0 0 1px; border-collapse: collapse;
    padding: 3px; font-family: monospace; font-size: 16px }</style>
    """
    top_js  = f"screen.height {top}-{height}" if top<0 else f"{top}"
    left_js = f"screen.width {left}-{width}" if left<0 else f"{left}"

    s  = '<script type="text/javascript">\n'
    s += '(function(){\n'
    s += '  if(!window._windows) window._windows = {};\n'
    s += '  var win = window._windows["'+windowName+'"]; if(win && win.closed) win = null;\n'
    s += '  if(!win) win = window._windows["'+windowName+'"] = window.open("", "'+windowName+'", "toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=yes, resizable=yes, width='+str(width)+', height='+str(height)+', top=\"+('+top_js+')+\", left=\"+('+left_js+'));\n' #......
    s += '  win.document.body.innerHTML = \'' + (df.to_html() + css).replace("\n",'\\n') + '\';\n\n'
    s += '  win.document.body.style.backgroundColor = "#ffffcc";\n'
    s += '  setTimeout(function(){ win.document.body.style.backgroundColor = \'#ffffff\'; }, 500);\n'
    s += '  win.onfocus = function(){ win.document.body.style.backgroundColor = \'#ffffff\'; };\n'
    s += '  win.onblur  = function(){ win.document.body.style.backgroundColor = \'#fcfcfc\'; };\n'
    s += '})();\n'
    s += '</script>'

    return(HTML(s+css))
```

```.py
import pandas as pd
import numpy as np
df1 = pd.DataFrame(np.random.randn(300,4),columns=list('ABCD'))
popup(df1, windowName="a", width=1200, height=600, top=30, left=-1)
```

```.py
df2 = pd.DataFrame(np.random.randn(300,7),columns=list('ABCDEFG'))
popup(df2, windowName="b", width=1200, height=600, top=700, left=-1)
```


参考: https://stackoverflow.com/questions/40554839/pop-out-expand-jupyter-cell-to-new-browser-window
ブラウザで表示したSVGを画像として扱いたい

お昼ごはんを食べながら「ブラウザで表示したSVGを画像にしてダウンロードしたい」というのは需要がありそうだなと思ったので調べました。

やはりstackoverflowにありました。ありがたいですね。

https://stackoverflow.com/questions/3975499/convert-svg-to-image-jpeg-png-etc-in-the-browser

これをコピペして少しいじって試しました（Chromeで確認）

Demo: https://jsfiddle.net/r208on37/1/

画像をBlob URLで扱うついでに、1アクション挟んで「別タブ表示」「imgタグ」「ダウンロードリンクの生成」もできるか試しました。


### 仕組み

仕組みは大したことはやっていなくて、Blob URLとcanvas便利ですね、という感じです。

- DOM上のSVGをXMLSerializerでSVGタグのテキストとして取り出す
- SVGタグのテキストからBlob URLを生成
- Blob URLをimgタグに読み込ませる（モダンブラウザはSVGをimgタグで扱える）
- imgタグをcanvasに描画
- canvasからBlobを得る
- BLOBからBLOB URLを作り、よしなにする

なので、canvasで扱うタイミングでコピーライトを書き込んだり、いろいろできそうです。

### 反省

XMLSerializerを通していますが、ここはSVGの親タグからinnerHTMLでもいい気がします（svgタグ１つのみであれば）。

ページの使い方によりますが、revokeObjectURLはもう少しちゃんとしたほうがいいかもしれません。

「ダウンロードリンクの生成」はそもそも「最初から勝手に生成して表示してほしい」気はしますが、hrefはあらかじめ作る必要があるっぽいので動的に変化するSVGなどの場合は難しいかもしれません。もしかしたらclickイベントを拾ったタイミングで、Blob URLと`<a>`タグ生成して`click`すればできる気がしますが、~~秋田ので~~試してないです。

あと、ここまで書いて思ったんですが、SVGのままで良い場合はわざわざ画像にする必要はなくimgやcanvasを経由せずに済むので、大幅な短縮ができるでしょう。チャートに書いておきます。

お昼ごはんは冷めました。
無料で使える10のホスティングプロバイダー


### netlify
恐らく、知らない人の方が少ないのではないでしょうか。
GitHubとの連携も非常に簡単です。
https://www.netlify.com/


### Vercel
個人的なイメージではNext.js使っていらっしゃる方が利用しているのではないかと。
人気のnotionでブログを簡単に作れる[notion-blog](https://github.com/ijjk/notion-blog)なんかはVercelで作るのが簡単です。
https://vercel.com/


### Firebase
個人開発やプロトタイプで利用されることがFirebaseは外部APIとの連携も便利で、なおかつSDKがサポートしている言語が広いのが人気の理由かもしれないです。
https://firebase.google.com/


### surge
Front-EndデベロッパーのためのStatic webホスティングとトップページで宣言しています。
`surge`というワンコマンドでファイルをアップロードできるのはTerminalアプリが嫌いな方には良いのかもしれないです。 
https://surge.sh/


### render
Startup Battlefield at Disrupt SF 2019で勝ったサービスみたいです。
位置付け的にはシンプルなHerokuという感じです。
有料版を使えば、バックエンドもホスト可能です。
https://render.com/


### Heroku
恐らく、無料でバックエンド系を使いたい時に一番最初に出てくるのがHerokuではないでしょうか。自分もNodejsでなんか書いた時は条件反射的にHeroku使っていました。
https://www.heroku.com


### Glitch
Heroku同様バックエンドを無料でホストすることができる有名サービスです。
組み込まれたエディタとかでコードを直接簡単に変更できるのはHerokuにはない良さではないかと思います。
https://glitch.com/


### fleek
fleekは他のサービスとちょっと毛色が違ってIPFSを利用にフォーカスしたサービスです。
パッと見た感じ、有名サイトジェネレータはサポートしているみたいです。
https://fleek.co/


### Deta
NodeとPythonをサポートしているサービスです。現状はdatabese(NoSQL)までしかサポートしてないみたいですが、今後はファイルホスティングとAuthもサポートされるみたいなので、今後に期待なサービスです。
https://www.deta.sh/


### begin
serverlessを簡単にがウリみたいです。クレジットカード登録なしで、自前のCI/CDパイプラインを使わせてくれるという何とも太っ腹な感じのサービスです。Denoに言及しているサービスは初めて見ました
https://begin.com/

![Screen Shot 2020-09-14 at 11.59.02 PM.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/24723/49f21e7c-cc77-f775-7025-4e916394d2c2.png)


他にもいくつかあったんですが、キリがいいので10個にしました。（AWS、GCP、Azureも無料枠で使えますが、抜きましたw）
どのサービスも結構ドキュメントが充実しているのが印象的でした。
【Folio LSP】Dockerをざっくり（初心者向け）

この記事は、Folioチュートリアルの簡単な補足記事という位置づけです。
Folioチュートリアル　https://qiita.com/ayungn/items/17ece4e7e06c58194691

#Dockerとは
コンテナ型仮想化を利用するためのツール・環境です。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/342082/4a7fd3b3-023d-0f08-c13b-2cad8f913943.png)


#Dockerを使うと何が嬉しいのか

- ポータブル：コンテナ内で動作するシステムはコンテナ内で完結している。そのため、コンテナを別のサーバに持ち出しても動かせる。
- 軽い：アプリケーションごとのOSが必要がない。（cf. Hypervisor型仮想化）
- セキュア：コンテナは独立していて安全。

:bulb: 例えば、本番環境と同じ環境の検証環境がすぐに立ち上げられます。破棄して作り直すことも容易です。ローカルの開発環境を揃えるのにも役立ちます。

#Dockerコンテナを使うには

- LinuxにDocker Engineをインストールする。
- （WindowsやMacの場合）Docker Desktopをインストールする。Virtual BoxなどでLinux環境を用意してDocker Engineをインストールする。

:bulb: Docker EngineはLinux上で動きます。Folio LSPチュートリアルの場合、①Virtual Box　②EC2（Ubuntu）のどちらかで動かしています。

#Dockerイメージとは
- DockerコンテナはDockerイメージから作ります。
- Docker HubなどのDockerレジストリからダウンロードできます。
- Dockerイメージには、OSだけのものやアプリケーションが入っているものがあります。
- Dockerfileを使うと、元となるDockerイメージを指定して、独自のイメージを作成することができます。

:bulb: Folio LSPでは、アプリケーションが入ったDockerが配布されています。https://hub.docker.com/search?q=folioorg&type=image



#参考
Docker公式ページ　https://www.docker.com/
【Python】動的に変数名を設定する方法と速度比較

#追記
`locals()`は関数内では正常に使用できないとのご指摘をいただきました(そもそも公式ドキュメントでは使うなとまで書いてある）。
使用する際はご注意を。

#はじめに
ほとんど無いと思いますが、動的に変数名を設定したい場合があったりなかったりしちゃったりしちゃわなかったりするかもしれないので、その方法を調べてみました。(外部ファイルからデータを読み込んでそのままファイル名を変数名にしたい場合とか？)

2(+α)通りの方法を発見しましたので、紹介を兼ねて速度を比較したいと思います。

#速度比較のルールと準備
**ルール**
・Jupyter Notebook上で`%%timeit`コマンドを用いて測定。
・ランダムな小文字アルファベット5文字を変数名とする。
・値として0から9までの整数が入ったリストを代入する。
・1,000回ループした平均を測定する。

**準備**
測定に影響しないように、予め変数名を用意する。

```python

import random

chrs = [chr(i) for i in range(ord('a'), ord('z')+1)]
names = [''.join(random.sample(chrs, 10)) for i in range(10)]
```

#方法１　`exec()`を使う
一番よく見かける方法。

```python
%%timeit

for i in range(1000):
    exec(f'{names[i]} = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]')
```

結果
`20.7 ms ± 75.7 µs per loop (mean ± std. dev. of 7 runs, 10 loops each)`

#方法２　`locals()` or `globals()`を使う
`locals()`や`globals()`はそれぞれローカル変数、グローバル変数を管理している辞書という認識です（違ったらごめんなさい）。
通常のディクショナリ型と同様に、インデクサや`.get()`で値を取得、`.update()`で更新などといった操作ができます。

```python
%%timeit
for i in range(1000):
    locals().update({f'{names[i]}':[0, 1, 2, 3, 4, 5, 6, 7, 8, 9]})
```

結果
`386 µs ± 24.2 µs per loop (mean ± std. dev. of 7 runs, 1000 loops each)`

少し方法を変えて

```python
%%timeit
for i in range(1000):
    locals()[names[i]] = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
```

結果
`248 µs ± 387 ns per loop (mean ± std. dev. of 7 runs, 1000 loops each)`

#まとめ
`exec()`比で、
・`exec()`: 1倍
・`locals().update()`: **53倍**
・`locals()[]`: ***83倍***
の早さで定義できました。

**結論**
<h4>`locals() (or globals())`が早いよ。</h4>
torchvision.transforms について

# 記事概要
`torchvision.transforms` の使い方メモです。なお、`transforms.functional` はカバーしていません。

# `torchvision.transforms` とは
画像データの入力を加工してくれる callable なクラス群です。画像オブジェクトを渡すだけで前処理 (オーグメント/正規化等) を行ってくれる便利なクラスですが、**PIL オブジェクトにのみ対応している transforms と torch.Tensor のみに対応している transforms が存在するため、適用順を間違えるとエラーが出ます。** どちらに対応したクラスかは [公式のリファレンス](https://pytorch.org/docs/stable/torchvision/transforms.html#transforms-on-torch-tensor) に載っているため、使う前にチェックするといいと思います。基本的には PIL で操作して、正規化だけは torch.Tensor にすることを覚えておけばよいです。

また、detection や segmentation など ground truth に座標を含むようなタスクではこれらのクラスを利用できない (イメージの変換はできるが、座標の変換はできない) ため、自分でクラスを作る必要があります。

# PIL のみに対応したクラス
## サイズ系
- `CenterCrop`
- `FiveCrop`
- `Pad`
- `RandomAffine`
- `RandomCrop`
- `RandomResizedCrop`
- `Resize`
- `TenCrop`

## 色系
- `ColorJitter`
- `Grayscale`
- `RandomAffine`
- `RandomGrayscale`

## 反転系
- `RandomHorizontalFlip`
- `RandomVerticalFlip`
- `TenCrop`

## 回転系
- `RandomPerspective`
- `RandomRotation`

## 汎用
- `RandomApply`
- `RandomChoice`
- `RandomOrder`

# torch.Tensor のみに対応したクラス
## 線形変換
- `LinearTransformation`

## 正規化
- `Normalize`

## オーグメント
- `RandomErasing` (https://arxiv.org/pdf/1708.04896.pdf)

# その他
## 型変換
- `ToPILImage`(numpy.ndarray or torch.Tensor -> PIL)
- `ToTensor` (numpy.ndarray or PIL -> torch.Tensor)

## 汎用
- `Lambda`
【CakePHP】MySQLに接続のエラー「SQLSTATE[HY000] [2002] No such file or directory」の対処法





##対策法

一つ目はこれ。
https://qiita.com/Yorinton/items/bfdf962fe4b7339866f6


一つ目がダメだったら、app/config/app.phpでdatasousrceのusername、password、database、hostがあっているかどうかをチェックする。
AWS Elastic Beanstalkを使ってみる

AWS Elastic Beanstalkを実際に使用してみましょう。

#アプリケーションと環境を作成する
サンプルアプリケーションを作成するには、 ウェブアプリの作成コンソールウィザードを使用します。Elastic Beanstalk アプリケーションを作成し、その中に環境を起動します。環境は、アプリケーションコードを実行するために必要な AWS リソースのコレクションです。

![スクリーンショット 2020-09-14 14.50.01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/599304/3ec7c8fe-0533-2876-98e3-58dadd47d833.png)

＊オレンジ色のCreateApplicationボタンをクリック

![スクリーンショット 2020-09-14 20.21.08.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/599304/351c62b6-3f16-737e-cc74-8d84c1a1f3a8.png)

必要に応じて、アプリケーションタグを追加します。
アプリケーション名はとりあえずサンプル用のアプリを作って見たかったので「sample」とします。
[プラットフォーム] でプラットフォームを選択し（下の方見切れちゃってますけどサンプルを選択しています。）
そして[アプリケーションの作成] を選択します。

![スクリーンショット 2020-09-14 20.41.10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/599304/9fcdec30-b171-3e31-17ff-3aebf8ee7fc0.png)






これで５分程コーヒーでも飲みながら待っていると、、、。
環境の作成プロセス中、コンソールでは進捗状況が追跡され、イベントが表示されます。


![スクリーンショット 2020-09-15 12.12.32.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/599304/4cf0b540-7467-5ac6-6563-71a11194ab9f.png)


こんな感じですぐに環境が設定できました！
すべてのリソースが起動され、アプリケーションを実行している EC2 インスタンスがヘルスチェックに合格すると、環境のヘルス状態が Ok に変わります。これで、ウェブアプリケーションのウェブサイトを使用できるようになりました。




サンプルアプリケーション用に作成された AWS リソース
サンプルアプリケーションを作成すると、Elastic Beanstalk によって以下の AWS リソースが作成されます。


各プラットフォームは、それぞれ特定の言語バージョン、フレームワーク、ウェブコンテナ、またはそれらの組み合わせをサポートするための、さまざまなソフトウェア、設定ファイル、スクリプトを実行します。ほとんどのプラットフォームでは、ウェブアプリケーションの前にウェブトラフィックを処理するリバースプロキシとして Apache または nginx のいずれかを使用します。そのプロキシがリクエストをアプリケーションに転送し、静的アセットを提供して、アクセスログとエラーログを生成します。

インスタンスセキュリティグループ – ポート 80 上の受信トラフィックを許可するように設定された Amazon EC2 セキュリティグループ。このリソースでは、ロードバランサーからの HTTP トラフィックが、ウェブアプリケーションを実行している EC2 インスタンスに達することができます。デフォルトでは、トラフィックは他のポート上で許可されません。

Amazon S3 バケット – Elastic Beanstalk の使用時に作成されるソースコード、ログ、その他のアーティファクトの保存場所。

Amazon CloudWatch アラーム – お客様の環境内のインスタンスの負荷をモニタリングする 2 つの CloudWatch アラーム。負荷が高すぎたり低すぎたりする場合にトリガーされます。アラームがトリガーされると、Auto Scaling グループはレスポンスとしてスケールアップまたはダウンを行います。

AWS CloudFormation スタック – Elastic Beanstalk はAWS CloudFormation を使用して環境内のリソースを起動し、設定の変更を伝達します。リソースは、AWS CloudFormation コンソールに表示できるテンプレートで定義されます。

ドメイン名 – ウェブアプリケーションまでのルートとなるドメイン名であり、subdomain.region.elasticbeanstalk.com の形式です。

と今回は以上です。
Echonet Liteのパケット構造

#はじめに
自分用の単なる覚書です。
仕事でEchonet Liteやってますが、よく忘れるので

#通信プロトコル
ECHONET-liteはUDPで通信する。
ポート：3610

#ECHONET Liteのパケット構造
こんな感じのバイナリのパケット構造

![スクリーンショット 2020-09-15 11.29.24.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/256408/152ba3d1-74f9-066b-db5f-819bb640cdd1.jpeg)

詳しくは、[ここ](https://echonet.jp/wp/wp-content/uploads/pdf/General/Standard/ECHONET_lite_V1_12_jp/ECHONET-Lite_Ver.1.12_02.pdf)に書いてあります。

#簡単に説明
##ECHONETヘッダ【EHD1,2】
基本的に、0x1081でOK 2Byte
EHD1　:　0x10 = ECHONET Lite、　0x80 = ECHONET
EHD2　:　0x81 = 規定電文形式、0x82　= 任意電文形式

##Transaction ID
基本的には、パケットを送信する毎に、カウントUPする。 2Byte
応答が必要なパケットを送信した時に、どのパケットに対する応答パケットかを紐付けたりする。

##送信元のオブジェクト【SEOJ】、宛先のオブジェクト【DEOJ】
送信元のオブジェクトを示す。 3Byte
[　クラスグループコード、　クラスコード、　インスタンス ]の構造

| クラスグループコード | クラスグループ名 |
|:-:|:-:|
| 0x00  | センサ関連機器  |
| 0x01  | 空調関連機器  |
| 0x02  | 住宅・設備関連機器  |
| 0x03  | 調理・家電関連機器  |
| 0x04  | 健康関連機器  |
| 0x05  | 管理・操作関連機器  |
| 0x06  | AV関連機器  |
| 0x07 ~ 0x0D  | for future reserved  |
| 0x0E  | プロファイルクラス  |
| 0x0F  | ユーザー定義クラス  |
| 0x10 ~ 0xFF  |  for future reserved  |

クラスコードは、上位のクラスグループによって、沢山規定されてるので、規格(Appendix)を見てください。

##サービスコード【ESV】
パケットが書き込みの要求なのか、読み出しの要求なのかを示す。 1Byte
コードは以下の通り

| ESV | 内容 | 記号 | 備考 |
|:-:|:-:|:-:|:-:|
| 0x60  | プロパティ書き込み（応答不要）  | SetI  |  　|
| 0x61  | プロパティ書き込み（応答必要）  | SetC  |  　|
| 0x62  | プロパティ読み出し  | Get  |　  |
| 0x63  | プロパティ通知  | INF_REQ  |　 |
| 0x6E  | プロパティ書き込み読み出し  | SetGet  |　　|
| 0x71  | 書き込みの応答  | Set_Res  |　ESV 0x61の応答　|
| 0x72  | 読み出しの応答  | Get_Res  |　ESV 0x62の応答　|
| 0x73  | プロパティ値通知  | INF  |  |
| 0x74  | プロパティ値通知（要応答）  | INFC  |　　  |
| 0x7A  | プロパティ通知応答 | INFC_Res  | ESV 0x74の応答 |
| 0x7E  | プロパティ書き込み読み出しの応答  | GetSet_Res  |ESV 0x6Eの応答|

#プロパティカウンタ【OPC】
EPCの数を示す。　１Byte
基本的に0x01が多い気がする。

###OPCが0x01の場合
電源をONするコマンドの例

| OPC | EPC1 | PDC1 | EDT1 | 
|:-:|:-:|:-:|:-:|
| 0x01  | 0x80  | 0x01  | 0x30(ON)  |

###OPCが0x02の場合
例えば、照明をONして、調光で1%を指定するコマンドを送信する場合(ESV以降）
EPC1,PDC1,EDT1でONする。EPC2,PDC2,EDT2で調光1%

| OPC | EPC1 | PDC1 | EDT1 | EPC2 | PDC2 | EDT2 | 
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
| 0x02  | 0x80  | 0x01  | 0x30(ON)  |  0xB0 |  0x01 | 0x01(1%)  |  


#ECHONET Liteプロパティ【EPC】
ECHONET Liteのコマンドを示します。 1Byte
EPCは機器によって異なるので、規格書を参照してください。

EPC 0x80は覚えておくと良いです。電源をONOFFするコマンド、基本どの機器も共通
EDT 0x30でON、0x31でOFF

#プロパティデータカウンタ【PDC】
EPCに紐づくデータ（EDT）のBｙte数を示す。 1Byte

#プロパティのデータ【EDT】
EPCに紐づくデータを示す。
これもEPCによって異なるので規格書を参照
League/CSVでSJIS-winでCSV出力する

CSVファイルをSJISで読み込むほうはよく出るのですが、
出力するほうは意外と誰も書いてなかったので私が書きます。

### こうする

```php:document_root/includes/csv.class.php
<?php

//use League\Csv\Reader;
use League\Csv\Writer;
use League\Csv\CharsetConverter;

require dirname(__FILE__) . '/../third_party/league/csv/autoload.php'; // 適宜読み込み先を変更すること。composerとかで読み込んでたら記述いらんかも

class csv
{
  public function __construct()
  {
    //
  }

  /**
   * Export csv as SJIS-win by League/CSV
   *
   * @params string $fileName e.g. "example.csv"
   * @params array $records e.g. [[1, "山田太郎", 80]]
   * @params array $rowHeader [optional] e.g. ["連番", "氏名", "年齢"]
   * @return void
   * @link https://csv.thephpleague.com/9.0/
   */
  public function export($fileName, $records, $rowHeader = [])
  {
    // SJIS-winで出力
    $encoder = (new \League\Csv\CharsetConverter())->inputEncoding('utf-8')->outputEncoding('SJIS-win');

    $csv = \League\Csv\Writer::createFromFileObject(new \SplTempFileObject());

    $csv->addFormatter($encoder);

    // 見出し行
    if(is_array($rowHeader) && count($rowHeader) > 0){
      $csv->insertOne($rowHeader);
    }

    // データ行
    foreach($records as $record){
      $csv->insertOne($record);
    }

    $csv->output($fileName);
    exit;
  }
}
```

```php:document_root/index.php

require dirname(__FILE__) . '/includes/csv.class.php';

$csv = new csv();

$fileName = "ファイル名.csv";
$rowHeader = ["み","だ","し","行"];
$records = [
  ["な","か","み","1"],
  ["な","か","み","2"],
  ["な","か","み","3"]
];

$csv->export($fileName, $records, $rowHeader);
```

### 参考URL

https://csv.thephpleague.com/9.0/converter/charset/
https://qiita.com/kiyc/items/f70280e13e5194e5dd94
【JS学習その③】truthyとfalsy、そしてAND条件・OR条件とそのテクニック

#JS学習シリーズの目的
このシリーズは、私ジャックが学んだJavaScriptのメカニズムについてアウトプットも兼ねて、
皆さんと知識や理解を共有するためのものです。
(理解に間違いがあればご指摘いただけると幸いです)

#truthyとfalsyの定義
* truthy・・・Booleanで真偽値に変換した場合にtrueになる値のこと
* falsy・・・Booleanで真偽値に変換した場合にfalseになる値のこと

#truthyとfalsyの見分け方
truthyとfalsyの見分け方は、基本的にfalsyのものを覚えて、falsy以外のものは全てtruthyだと判断することになります。
falsyのものはそれほど多くないので覚えるのは難しくないと思います。
それでは以下で説明しますね！

#falsyな値
* false
* 0 (数字)
* 0n (big int)
* "" (空文字)
* null
* undefined
* NaN (Not a Number)

※truthyはそれ以外の値

#AND条件とOR条件
AND条件は`&&`で記述し、OR条件は`||`で記述します。
この条件演算子は主にif文で使用し、AND条件は左辺と右辺が両方ともtruthyならtrue、
OR条件は左辺と右辺のどちらかがtruthyならtrueを返します。

```main.js
let a = 0;
let b = 1;
let c = 2;
let d = null;

console.log(a && b); /*false*/
console.log(b && c); /*true*/

console.log(a || b); /*true*/
console.log(a || d); /*false*/
```

#AND条件とOR条件の返す値とそれを使用したテクニック
前述したAND条件とOR条件は、それぞれ
AND条件・・・左辺から見ていって、falsyなものがあれば、その値を返す
OR条件・・・左辺から見ていって、truthyなものがあればその値を返す

このことを利用して、例えば次のようなコードが書けます

```main.js
function like(fruit) {
    fruit = fruit || apple;
    console.log('I like ' + fruit);
}

like(); /*'I like apple'*/
like(grape); /*'I like grape'*/

let fruit;

fruit && like(); /*何も表示されない*/
```

このように変数`fruit`がtruthyかfalsyかでlike関数の中の`fruit`の値を変更しています。
上記の場合、OR条件で`fruit`に値を指定していなければ`I like apple`、値が指定されていれば`I like `(`fruit`に指定された値)(今回は`grape`)、となります。
また、AND条件で今回の場合`fruit`に値が指定されておらず、falsyなので`undefined`が返り、何も表示されません。

#まとめ
いかがでしたでしょうか。truthyとfalsy及びAND条件とOR条件はJavaScriptにおいてとても大事なのでしっかりと理解しておきましょう！
mindの研究 その6

#概要

mindが謎なので調べてみた。
vistaに入れた。
スタックの動き、調べてみた。

#サンプルコード


```
メインとは
　１００をつみ
　２をつみ
　「hello world!」をつみ
　「SP=」を　表示し　スタックポインタを　ダブル表示し　改行し
　一行表示する
　改行する
　「SP=」を　表示し　スタックポインタを　ダブル表示し　改行し
　数値表示する
　改行する
　「SP=」を　表示し　スタックポインタを　ダブル表示し　改行し
　数値表示する
　「SP=」を　表示し　スタックポインタを　ダブル表示し　改行し
　スタック検査する。



```

#結果

```


SP=001DD760
hello world!

SP=001DD768
2
SP=001DD770
100SP=001DD778


```

以上。
Google Sheets API v4 を scala から使い cell の内容の FORMULA を get する方法

Google Sheet API 4 だと、

https://developers.google.com/sheets/api/reference/rest/v4/spreadsheets.values/get

の、 ```valueRenderOption``` を Scala で使う方法について。

Java の Client API Library の、

https://developers.google.com/sheets/api/reference/rest/v4/spreadsheets.values/get

を使うことになる。


```
val response = service.spreadsheets.values.get(spreadsheetId, range).setValueRenderOption("FORMULA").execute
```

のような感じ。
ポートフォワーディングを使用して踏み台経由でSFTP接続する

いつもいつも覚えられないのでメモる。

目的のサーバに直接繋げられずに踏み台サーバを経由してssh接続/SFTP接続する方法


```shell
ssh -L 2001:目的サーバのhost:22 username@踏み台サーバのhost

#例
ssh -L 2001:192.168.1.1:22 shindev@35.65.113.24 -i nantoka.pem
```

つながったらファイル転送ソフトで

|項目|値|
|---|---|
|プロトコル|SFTP|
|ホスト|localhost|
|ポート|2001|
|ユーザ|目的サーバの接続ユーザ|
|パスワード|そのパスワードまたは踏み台サーバで作った鍵|