OmniAICreator/Qiita-1.07M huggingface dataset:
[metabase]複数の値でフィルタする

#環境
metabase v0.33.6
metabaseはこちら→https://www.metabase.com/

#やりたいこと
複数の値でフィルタを行いたい。
分析する際に顧客IDを100個指定したりとか、
本州の都道府県とかを指定するのに
デスクトップ上のExcelに情報を保管し
その値でmetabaseのフィルタを行いたい。

Excelで言うところの↓これの大量データ版
![スクリーンショット 2020-01-24 18.58.12.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/539241/f30cd8d0-3583-50fd-33b8-4675e197b263.png)

マニュアル見ても書いてなかったのでQiitaに記事として残しておく。

#やり方
1.フィルタリングしたいデータをカンマ区切りでつなげた状態とする
　※大体CSVみたいな感じ

![スクリーンショット 2020-01-24 19.04.23.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/539241/149d377e-9d3c-cc1e-c761-efd01a37c9a3.png)

2.そのデータをCTRL+Cなどでコピーする

3.metabaseのここに貼り付ける

![スクリーンショット 2020-01-24 19.05.34.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/539241/3d32d25a-12e0-ae5a-9dc8-4d31761a2790.png)

すると、、

![スクリーンショット 2020-01-24 19.08.37.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/539241/a2a8ce85-67b5-e150-8ff6-45e16dc529c4.png)

こうなる。

#最後に
　見つけたときは感動しました。　
　非常によく使う機能だからマニュアルには書いておいてほしい。
【Rails】掲示板に禁止ワードを設定する

掲示板にクローラー的なやつがリンクやスクリプトを書き込み始めたので、暫定的な対応をしました。

```comments_controller.rb
def create
 #以下の4行で対応
  prohibited_words = ['a href=', '<script']
  if prohibited_words.any? { |p| comment_params[:content].include?(p) }
    redirect_to(comments_url) && return
  end
  @comment = Comment.new(comment_params)
  if @comment.save
.
.
```

説明不要かもですが、まず`prohibited_words = ['a href=', '<script']`で禁止ワードを設定して、`prohibited_words.any? { |p| <検証したい文字列>.include?(p) }`で検証したい文字列に禁止ワードが含まれているかをチェックしています。

p.s.
掲示板荒らし対策に詳しい方、ご連絡ください。
[mariaDB] ストアドファンクション内のDECLARE文でシンタックスエラーが出る

# はじめに

mariaDBでストアドファンクションを定義している最中、絶対に間違っていないDECLARE文でエラーが出ました。

```sql:定義したかったFunction
CREATE OR REPLACE FUNCTION test (arg INT)
RETURNS INT DETERMINISTIC
BEGIN
  DECLARE numA INT DEFAULT 0;
  SET numA = arg;

  DECLARE numB INT DEFAULT 0;
  SET numB = numA;

  RETURN numB;
END;
```
受け取った引数を変数`numA`に入れて、
`numA`を変数`numB`に入れて、
`numB`をreturnするだけ。

```console:結果
ERROR 1064 (42000) at line 3 in file: '(ファイル名)': You have an error in your SQL syntax; check the manual that corresponds to your MariaDB server version for the right syntax to use near 'DECLARE numB INT DEFAULT 0;
  SET numB = numA;

  RETURN numB;
END' at line 8
```
`DECLARE numB INT DEFAULT 0;`の辺りがおかしいよと。
え～？`numA`はよくて`numB`はダメなの？


# 変数宣言は先頭だけだった

```sql:定義できたFunction
CREATE OR REPLACE FUNCTION test (arg INT)
RETURNS INT DETERMINISTIC
BEGIN
  DECLARE numA INT DEFAULT 0;
  DECLARE numB INT DEFAULT 0;

  SET numA = arg;
  SET numB = numA;

  RETURN numB;
END;
```
```console:結果
Query OK, 0 rows affected (0.00 sec)
```

`DECLARE`をファンクションの**先頭**にまとめて書いたらできた。
そういう感じなんだ、勉強になった。。。


# 参考

https://www.atmarkit.co.jp/ait/articles/0209/12/news001.html
これから学習経過をサンプル込みで残すとしたら、どの言語、どのブログで残すべきかを調べてみた。

折角なので学習経過のログをブログに残そうと思い、機械学習と深層学習を組み込むべき言語の選別を兼ねて、Qiitaの企業ランキングを眺めてみる。

[”The RedMonk Programming Language Rankings: June 2019”](https://redmonk.com/sogrady/2019/07/18/language-rankings-6-19/)
["ブラウザを通して機械学習を動かす「deeplearn.js」を使ってみる"](https://rest-term.com/archives/3220/)
["ドーナツ領域問題を多層パーセプトロンで解かれたサンプルコード"](https://github.com/niisan-tokyo/learning_deeplearnjs/blob/master/double_circle.ts)
>環境を作る手間が省けるので楽そう？

[”Qiitaの企業ランキング”](http://qiita-orgs-rank.mat-aki.net/organizations/360)
Qiitaの企業ランキングの上位には名だたるテックカンパニーが軒を連ねていて、
企業のテックリード的なトップ層の方々が、ランキングを牽引する記事を書き続けている。
凄い記事ばかりで圧倒される。

>1位から10位あたりまで大手のテックカンパニーで占められている。
>50位くらいまではテクノロジーに力を入れている企業様が多いような印象です。

ピックアップに特に意味は無いです。
一部のHRテック企業は、QiitaやGitHubのプルリクエスト、connpassのイベント参加履歴でヘッドハントする仕組みを持っているそうで、日々の継続的な活動の大切さを改めて痛感。

周囲で少しだけ話題？の「note」も調べてみた。
[”なぜ「note」には、記事のランキングがないのか？代表の加藤貞顕さんが目指す“ネットで安心して書き続けられる場所作り”](https://www.huffingtonpost.jp/entry/note-vision_jp_5ce62224e4b09b23e65dbf1b)

> “ネットで安心して書き続けられる場所作り”
> ぶっちゃけ投稿はじめてフォロー中の有名な知人の記事のDAUどうなの？

投げ銭の仕組みはMediumに似ているようで異なるようですね。
ランキングは提供されないとの事で、それはそれで平和で良いのかな？
[”noteとMedium比較：2020年からブログ始めるならどっち？”](https://medium.com/%E6%97%A5%E6%9C%AC%E8%AA%9E%E3%81%A7%E8%AA%AD%E3%82%80/note%E3%81%A8medium%E6%AF%94%E8%BC%83-2020%E5%B9%B4%E3%81%8B%E3%82%89%E3%83%96%E3%83%AD%E3%82%B0%E5%A7%8B%E3%82%81%E3%82%8B%E3%81%AA%E3%82%89%E3%81%A9%E3%81%A3%E3%81%A1-2d9427710284)

> 有名ライターならnoteに書けばいい、無名だからMeduimに書く
> でにエンジニアなわたしは"Qiita"一択。忖度して"note"に投稿などしない。

という事で、他にもお勧めのプログラム言語の組み合わせとブログ等ご意見アドバイス頂けると嬉しいです。
Elastic Beanstalk インスタンスの定期スケールアップ・ダウン

# 改善
12:00~13:00のみ負荷のかかるElastic Beanstalkの環境がある。
インスタンスタイプの調整で費用を抑えたい。


# lambda_function.lambda_handler
```python:python3.8
import json
import boto3
from datetime import datetime

def lambda_handler(event, context):
    envName = str(event['env-name'])

    instance_type = ''
    curr_hour = (datetime.now() + timedelta(hours=9)).hour

    print(curr_hour)
    
    if(curr_hour == 11): #11時に上げる
        instance_type = 'c5.xlarge'
    elif(curr_hour == 13): #13時に下げる
        instance_type = 't3.micro'
    else:
        return 'NONE'

    client = boto3.client('elasticbeanstalk', region_name="ap-northeast-1")

    response = client.update_environment(
        EnvironmentName=envName,
        OptionSettings=[
            {
                'Namespace': 'aws:autoscaling:launchconfiguration',
                'OptionName': 'InstanceType',
                'Value': instance_type,
            }
        ],
    )

    return {
        'statusCode': 200,
        'body': json.dumps('Hello from Lambda!')
    }


```

# CloudWatch Events
例）cron(5 * ? * * *)


# テストイベント
```json
{
  "env-name": "app-env"
}
```

# 参照
 * https://boto3.amazonaws.com/v1/documentation/api/latest/reference/services/elasticbeanstalk.html
 * https://docs.aws.amazon.com/ja_jp/elasticbeanstalk/latest/dg/environment-configuration-methods-after.html
 * https://docs.aws.amazon.com/AWSCloudFormation/latest/UserGuide/aws-properties-beanstalk-environment.html
【C#】NPOIを使って「.xls」の外部参照URLを無視する方法

# 概要
- C# をつかって「.xls」拡張子のエクセルファイルを書き込むが、参照できないURLがbookに含まれているときの処理について

# 使用バージョン
- .NETFramework 4.6.1
- NPOI 2.4.1

# やりたいこと
- 一括で「.xls」ファイルに入っている指定のセルの書き込みをする
- 例:sheet1のC3に数字を書き込む
- "=sheet1!C3" と書かれているセルがあり、セルの内容を反映（セルの評価）したい

# 適用Source

```
var book = WorkbookFactory.Create(@"C:\sample.xls");

var sheet = book.GetSheet(XlsxSheet.SheetName);
//ブック全体の数式を評価
book.GetCreationHelper().CreateFormulaEvaluator()bookWriter.EvaluateAll();
                                         
```

# エラーがおきる
- 以下エラー

![error.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/245167/aab59106-f09d-d772-7469-20c40017dbdf.png)

- NPOI.Util.RuntimeException:Could not resolve external workbook name... NPOI.SS.Formula.Workbook.NotFoundException: Could not resoleve external workbook name...

# 推測される原因
- Excelの機能で、セルに対して他のファイルから読み取ったセルを代入することができるが
そのファイルパスが参照できない、開けない状態。

# 対策
```
var book = WorkbookFactory.Create(@"C:\sample.xls");

var sheet = book.GetSheet(XlsxSheet.SheetName);

var bookWriter = book.GetCreationHelper().CreateFormulaEvaluator();
//外部参照URLを無視
bookWriter.IgnoreMissingWorkbooks = true;
//ブック全体の数式を評価
bookWriter.EvaluateAll();       
```

# 所感

- NPOIってJavaのPOIから移行してるってこともあり、POIのリファレンスをみると分かる
- ただNPOIとPOIは移行とはいえ、メソッドの名前やクラスの名前がイコールではないため、コピペは不可。
- ググっても「ignore」を使っている人がいなかったで上げてみました。初投稿です。誰かのためになれば幸いです。
PHPStormのTemplateを設定してdeclare(strict_types=1)を常に設定する

# PHPStormのTemplateを設定してdeclare(strict_types=1)を常に設定する

PHP7から`declare(strict_types=1)`が導入され、設定している場合は暗黙的な型変換が行われなくなり、より厳密にタイプヒンティングをチェックするようにできます。

しかし`declare(strict_types=1)`はファイル単位でしか効力が無いため、常にファイルの冒頭に書かなければいけません。

これを矯正するためにPHPStormに設定を追加します。

<img width="1016" alt="スクリーンショット 2020-01-24 18.38.47.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/47882/d4aee817-3870-a6c2-613b-ce5815503ddf.png">

PHPStormのCode Templatesを利用します。

Preferences > Editor > File and Code TemplatesでPHPを選択し、テンプレートの初めに`declare(strict_types=1)`を追記しましょう。

これでPHPファイルを作成するときに自動的に`declare(strict_types=1)`が追加されます。
VSCodeでC#のインテリセンスが効かないとき

プロジェクトを開いたときに右下にこれが出る。

![SomeProject.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/59664/6cb82fb2-6bba-9296-85be-71bde2a68e49.jpeg)

このとき、Output の `OmniSharp Log`

![OmniSharpLog.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/59664/4506460d-6853-7530-d5ee-6901ff062863.jpeg)

に下記のメッセージが出る。

```
Microsoft.Build.Exceptions.InvalidProjectFileException: 指定された SDK 'Microsoft.NET.Sdk' は見つかりませんでした。  
```

# 何が起きているか

OmniSharp(C#のインテリセンス) が使う MSBuild のバージョン？があっていない。

# 環境変数で、OmniSharp の使う MSBuild を指定する

.NETCore-3.1 で動かす例

`MSBuildSDKsPath=C:\Program Files\dotnet\sdk\3.1.100\Sdks` (PATHに注意。マイナーバージョンちがうなど `C:\Program Files\dotnet\sdk\3.1.101\Sdks`)

設定してから、VSCode を再起動してエラーが無くなれば成功。
逆にUnityなどで .NET-4.7 などを対象にする場合は動かなくなるかもしれぬ。

# OmniSharpの設定(~/.ominisharp/omnisharp.json)

```json
{
    "MsBuild": {
        "MSBuildSdksPath": "c:/Program Files/dotnet/sdk/3.1.101/Sdks"
    }
}
```

これはうまくいかなかった。書き方が違うのかもしれない。

https://github.com/OmniSharp/omnisharp-vscode/issues/3074

# 関連

* https://h.s64.jp/entry/omnisharp_msbuild_2017_conflict 
* https://qiita.com/Densyakun/items/42515bb3e5e8b1b8cb7f

上記の記事では、Visual Studio Build Tools 2017 のアンインストール や Visual Studio をインストールするにより、MSBuild のインストール状況が変わるので間接的に解決していると思われる。
MSBuildは、.NETSdk や VisualStudio に付属しているものが知らない間にインストールされることがあるので、OmniSharp が適切なMSBuildを発見できなくなることがありそう。

逆に環境変数 `MSBuildSDKsPath` が間違って動かない場合もある。

* https://qiita.com/kenichiuda/items/3a17cc6c547b2eb52ae8
FortranでTemplate Library (FTL) を使う

**Fortran Template Library (FTL)** と名付けられた[Standard Template Library (STL) みたいなライブラリがFortranでも提供されている](https://github.com/SCM-NV/ftl)ので，その使い方のメモ．
コンパイラは Intel Fortran Compiler 19.0.4.243 を使用する．

# 使い方

ここでは，`home`ディレクトリに`temptemp`ディレクトリを作成してFTLの実験をする．

## 準備

まずはダウンロード：

```
$ cd ~
$ mkdir temptemp
$ cd temptemp
$ git clone https://github.com/SCM-NV/ftl.git
```

`ftl/makefile`を4箇所編集：

```:makefile
#PLATFORM ?=gnu
PLATFORM ?=intel

#BUILD ?=debug
BUILD ?=release

#PREFIX ?=/usr/local
PREFIX ?=~/temptemp/ftl/local

#USE_PCRE ?=true
USE_PCRE ?=false
```

makeすると`PREFIX`で指示した`local`ディレクトリが作成され，必要なファイルが用意される：

```
$ cd ~/temptemp/ftl
$ make install
$ tree local
local
├── include
│   └── ftl
│       ├── ftlAlgorithms.F90_template
│       ├── ftlArray.F90_template
│       ├── ftlDynArray.F90_template
│       ├── ftlHashMap.F90_template
│       ├── ftlHashSet.F90_template
│       ├── ftlList.F90_template
│       ├── ftlMacros.inc
│       ├── ftlSharedPtr.F90_template
│       ├── ftlhashmodule.mod
│       ├── ftlkindsmodule.mod
│       ├── ftlregexmodule.mod
│       └── ftlstringmodule.mod
└── lib
    └── libftl.so

3 directories, 13 files
```

## 使用例
使いたいコンテナに応じて，自分でモジュールを用意してコンパイルし (instantiation)，
`use`して使うことになる．

### 倍精度実数の動的配列
`std::vector<double>`みたいなコンテナを使ってみる．
まず次のような`.F90`ファイルを`~/temptemp/ftl/local`に作る：

```hoge.F90
#define FTL_TEMPLATE_TYPE real(real64) ! 要素は倍精度実数型
#define FTL_TEMPLATE_TYPE_NAME Real ! コンテナの名前に使う．この場合，モジュール名はftlDynArrayRealModule，型名はftlDynArrayReal となる．
#define FTL_TEMPLATE_TYPE_MODULE iso_fortran_env
#define FTL_INSTANTIATE_TEMPLATE
#include "ftlDynArray.F90_template" ! 動的配列のテンプレート
```

```test01.F90
program test01
    use,intrinsic :: iso_fortran_env, wp=>real64
    use ftlDynArrayRealModule
    implicit none
    type(ftlDynArrayReal) dArr

    dArr=[1.0_wp,2.0_wp,3.0_wp]

    write(6,*) dArr%data
end program test01
```

ここで，マクロを使用するために`hoge.F90`の拡張子は大文字でなければならない．
コンパイルする：

```
$ cd ~/temptemp/ftl/local
$ ls
hoge.F90  include  lib  test01.F90
$ ifort -I include/ftl/ -c -diag-disable=6843 hoge.F90
$ ls
ftldynarrayrealmodule.mod  hoge.F90  hoge.o  include  lib  test01.F90
$ ifort hoge.o test01.F90
$ ./a.out
   1.00000000000000        2.00000000000000        3.00000000000000
```

コンテナに含まれるメソッドについては [FTLのWiki](https://github.com/SCM-NV/ftl/wiki) を参照されたい．
STLを普段使ってる人なら想像できるはず．


*工事中．*
Numpyのブロードキャストについて

# ブロードキャストとは
Numpyでは、次元の異なる行列同士の演算を行う際に自動で適切な形に変換してくれる機能が備わっており、これをブロードキャストと呼びます。
見たほうが早いと思うので以下に書きます。

```Python
A = np.array([1, 2, 3, 4, 5])
print(f'{"="*20}A')
print(A)
print(f'{"="*20}A-1')
# (1, 5)行列とスカラ値の演算
print(A - 1)
```
```
====================A
[1 2 3 4 5]
====================A-1
[0 1 2 3 4]
```

# 内部の挙動
Numpyでは次元の異なる行列の演算を行う際に自動で次元を合わせてくれています。
例えば、$(m, n) + (1, n)$の演算では$(1, n)$を拡張して$(m, n)$に変換しています。

$$
\begin{bmatrix}
1 & 2 & 3 & 4 & 5\\\ 
6 & 7 & 8 &9 & 10 
\end{bmatrix}
\-
\begin{bmatrix}
1 & 2 & 3 & 4 & 5
\end{bmatrix}\\\
\=
\begin{bmatrix}
1 & 2 & 3 & 4 & 5\\\ 
6 & 7 & 8 &9 & 10 
\end{bmatrix}
\-
\begin{bmatrix}
1 & 2 & 3 & 4 & 5\\\ 
1 & 2 & 3 & 4 & 5 
\end{bmatrix}
$$

```python
A = np.array([
    [1, 2, 3, 4, 5],
    [6, 7, 8, 9, 10]])
B = np.array([1, 2, 3, 4, 5])
print(f'{"="*20}A')
print(A)
print(f'{"="*20}B')
print(B)
print(f'{"="*20}A - B')
print(A - B)
```
```
====================A
[[ 1  2  3  4  5]
 [ 6  7  8  9 10]]
====================B
[1 2 3 4 5]
====================A - B
[[0 0 0 0 0]
 [5 5 5 5 5]]
```
Googleスプレッドシートでセル内の文章を自動翻訳する(日⇔英)

#Googleスプレッドシートでセル内の文章を自動翻訳する(日⇔英)

以下のような表を作り、試しにジョンレノンの名言を自動翻訳してみます。
<img width="621" alt="スクリーンショット 2020-02-23 15.30.01.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/530421/c930ecaa-52d6-34d0-1e10-380ff7b7f983.png">



B2セルに下記の関数を入力します。
googletranslate([原文セル],"[翻訳元言語]","[翻訳後言語]")

```
=IF(A4="","",googletranslate(A2,"en","ja"))
```

こんな感じになりました。
キレイな翻訳ではないが、まぁまぁまぁまぁまぁ　笑
<img width="603"  alt="スクリーンショット 2020-02-23 15.33.34.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/530421/c1f3b666-2334-ac50-d7b8-337f81c6132a.png">

ちなみに後から書いた文章でも
<img width="599" alt="スクリーンショット 2020-02-23 15.37.55.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/530421/64596aac-01c1-9884-3823-1dd4d9701a19.png">

翻訳してくれます。
<img width="601" alt="スクリーンショット 2020-02-23 15.38.13.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/530421/0247ca4e-3990-9cd7-6f58-435d7643364a.png">

マニュアルが英語しかない！　なんて時にご活用ください！
Android Studio For Beginners Part 1をKotlinでやってみた(初心者向け)

# 背景
Android Studio For Beginners Part 1 (https://www.youtube.com/watch?v=dFlPARW5IX8) を動画に沿ってやってみた。

本動画での使用言語はJavaだったが、私はKotlinを選択した。途中からJavaでコーディングする工程があり、Kotlinに変換する作業に苦戦したので、備忘録として残しておく。

# コード
```kotlin:MainActivity.kt

package com.example.myapplication

import android.os.Bundle
import androidx.appcompat.app.AppCompatActivity
import kotlinx.android.synthetic.main.activity_main.*

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)


        this.addBtn.setOnClickListener{
            var num1 = this.firstNumEditText.text.toString().toInt()
            var num2 = this.secondNumEditText.text.toString().toInt()
            var result = num1 + num2
            this.resultTextView.text = result.toString()
        }
    }
}
Androidで特定部分だけ角丸にする

`shape`の`corner`に`topLeftRadius`みたいなパラメータがあるので、角丸にしたい部分だけ指定してあげれば角丸になる。以下は上だけ角丸にした場合。

```xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <solid android:color="@color/white" />
    <corners
        android:topLeftRadius="4dp"
        android:topRightRadius="4dp" />
</shape>
```

全体角丸は`radius`で指定したほうがわかりやすい

```xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <solid android:color="@color/white" />
    <corners android:radius="4dp" />
</shape>
```
Win 10 搭載の「BIZ UDフォント」の「アンダーバー」の「表示がされない／うすい」件

#アンダーバーの表示

[「BIZ UDフォント」は「Windows 10 October 2018 Update」に標準でインストールされている][win_for]
らしいのですが、どういうわけか、~~「_（アンダーバー）」が表示されず、「半角スペース」が代わりに表示されます。（「メモ帳」などで検証することができます。）~~**「_（アンダーバー）」の表示が、ユーザーの環境によって変わることがわかりました。（消えることもあります。）**

<details><summary>Windows10 のバージョンごとの検証情報</summary><div>


+ この記事は、2020年1月24日に投稿され、2020年2月12日に最新の更新がされています。

+ この記事で書かれている「BIZ UDフォント」に関する情報は、Windows10に搭載されているものを使用して検証されています。

+ この記事の内容は、2019年9月に正式リリースされた
Windows 10 バージョン1909
によって検証されています。

+ この記事の内容は、2018年10月に提供開始された
Windows 10 October 2018 Update（Windows 10, version 1809）
によって検証されています。

+ [[Windows 10] Windowsのバージョンを確認する方法（富士通Ｑ＆Ａ）](https://www.fmworld.net/cs/azbyclub/qanavi/jsp/qacontents.jsp?PID=2510-8772&usagefrom=clup20190529)
</div></details>

#影響するフォント
「BIZ UDフォント」として[「Windows 10 October 2018 Update」に標準でインストールされているのは、以下の6書体だそうです。][win_for]
[win_for]:https://forest.watch.impress.co.jp/docs/news/1149745.html

* BIZ UDゴシック Regular　等幅
* BIZ UDゴシック Regular　プロポーショナル
* BIZ UDゴシック Bold　等幅
* BIZ UDゴシック Bold　プロポーショナル
* BIZ UD明朝 Medium　等幅
* BIZ UD明朝 Medium　プロポーショナル

#詳細
これまでに判明したことは、
「**ディスプレイの拡大縮小の設定** [^注1] 」
[^注1]: 「ディスプレイの拡大縮小の設定」とは、「設定 ＞ ディスプレイ」で行う設定です。![ディスプレイの設定画面.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/327025/a3b7c36b-53cd-e847-82d7-95a24159a8bb.jpeg)

「**使用するアプリケーション**」
「**フォントサイズ**」
によって、状況が変化する
ということです。

「メモ帳」と「Ｅｄｇｅ」について、調べてみました。

##メモ帳
まずは、Windows標準のテキストエディタ「**メモ帳**」における状況です。
**黄色**のマーカーは、アンダーバーが消えかかっているもの、
**赤色**のマーカーは、アンダーバーが消えてしまったものです。

###ディスプレイの拡大縮小の設定：**１００％**　の場合

![DSP100%.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/327025/ead8814a-ba46-7d27-2d71-75c1449eee79.jpeg)
※フォントサイズ：15 [^注2] の時に、アンダーバーが消失してしまいました。

[^注2]: 　ディスプレイの拡大縮小「１００％」環境におけるフォントサイズ「１５」というのは、ディスプレイの拡大縮小「１２５％」環境におけるフォントサイズ「１２」と同じ大きさと考えて試してみたら予想通り消失しました。（ 12 x 125% = 15 ）

###ディスプレイの拡大縮小の設定：**１２５％** 　の場合


フォントサイズ：12の時に、アンダーバーが消失してしまいました。

![DSP125%.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/327025/771acbf0-cabf-1e45-64a2-7dc737fe46e8.jpeg)


##Ｅｄｇｅ
次に、Windows標準のブラウザ「**Microsoft Edge**」における状況です。
Ｅｄｇｅでは、アンダーバーの消失は見られませんでしたが、見えにくい状況はありました。

###ディスプレイの拡大縮小の設定：**１００％**　の場合
![Edge(100%).jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/327025/ac22a279-785a-160e-43b2-5105b116d95f.jpeg)

###ディスプレイの拡大縮小の設定：**１２５％**　の場合
![Edge(125%).jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/327025/0d191fdd-0cec-6457-9fb8-d48cd608de78.jpeg)


#まとめ
このように、
「ディスプレイの拡大縮小の設定」
「使用するアプリケーション」
「フォントサイズ」
によって、アンダーバーが消えかかったり完全に消えたりすることが見られました。

とても見やすいフォントだったので残念です。
PHP の array_reduce 関数 分かりやいサンプル

```php

array_reduce ( array $array , callable $callback [, mixed $initial = NULL ] ) : mixed
```

array_reduce() は、配列 array の各要素に callback 関数を繰り返し適用し、 配列を一つの値に減らします。

例：

```php


<?php

function sum($carry, $item) {
    var_dump($carry, $item);
    $carry += $item;
    echo '<br><hr>';
    return $carry;
}

$a = array(1, 2, 3, 4, 5);

var_dump(array_reduce($a, 'sum', 10));

```

結果

int(10) int(1)
int(11) int(2)
int(13) int(3)
int(16) int(4)
int(20) int(5)
int(25)
文字列からそれぞれの文字がいくつあるか調べる。

```py:1
s = 'aeqwtwegwa'
d = {}

for c in s:
    if c not in d:
        d[c] = 0
    d[c] += 1

print(d)
```

```:1の実行結果
{'a': 2, 'e': 2, 'q': 1, 'w': 3, 't': 1, 'g': 1}
```

```py:2
s = 'aefqwdqfqwe'
d = {}

for c in s:
    d.setdefault(c, 0)
    d[c] += 1

print(d)
```

```:2の実行結果
{'a': 1, 'e': 2, 'f': 2, 'q': 3, 'w': 2, 'd': 1}
```

標準ライブラリからdefaultdictを読み込んで書くと、

```py:3
from collections import defaultdict

s = 'raegiowejgohg'
d = defaultdict(int)

for c in s:
    d[c] += 1
    
print(d)
print(d['g'])
```

```:3の実行結果
defaultdict(<class 'int'>, {'r': 1, 'a': 1, 'e': 2, 'g': 3, 'i': 1, 'o': 2, 'w': 1, 'j': 1, 'h': 1})
3
```
Raspberry Pi 4 Computer Model B 2GB を設定してみた

# 作業の前提条件と目的
- これまではラズパイ3を使用
- ラズパイ3から4へ移行する

#ラスパイ3から移行する際の注意点
- HDMIからマイクロHDMIに変わっているのでケーブル(or 変換アダプタ100均で購入可能)が新しく必要
- 電源がtype-Bからtype-cへ変更しているので電源コードも新しく必要

#作業の流れ
1. 公式から最新のraspbianをダウンロード
(https://www.raspberrypi.org/downloads/raspbian/)

2. マイクロSDにイメージの書き込み

3. ラズパイ4にマイクロsdを挿していざ電源ON！
ここで問題発生。ディスプレイに映らない。
こちらを参考にしました。(https://qiita.com/karaage0703/items/97808dfb957b3312b649)
ラズパイ3で使っていたconfig.txtをそのまま使ったら上手くいきました。

4.開発環境の構築。要するにqtのインストール
こちらを参考にしました。(https://qiita.com/soramimi_jp/items/b2b238d1537dbb99abea)


#感想
- 電源やらHDMIやら今までと変わっているのでちょっと焦りました。
- ラズパイ3からインストールの方法は大きく変わってなかったです。
MacのPowerPointのカラーピッカー

これバグなのかしら。なぞ仕様なのかしら。
自分のMacのPowerPointのカラーピッカーの使い方。
なぞ仕様すぎてすぐ忘れるのでメモ

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/255465/b1792026-6606-0356-0120-59b8710ffac4.png)

- スポイトアイコンをクリック（青くなる）
- ピックしたい箇所でクリック
- スポイト左の色枠を右側の枠にドラッグ＆ドロップ
- するとスポイト左に指定した色が出現する！
- これもまた右にドラッグすると色が使えるようになる
HARMAN製 AIR SDK Beta Release Notes version 33.1.0.16 の一部 適当翻訳 

[Adobe AIR Pre-Release [BETA] - version 33.1.0.16 の Release Notes](https://airsdk.harman.com/assets/pdfs/Release_Notes_AIR_SDK_BETA.pdf) を適当に翻訳したものです。
精度は保証しかねます。

### 8 Windowsビルド

SDKは32-bitと64-bitのWindows環境をサポートします。
インストール可能な共有ランタイムの更新はありません。開発者は対象アプリケーションを含むフォルダを作成するための `bundle` オプションを使う必要があります。
エンドユーザーへのアプリケーションの容易な配布とインストールを行うために、サードパーティーのインストーラーメカニズムを使ったパッケージ化が必要になります。
HARMANは AIR Developer Tool が開発者にWindowsアプリケーションのためのMSIファイル作成を可能にする為に、以前のAIRインストーラーへの適応を検討しています。
※以前のAIRインストーラーへの適応(adapting the previous AIR installer)とはどういう意味だろうか？

[バンドルパッケージ作成方法](https://help.adobe.com/ja_JP/air/build/WSfffb011ac560372f709e16db131e43659b9-8000.html)

64-bitアプリケーションは `-arch x64` コマンドラインオプションを使う事で作成可能です。

Windowsバンドルパッケージは現在商用利用のユーザーのみ利用可能です。


### 9 MacOSビルド

MacOS builds are provided only as 64-bit versions.
MacOs向けビルドは64-bitのみサポートされます。

既にあるアプリケーションの為に限定艇な共有ランタイムオプションが用意されています。しかし、新規/更新のアプリケーションはWindowsと同様にアプリと共にランタイムが配布されるバンドルパッケージの利用を想定しています。
※Catalina ではAIRランタイムの新規インストールが出来ない問題を解決する為に特別にランタイムのみを提供してくれるという事だろうか？
数字で始まるIDを使ってるとBootstrap4でmodalが開かなくて困った

`bootstrap3`までは数字で始まる`id`を使ってても問題なくモーダルが開いてくれてたんですが、`bootstrap4`になると開かなくなりました。

```.html
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#3298_post_modal">
  Launch demo modal
</button>

<div class="modal fade" id="3298_post_modal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog" role="document">
```

ちなみにJSで

```.js
$('#3298_post_modal').modal()
```

と呼び出す場合はちゃんと表示されます。

HTML5では数字から始まって問題ありませんが、HTML 4.01は以下のように規定されてました。つまり規定をちゃんと守ってないと痛い目見るよという話ですね。

>ID and NAME tokens must begin with a letter ([A-Za-z]) and may be followed by any number of letters, digits ([0-9]), hyphens ("-"), underscores ("_"), colons (":"), and periods (".").
MacBook Pro などでディスプレイをスリープ状態にする

## [スリープ、ログアウト、システム終了に関するショートカット](https://support.apple.com/ja-jp/HT201236)
参考にした情報：
「control + shift + 電源ボタン」キー または 「control + shift + メディア取り出し」キー

## [How can I sleep the display from Terminal?](https://apple.stackexchange.com/questions/35699/how-can-i-sleep-the-display-from-terminal)
参考にした情報：
ターミナルで `pmset displaysleepnow` コマンドを入力する
管理者権限が必要な場合は、`sudo pmset displaysleepnow` する

## [Force-Sleep the Display on a 2010-2011 MacBook Air](https://www.jeffgeerling.com/blogs/jeff-geerling/force-sleep-display-2010-2011)
参考にした情報：
1. ホットコーナーに割り当てる：「システム環境設定」を開き、「デスクトップとスクリーンセーバー」に移動し、「スクリーンセーバー」タブを選択して、「ホットコーナー…」をクリック。
2. お好みのコーナーのドロップダウンを開く。
3. [ディスプレイをスリープ状態にする]をクリックする。**お勧めなのは、コマンドキー（または別の修飾キー）を押しながら、[ディスプレイをスリープ状態にする]をクリック。この利点は不用意なスリープが防げる。**

## イジェクトキーをリマップする
[Karabiner-Elements](https://pqrs.org/osx/karabiner/) を使用して、イジェクトキーをF12キーなどに割り当てる。
1. Karabiner-Elementsのアプリを起動する
2. Preferences→　Function Keysタブ→　f12のプルダウンメニューをejectに設定する

参考資料：[Karabiner-Elementsを使ってキーボードを快適に使えるように設定する](https://webrandum.net/karabiner-elements/)
参考資料：[Karabiner-Elementsの設定項目をまとめました](https://qiita.com/s-show/items/a1fd228b04801477729c)
APIとは

##データ通信形式
主に、XMLとJSONがあります。
XMLは、最近見ないがYahoo!などでレスポンス形式として使われている。
JSONに比べ、記述する項目が多く、新しくAPIを作るのであれば推奨されない。

最近では、JSONが一般的。
JSONもフォーマットとして構造化され、記述量が少ないので、データ通信形式としては非常に扱いやすく、可読性も高い。

##API設計
「なぜAPI設計を作ろうとしているのか」という目的を明確化すること。

外部APIであれば、「どのデータを公開するか」を選定し、
「ユーザーに何を取得させたいのか、または編集させたいのか」を決めること。

内部APIであっても、「どのサービスに使わせる予定か」「どうしてDBアクセスではなく、APIにするか」という理由を明確化すること。

APIを介するということは、DB操作と比較してオーバーヘッドがあることを忘れてはいけない。

APIを作る理由を決めることは、どのデータをAPIとして触れるかを決めることです。

APIの設計という意味では、HTTPリクエストにおける「エンドポイントの設計」と「レスポンスの設計」がある。

エンドポイント設計する上での注意点。

APIは一般的にセッション管理のようなものはなく、1リクエスト1レスポンスで完結するため、状態を持ちません(ステートレス)。
そのため、一つのリクエストで必要な情報を受け取るRESTfulの考え方にはマッチしているのです。

###リクエスト形式
HTTPリクエストを送信する方法として大きく2つ。
1) JSON
2) フォーム

フォーム形式が一番基本的です。
フォームでのPOST送信の場合、文字データだけではなく、画像や動画などのバイナリデータも送ることができます。

JSON形式
こちらは構造化したJSONデータなので送る際に可読性が上がるというメリットがある。

代表的なHTTPメソッド
HTTPリクエストを送る際、HTTPメソッドで送る必要があります。

GET
リソースを取得するメソッド。
GETメソッドで情報を登録/変更するのは、基本的に禁止です。
情報を取得するだけのメソッドである。

POST
リソース情報を作成・登録する場合に用います。
すでにあるリソースを変更する場合は、PUTやPATCHを利用。

PUT
すでにある何らかのリソースを変更する処理。
URLを以下のようにして特定することが多い。
http://api.example.com/users/:userId

DELETE
削除処理を行うのがリソースです。
PUTと同じようにURLにリソースIDを含めるのが一般的です。

PATCH
変更処理を行うメソッド。
PATCHとPUTの違いは、PUTが指定したリソースの要素を全て入れ替えるのに対し、
PATCHは一部だけ入れ替えるイメージです。
ただPATCHに関しては、対応しないフレームワークもあるので採用は慎重に。

POSTやPUTなどの変更系のAPIにおいては、レスポンスにリクエストを返却してあげると
例えばtwitterなどレスポンスにリクエストを含めています。

##レスポンスの構造
エラー

    200系：正常系
    300系：リダイレクト系
    400系：ユーザーの入力がおかしい場合
    500系：サーバー内にて何かエラーが起きている

エラーレスポンスに対して、どのようにエラーメッセージを返せば良いか。
返し方は下記の2通り。

- エラーメッセージをレスポンスボディを返す
- ヘッダにエラーメッセージを込める

実際にAPIを利用している際に、「どうやってエラーが返ってきているのか」を確認する際に、ヘッダを確認するよりもボディの内容を確認する方が楽なので、ボディに入れて返してあげるのがユーザーフレンドリ。

ヘッダ
ヘッダに情報を入れるケースは、多いと思います。
例えば、認証のための情報を例に挙げると「X-Auth」「X-Token」などが使われます。
自分で定義したものに関しては、「X-」をつけるのが一般的です。








参考資料
http://www.atmarkit.co.jp/ait/articles/1511/19/news022_4.html
WindowsでGitを使うときの改行コード設定

Git for Windowsでの改行コード設定が意図したものになっているかの確認方法と
設定変更後の適用確認方法について。

今回はautocrlf=falseにしたい。

## 確認方法
global設定を確認するため
ローカルのmasterブランチで下記のコマンドを実行する。

```
XXX ~/Github/XXXXX (master)
$ git config --global -l

user.name=username
user.email=username@XXXX
core.autocrlf=true
core.quotepath=false
core.safecrlf=false
```
下記のように設定一覧をリストで確認することはできるが
この場合確認できる反映範囲は一番最後に設定した内容を読み込んでいるため
ユーザー全体に反映されているかの確認が必要。

```
XXX ~/Github/XXXXX (master)
$ git config -l
```

autocrlfをfalseに設定する。

```
XXX ~/Github/XXXXX (master)
$ git config --global core.autocrlf false
```
反映されているかを確認

```
XXX ~/Github/XXXXX (master)
$ git config --global -l
user.name=username
user.email=username@XXXX
core.autocrlf=false <- falseになった
```

# 適用結果確認方法
LFになっているべきファイルがCRLFになっている場合、正しい差分として検出できるか確認するため
ローカルの別リポジトリにチェックアウトし
再度ローカルのmasterブランチにチェックアウトする。

差分が発生した場合、ファイルを特定しCRLFにより差分が出ていることを確認する。


インデックスに存在しない変更点をすべて削除。

```

XXX ~/Github/XXXXX (master)
$ git checkout ./
Updated XX paths from the index
```
差分のファイル数が表示され、完了。
Macでマイクを使うとAirPodsの音質が悪くなったりブツブツと途切れたりするときの原因と対処法

Mac で通話/録音ソフトなどを使用するとき AirPods を音声入力に指定している場合、ブツブツと途切れたり音質が悪くなったりすることがあります。これは音声入力を内蔵マイクに切り替えることで解決します。
※ 接続自体が切れる場合にはこの記事は該当しません。

追記：公式サポートページです: https://support.apple.com/ja-jp/HT208896

# 原因
普段は AirPods を使用して音楽などを聴く際には AAC コーデックが使用されますが、AirPods のマイクが動作するときには SCO コーデックというモノラル8kHzの低音質モードに切り替わってしまうそうです。
Apple はこの問題を認識していますが、いつ修正されるかはわかりません。

> Apple claims that the poor Mono 8kHz quality which affects recording and indeed simultaneously playback on Mac when the AirPod microphones are activated, is because the SCO codec then gets employed over the entire Mac audio system. This is supposedly "expected behaviour" when trying to use the AirPods and other Bluetooth headsets together with a computer, according to Apple.

> The AAC codec is normally used when just listening to playback on the AirPods. It's just very unfortunate that SCO – low-quality as it may be – upon AirPod microphone activation is not only limited to doing recording, but also displaces AAC and audio playback.

> Apple Support claims that Apple is looking at this issue, and that improvements might be coming in future firmware updates, but I did not interpret that as a promise to be honest. But for the time being, I'd say that the benefits of making calls and so forth with AirPods on Macs are quite limited.

# 対処法
現時点では、音声入力には AirPods を使用せずに、内蔵マイクを使用するしか方法がありません。
音声入力を内蔵マイクに変更するには `⌥ Option` キーを押しながらメニューバーの音量ボタンをクリックし、入力から「内蔵マイク」を選択します。出力は AirPods を選択します。

# 参考
AirPods: Extremely poor mic quality on Mac
https://apple.stackexchange.com/questions/282705/airpods-extremely-poor-mic-quality-on-mac
【Vue.js】ESLint 最速セットアップ

# ESLintをシンプルに設定する

ESLintの設定ってややこしいですよね

Vue.jsとJavaScriptの開発環境で
最低限のものをシンプルに設定する方法を紹介します


```
今回使用するJS Concept: 

 - Standard JS
 
今回使用するpackages:

 - ESlint
 - husky
 - lint-staged
```

## 1.package.jsonに以下を追記します。

```JSON:˜/package.json
{
  "scripts": {
    "lint": "eslint src"
  },
  "husky": {
    "hooks": {
      "pre-commit": "lint-staged"
    }
  },
  "lint-staged": {
    "*.{js,vue}": [ 
      "eslint --fix",
      "git add"
    ]
  },
  "devDependencies": {
    "babel-eslint": "^10.0.3",
    "eslint": "^6.5.1",
    "eslint-config-standard": "^14.1.0",
    "eslint-plugin-import": "^2.18.2",
    "eslint-plugin-node": "^10.0.0",
    "eslint-plugin-promise": "^4.2.1",
    "eslint-plugin-standard": "^4.0.1",
    "eslint-plugin-vue": "^5.2.3",
    "vue-eslint-parser": "^6.0.4"
  }
}
```

## 2.eslintの設定ファイルを作成します
```js:˜/.eslintrc.js
module.exports = {
    root: true,
    parser: 'vue-eslint-parser',
    parserOptions: {
        ecmaVersion: 2018,
        parser: 'babel-eslint',
        sourceType: 'module'
    },
    extends: ['standard'],
    plugins: [
        'vue'
    ],
    rules: {
        'vue/html-indent': ['error', 2] // 2 spaces for html indent
    }
}


```



## 3. ```npm install``` を実行します。(yarn userは ```yarn``` )

```console:command-line
$ npm install
```

## 4. Editorでの設定を追加します。
### JetBrains系の場合
Preference -> Search: ESlintで Manual ESLint configuration を選択
ESlint package と Configuration fileを以下の様に設定します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/187150/1f1f5645-e845-8124-b367-cd4ba05b583a.png)


### VSCodeの場合

ESLint用のextentionがあるので追加します。
https://github.com/microsoft/vscode-eslint


設定は以上です。


## eslintを実行します。
```console:command-line
$ eslint --fix FILE_PATH
```

以上です。
シンプルな設定から始めてカスタマイズしていくと段々理解が深まって面白いです！
点と点を繋げる　DotConnect Expression コピぺ用

点と点を繋げる・―・DotConnect Expression [AfterEffects Tutorial]
https://youtu.be/_ze_tLIk5iQ

#こちらにエクスプレッション置いておきます。

```jsx
var n = thisComp.numLayers;
var array = [];
var myPosition = transform.position;

for ( var i=1; i <= n ; i++){
	var mylayer = thisComp.layer(i);
	var targetPosition = mylayer.transform.position;
	var distance = length(myPosition,targetPosition);
	if (mylayer.name.match(/Dot/)){
		array.push([mylayer.name,targetPosition,distance]);
	}
}

function compare(a,b){
	return (a[2]-b[2])
}

array.sort(compare);
var myGrpIdx = thisProperty.propertyGroup(1).propertyIndex;
try{
	var resultPos = array[myGrpIdx][1]-myPosition;
	createPath(points = [[0,0], resultPos], inTangents = [], outTangents = [], isClosed = false)
}catch(e){
	content("Connect").content("パス 1").path
}


```
WiringPi インストール方法

:::note
2024/07/11 追記：

新しい記事を書きました。こちらを参照ください。

WiringPi インストール方法 2024 年版
「https://qiita.com/nanbuwks/items/895922211cc65448a110」
:::


Raspbian Buster Lite (Version:September 2019)
には入っていなかったので以下のようにしてキメた。

# CLIのインストール

```

sudo apt install wiringpi

```

これでインストールされるのは2.50

# python3 バインディング

```

sudo apt install python3-pip
sudo pip3 install wiringpi

```

# 2.52のインストール

2.50 の問題として、RaspberryPi 4 で動作しないらしい。解決するには 2.52 にする必要がある。 


2.52にするための方法：
http://wiringpi.com/wiringpi-updated-to-2-52-for-the-raspberry-pi-4b/
【VSCode】やっておきたい設定&入れておきたい拡張機能

# VSCodeにやっておきたい設定

※便利だったものを随時追加予定

設定ファイルは、「Code > 基本設定 > 設定」で開く。
jsonを直接編集する or フォームから単語検索！

### インデントの強調

```settings.json
highlightActiveIndentGuide: true
```

### 不要な行の削除

```settings.json
"files.trimFinalNewlines": true
```

# VSCodeに入れておきたい拡張機能

[Bracket Pair Colorizer](https://marketplace.visualstudio.com/items?itemName=CoenraadS.bracket-pair-colorizer) :各カッコの対応を色付きで表示する。


[Path Intellisense](https://marketplace.visualstudio.com/items?itemName=christian-kohler.path-intellisense) :パスの入力補助。

[Output Colorizer](https://marketplace.visualstudio.com/items?itemName=IBM.output-colorizer) :出力結果を色付けする。


[Trailing Spaces](https://marketplace.visualstudio.com/items?itemName=shardulm94.trailing-spaces) :行末の空白を強調表示してくれる。

`settings.json`を下記のように編集すると、コード保存時に末尾の空白を削除できる

```settings.json
"files.trimTrailingWhitespace": true
```

[Auto Rename Tag](https://marketplace.visualstudio.com/items?itemName=formulahendry.auto-rename-tag) :片方のHTMLタグを修正するともう片方の自動で修正する。

[indent-rainbow](https://marketplace.visualstudio.com/items?itemName=oderwat.indent-rainbow) :インデントを色分けする。インデントずれも赤色で教えてくれる。

[Regex Previewer](https://marketplace.visualstudio.com/items?itemName=chrmarti.regex) :正規表現をエディタでチェックできる。
`option + command + m`で起動。

[Todo Tree](https://marketplace.visualstudio.com/items?itemName=Gruntfuggly.todo-tree) :TODO などのコメントを一覧表示する。

[peacock](https://marketplace.visualstudio.com/items?itemName=johnpapa.vscode-peacock) :プロジェクトごとにワークスペースのカラーを変える。

[Material Icon Theme](https://marketplace.visualstudio.com/items?itemName=PKief.material-icon-theme) :ファイルやフォルダにアイコンを表示。


[pritter](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode) :コードフォーマッター（ソースコードを整形するツール）。
npm、yarnでもインストールできる。eslintと一緒に使うとよい。
`prettier-eslint`を使うことでprettierで整形した結果を`eslint --fix`に渡すことができ、コンフリクトしない。

[Whitespace+](https://marketplace.visualstudio.com/items?itemName=davidhouchin.whitespace-plus) :スペースに色付けする。使いたい時に。


# 参考にさせていただいた記事
https://qiita.com/sensuikan1973/items/74cf5383c02dbcd82234

https://www.hypertextcandy.com/visual-studio-code-extensions
[Android] コールバック

##作るもの
以下をコールバックを使って実装する。
・ボタンを押すと非同期処理を実行する
・非同期処理が終わったら画面に「終了」を表示する
![スクリーンショット (4).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/506451/6a9eae7a-1976-cae3-0d91-8742d2635edd.png)


##用意するクラス
・AsyncTaskCallback.java　 コールバックインターフェース
・MainActivity.java 　　　　コールバックインターフェースを実装する
・HttpAsync.java　　　　　　非同期処理クラス

##使い方
AsyncTaskCallback.java

~~~java
public interface AsyncTaskCallbacks {
    public void onTaskFinished();    //終了
    public void onTaskCancelled();   //キャンセル
}
~~~

MainActivity.java

~~~java
public class MainActivity extends AppCompatActivity implements AsyncTaskCallbacks {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        setAsyncButton();
    }

    private void setAsyncButton(){
        Button button = findViewById(R.id.button);
        button.setOnClickListener((View v)->{
            HttpAsync httpAsync = new HttpAsync(this);
            httpAsync.execute();  //非同期処理呼び出し
        });
    }

    @Override
    public void onTaskFinished() {
        TextView textView = findViewById(R.id.text);
        textView.setText("終了");
    }

    @Override
    public void onTaskCancelled() {
        TextView textView = findViewById(R.id.text);
        textView.setText("キャンセル");
    }
}
~~~

HttpAsync.java

~~~java
public class HttpAsync extends AsyncTask<Integer, Void, Integer> {

    private AsyncTaskCallbacks callbacks_ = null;

    //コールバック登録用コンストラクタ
    public HttpAsync(AsyncTaskCallbacks _callBacks){
        this.callbacks_ = _callBacks; //コールバック登録
    }

    @Override
    protected Integer doInBackground(Integer... params) {
        //何かの処理
        return null;
    }

    @Override
    protected void onPostExecute(Integer result) {
        callbacks_.onTaskFinished(); //非同期処理が終了したらonTaskFinished()を呼ぶ
    }

    @Override
    protected void onCancelled() {
        callbacks_.onTaskCancelled(); //非同期処理がキャンセルされたらonTaskCancelled()を呼ぶ
    }
}
~~~

##感想
参考URLのサイトがかなりわかりやすくて簡単に実装できた。

##参考URL
https://seesaawiki.jp/w/moonlight_aska/d/Activity%a4%cb%a5%b3%a1%bc%a5%eb%a5%d0%a5%c3%a5%af%a4%b9%a4%eb
MotionLibraryで購入したアニメーションが動かない件の解決策の一例

# はじめに
Unity内のモデルを動かすためのモーションを専用に扱ったモーションサイト、MotionLibraryというものがあります。多くは１つのモーションにつき3ドル~6ドルで、量は少ないですが無料のモーションもあります。
個人的感覚ですが、基本的にモーションの購入はAssetStoreで買うよりもこっちで買う方が安く済みますし効率が良いです。

# 問題
MotionLibraryでモーションを購入すると、FBXファイルがインポートされます。
そのFBXファイルの中のアニメーションをanimatorにアタッチしてPlayしても、モデルがいい感じに動いてくれない時があります。

僕の場合、本来なら購入したモーションの動き通りにモデルが動くはずですが、モデルがずっと座ったような状態が続きました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/453437/dc25a99b-7cfa-0a2f-1be7-5b41b3653f87.png)
画像は、想定通りに動かなかった時のスクショです。


# 解決策
私の場合、以下のようにして解決できました。

### 問題のFBXファイルを選択
インポートしたFBXはMotionLibraryディレクトリの中にあるはずです。その中で、想定通りに動かないFBXを選択してください。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/453437/decf9478-7f09-862a-70df-d37c6a7e36b4.png)

### Inspectorの確認
選択したFBXのInspectorの中のRigを見てください。
Animation TypeがHumanoid以外になってませんか。
僕の場合、このAnimetionTypeがHumanoid以外だと上手く動きませんでした。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/453437/329f15cb-1923-b3db-1b50-906bf46ff5c8.png)

### Animation Typeの編集
先ほどのAnimationTypeを、Humanoidに変更して、右下のApplyを押してください。これでいい感じに動くようになったはずです。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/453437/36ed39ab-8911-3bff-3384-15764d892576.png)

# さいごに
別のインターネット上の記事では他の解決方法が紹介されていたりします。
もしもこの記事の事をしても上手くいかない場合、他の記事も参考にしてください。以上です。
【MySQL】起動の仕方

## 状況

MySQLが起動できない。
データベースの中身を全部消しても問題ない。
失敗1~3 => 成功　の順番で実行した。


### 成功

参考
[mysqlがどうしても起動しない](https://qiita.com/_natsu_no_yuki_/items/ae4c94187093e4ab3cdc)

実行コマンド
```sudo rm -rf /usr/local/var/mysql```
```brew uninstall mysql```
```brew install mysql```
```sudo mysql.server start```

```
Starting MySQL
. SUCCESS!
```

```mysql -u root```

```
Welcome to the MySQL monitor.  
```

もしくは
[The server quit without updating PID file　mysqlエラー解決方法](https://qiita.com/kazu_wsx/items/bb787e9e4e919da03705)

### 失敗1

参考
[MySQLクライアントに Can't read dir of '/usr/local/etc/my.cnf.d' と言われた。](https://qiita.com/takat0-h0rikosh1/items/1b481064e30843751d65)

実行コマンド
```mkdir my.cnf.d```

エラー

```
ERROR 2002 (HY000): Can't connect to local MySQL server through socket '/tmp/mysql.sock' (2)
```


### 失敗2

参考
[mysqlが起動できない](https://qiita.com/hondy12345/items/d32ed749fb49e9da7de6)

実行コマンド
```sudo touch /tmp/mysql.sock```
```sudo chown mysql:mysql /tmp```
```mysql.server restart```

エラー

```
 ERROR! MySQL server PID file could not be found!
Starting MySQL
. ERROR! The server quit without updating PID file (/usr/local/var/mysql/MBP-3.local.pid).
```

### 失敗3

参考
[MySQL起動できなくなった　The server quit without updating PID file](https://qiita.com/yuki0208/items/1d5554d98e9ec76084bd)

実行コマンド
```touch MBP-3.local.pid```

エラー

なぜか作っても消えてしまう。。。

```
ERROR! MySQL server PID file could not be found!
Starting MySQL
. ERROR! The server quit without updating PID file (/usr/local/var/mysql/MBP-3.local.pid).
```
ゾーンファイルのIPアドレスの間違えを修正したもののDNSサーバに繋がらない時の対処

ゲストOS：centos7
ホストOS：MacOs
webサーバ：apache
DNSサーバ：BIND

インフラ関連について自主学習している初学者です。サーバ構築中に上手く動作せず、少し苦労したので備忘録として投稿します。
用語の使い方など間違っていたらすいません。

#　問題発生の流れ
virtualbox上のcentos7上でwebサーバを立ち上げDNSで名前解決させる。
BINDでDNSサーバ構築し、apacheでwebサーバを構築した。
ブラウザから接続確認するために、ホストOSのDNSサーバをcentosの/etc/resolv.confに記述しているIPアドレスに設定。curlコマンドでアクセスするも繋がらない。

#　解決までの道なり
上手く動作しない場合、レイヤ層順に調べて原因追究すべし！と以前会社で習ったので、その通り調べました。

##①ホストOS上からゲストOSへ通信できるのかを確認
ターミナル 上（MacOS）で以下のコマンドを実行。
ping  (centosのIPアドレス)
PING centosのIPアドレス (centosのIPアドレス): 56 data bytes
64 bytes from (centosのIPアドレス): icmp_seq=0 ttl=64 time=0.431 ms
64 bytes from (centosのIPアドレス): icmp_seq=1 ttl=64 time=0.390 ms
64 bytes from (centosのIPアドレス): icmp_seq=2 ttl=64 time=0.543 ms
^C
--- (centosのIPアドレス) ping statistics ---
3 packets transmitted, 3 packets received, 0.0% packet loss
round-trip min/avg/max/stddev = 0.390/0.455/0.543/0.065 ms
以上からつながっていることを確認。

##②firewallが止まっているかを確認。
systemctl status firewalld
止まっていた。

##③DNSサーバに問題があるのか確認。
ターミナル 上で（MacOS）以下のコマンドを実行。
nslookup www.example.com　←設定したドメイン
設定したIPアドレスが出てこなかった。

DNSサーバに問題があると確認が取れたため、ゾーンファイルを再度見直すとAレコードのIPアドレスが間違っていた。修正して、serviceを再起動。
nslookup www.example.com
再度上のコマンドを入力するとIPアドレスが表示されたため、DNSサーバが上手く動作した。

##④さらに問題。
最終確認のためcurlコマンドでアクセスするも繋がらない。問題は他にもあると考えて次にwebサーバを確認する。
http.confなどの設定ファイルを全て確認するも問題はない。
再度繋がるか確認。
・curl www.example.com
このコマンドは繋がらない
・curl (centosのIPアドレス)
このコマンドでは繋がることが出来た。

##⑤MacのDNSにキャッシュが残っているのではないかと思い、キャッシュを削除することに。
以下のコマンドを実行。
sudo killall -HUP mDNSResponder

再度確認。
curl www.example.com
webサーバに用意していたhtmlファイルを表示することができた！！

# まとめ
今回の場合、MacのDNSにキャッシュが残っていることを気づかなかったため、レイヤ層順が少し前後してしまい原因追究が遅れてしまった。この一件でレイヤ層を意識して一つずつ着実に原因を無くしていくことでスピーディな解決ができると学んだ！次にいかす！！
AngularJSでimgタグが壊れた時、ngOnを使う

# TL;DR

- imgタグが壊れた時のエラーハンドルを[ngOn](https://code.angularjs.org/snapshot-stable/docs/api/ng/directive/ngOn)を使用する

# 環境

- AngularJS 1.7.9(ドキュメント見ると、1.7以上から)

# imgタグが壊れた時、ngOnなしの場合

userIdを渡せば、ユーザー画像を表示するようなコンポーネントがあるとします

例えば、アカウント削除でuserIdが返ってこないとか、オフラインとか何らかの理由でリクエストが失敗すると
このような代替画像を表示させるはずです
↓
![nophoto.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/183059/83c65dd2-cff7-ad20-6925-604d2dbc6b88.png)


imgタグのsrcにセットした画像が取得できない場合、
・テンプレート側で壊れた画像を補う
・CSS側で補う
・JSで補う

など、特にベストプラクティスとかありそうもないので、特段の理由なくコントローラーでエラーハンドルしてました

html側でimgタグの`onerror`も試したりしましたが、
答えが出なかったので、パッと見て何したいかかわかるコードで対応してました・・・

(new imageしてインスタンス作るまでするか？とか葛藤はありましたが)

# しかし問題点

AngularのライフサイクルかJSにうまく乗れておらず、下記のような↓一瞬壊れた画像が表示されたあとで、代替画像が表示されていました、一瞬だったので目をつむっていました・・・

![スクリーンショット 2020-01-24 16.16.35.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/183059/d434b0e6-6fcd-0cd5-71e1-1089bc2bb1c2.png)


# [ngOn](https://docs.angularjs.org/api/ng/directive/ngOn)を使って克服
AngularJS1.7以上から実装された[ngOn](https://docs.angularjs.org/api/ng/directive/ngOn)で下記のように変更しました:santa:

```user-image.pug
img.user-image(ng-on-error="ctrl.onError()" ng-src="{{ ctrl.userImageUrl }}" alt="ユーザー画像")
```

```user-image.component.ts
const noPhoto = require('_Images/no-photo.jpg');

class UserImageComponent {
  private userId: string; //bindings
  private userImageUrl: string; //view bind

  $onChanges = changes => {
    if (!changes.userId.currentValue) return;
    const url = `https://hoge/thumbnail/${this.userId}.jpg`;
    this.userImageUrl = url;
  };

  onError = () => {
    this.userImageUrl = noPhoto;
  };
}

export const userImage = {
  template: require('./user-image.pug'),
  controllerAs: 'ctrl',
  controller: UserImageComponent,
  bindings: {
    userId: '<',
  },
};
```

## ポイント

1. テンプレート側で`ng-on-error`をカスタム属性で付与し、imgタグが壊れた時に`onError`が発動するように変更
2. onErrorで代替画像に差し替える

だけ:santa:

これで圧倒的に直感的になり、画像も壊れたのが表示されなくなりました:santa:


Angularにも同様のやつあるんですかね？:santa:

# 参考

[ngOn](https://docs.angularjs.org/api/ng/directive/ngOn)

# あとがき

`$onInit`時に、userIdがundefindで渡ってくるときがあるので、`$onChanges`を使っています:santa:
libGDXでandroidアプリのチューニングをした話

##はじめに
もう9年前。iOSアプリが日本ランキングの１位になった。
[iOSソリティアV](http://itunes.apple.com/jp/app/soritiav/id341532096?mt=8)
さりげなく自慢:relaxed:

調子に乗ってandroidアプリも作った。nativeで作った。
nativeで当時android2.xなので、SurfaceViewを使った。
[androidソリティアV](https://play.google.com/store/apps/details?id=jp.co.projapan.solitaire)

アニメがいまいちだったけど:sob:、ちゃんとできた。
フレームレートがちょっと低かった。

android/iOS共に現在１０周年記念中。

数年前、チューニングしたいな、と思った。
iOSとソース一本化
したいけど、一本化するにはやることが多すぎる・・・。

うーん、GLSerfaceViewとかか。めんどくさそうだぞ。しかもよくなるか保証がない。

そんなとき、こんな記事が
[Android StudioでlibGDX入門](https://qiita.com/na3ksg/items/e22df38f23a5d8d97d0a)

ああlibGDX・・・web化しようとして、前にやったなあ。GWTがいまいちで途中で止めたんだった。
一部の画面のみlibGDXとか、できるのか。

そんなわけで一部の機能のみlibGDX、問題ない機能はそのままnative。な構成のandroidアプリとしてチューニングしてみることになったのであった。

#結果
##良かった点
- ちゃんとチューニングになった。開発も結構サクサクいけた。
- 前に捨てたlibGDXコードもちゃんと再利用できた。
- Javaソース追えるので、いろいろ助かった。
- android nativeのレイアウトをlibGDX画面の上に出したりもできた。ほんとに最低限のみ、libGDX化で行けた。楽だった。
- 使い慣れたテクスチャパッカーも使える。


##悪かった点
- 日本語の突っ込んだ情報が無い・・・

#最後に
結構良かった。androidアプリとして、間違った選択ではなかった。
【access】「値要求」と「空文字列の許可」の関係

# 初めに
accessでNOT NULL 制約について盛大に勘違いしていたのでまとめます。
完全に個人用です。

![フィールドプロパティ.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/346005/ddcf532e-a0e1-e4b6-0aa2-9a924179ae45.png)

ここの設定を変えることで
NOT NULL 制約を付けたり空文字列を許容したりできる。
今回盛大に勘違いしてしまったのは
空文字列の許可の方でnullの設定を行うと思い込んでしまっていた。

![nullと空文字の混在.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/346005/d132fe44-d8f8-ca62-ed0f-d6420d3c27fe.png)

ここにはnullと空文字がどちらかがはいっているが
見かけ上ではそれを判断することができない。

「null許可していないのにnullが入ってる!!access壊れた」

と勘違いしたので今回調べることになった。

# 4通りある

|値要求|空文字の許可|入力可能なデータ|削除後の値|
|:--------|:-------------|:------------------|:------------------|
|いいえ|いいえ|NULLのみ|NULL|
|いいえ|はい|NULLと空文字|NULL|
|はい|はい|空文字のみ|空文字|
|はい|いいえ|1文字以上の文字列|削除できない|

こんな感じになるそうです。

クエリを書くときにここしっかりと確認しておかないと
思わぬことが起きそうなのでIs Nullとかやる際は気を付けようと思います。

以上。
GASでよく使う関数まとめ※随時更新予定

## Simple Triggers
### onOpen()
閲覧権限のあるユーザが、このスクリプトが紐付けられたファイルを開いた時に呼ばれる

## Spreadsheet Object

### .openById(<スプレッドシートのID>)
*スプレッドシートを取得(ID)*

### .getUi()
*SpreadsheetのUIオブジェクトを取得する*

#### .createMenu(<メニューの名前>)
*メニュー(ファイルや編集、表示などが書いてある欄)を作成する*

#### .addItem(<アイテムの名前>, <呼び出す関数名>)
*プルダウンメニューを押した時に呼ばれるgas内の関数を定義する。*

#### .addToUi()
*上記のアイテムをメニューに追加する。*
**これを行わないとメニューに反映されないので注意！**

### .getActiveSpreadsheet()
*スクリプトが紐付いているSpreadsheet Objectを取得する*

### .getId()
*スプレッドシートのIDを取得する*

### .getName()
*スプレッドシートの名前を取得する*

### .copy(<名前>)
*スプレッドシートを作成者のルートフォルダーにコピーする*

## Sheet Object
### .getSheetByName(<シートの名前>)
*シートを(名前で)取得する*

### .getRange(<範囲>)
*シートの指定された範囲を取得する*

#### .getValue()
*指定されたセルの値を取得する*

#### .getValues()
*値を取得する(2次元配列)*

#### .setValues(<二元配列>)
*範囲に値を挿入する*

## DriveApp Object

### .getFolderById(<フォルダーのID>)
*フォルダーをIDで取得する*

### .getFileById(<ファイルのID>)
*ファイル(スプレッドシート, ドキュメントなど)をFile Objectで取得する*

### .getRootFolder()
*実行ユーザーのルートフォルダーを取得する*

## Folder Object

### .addFile(<ファイル>)
*ファイルをそのフォルダーに追加する*

### .removeFile(<ファイル>)
*ファイルを削除する*

### スプレッドシートをコピーする
#### .copy(<コピー後のスプレッドシートの名前>)
GitHub ActionsでHugoのビルドを試したらshortcode "gallery" not foundになった

# GitHub ActionsでHugoのビルドを試したらshortcode "gallery" not foundになった
Hugoでのビルド作業やGitHub Pagesへのデプロイ作業を、GitHub Actionsで自動化したいなぁと思っていたところ、以下の記事を見つけました。

[GitHub Actions による GitHub Pages への自動デプロイ](https://qiita.com/peaceiris/items/d401f2e5724fdcb0759d)

さっそくやってみたところ、 `hugo --minify` の箇所で以下のエラーがでました。

```
Run hugo --minify
  hugo --minify
  shell: /bin/bash -e {0}
Building sites … Total in 27 ms
Error: Error building site: "/home/runner/work/xxx/xxx/content/home/gallery/index.md:12:1": failed to extract shortcode: template for shortcode "gallery" not found
##[error]Process completed with exit code 255.
```



# サブモジュールの取得漏れが原因

ソースコード側では、Academic ThemeというHugoのテーマを参照しています。この参照方法が少し特殊で、Gitのサブモジュールという仕組みを使っています。

エラーの原因を調査したところ、GitHub Actions側では、このAcademic Themeのフォルダーが空になっていることがわかりました。

調査を進めると、Gitのサブモジュールの取得ができていないことがわかりました。



# サブモジュールを取得するようにする

`gh-pages.yml` の最初のステップの部分を以下のように変更してみました。

```bash
steps:
- uses: actions/checkout@v1
  with:
    submodules: true
```

そしたら、エラーが出なくなり、無事にデプロイが成功しました。




# さいごに

本記事作成にあたり、以下のページを参考にしました。ありがとうございました。

- [GitHub Actions による GitHub Pages への自動デプロイ](https://qiita.com/peaceiris/items/d401f2e5724fdcb0759d)
- [How to clone public submodule in “Github Actions”](https://stackoverflow.com/questions/59271919/how-to-clone-public-submodule-in-github-actions)
- [Error building site index.md:82:1"](https://github.com/gcushen/hugo-academic/issues/1102)
コマンドプロンプト（コマンドライン）から Visual Studio でファイルを開く

VS Code や vim 等、多くのエディタはコマンドラインからファイルを開くことが出来ますが、Visual Studio ではスクリプトを介してコマンドラインから開くことが出来ます。

```vb:openfile.vbs
On Error Resume Next

Set objDTE = GetObject(, "VisualStudio.DTE.15.0")
If Err.Number<> 0 Then
    Set objDTE = CreateObject("VisualStudio.DTE.15.0")
    Err.Clear
End If

Dim fileName
Dim lineNumber
fileName = Wscript.Arguments(0)
lineNumber = int(Wscript.Arguments(1))

objDTE.MainWindow.Activate
objDTE.MainWindow.Visible = True
objDTE.UserControl = True

objDTE.ItemOperations.OpenFile fileName
objDTE.ActiveDocument.Selection.MoveToLineAndOffset lineNumber, 1
```

このスクリプトを利用してコマンドプロンプトから開くことが出来ます。

```sh
cmd.exe /c /path/to/openfile.vbs FILEPATH LINENUMBER
```