OmniAICreator/Qiita-1.07M huggingface dataset:
Laravelにlintを導入する

Laravelにlintを導入した時の作業メモです。
自分用メモなので、おおざっぱに書いている箇所はご了承ください
lintの設定などはググるか下記リポジトリなどを参考にいただけたらと
→ https://github.com/hirokita117/laravel_spa_practice

----
# php-cs-fixerの導入

```zsh
$ npm i -D husky lint-staged

$ composer require --dev -W friendsofphp/php-cs-fixer

$ npx husky install
```

* npm run prepareを追加

```json:package.json
"prepare": "husky install"
```

```zsh
$ npx husky add .husky/pre-commit "npx lint-staged"
```

* .gitignoreに.php-cs-fixer.cacheを追加

* .php_cs.dist.phpを追加し、ルールを記載
→ルールに関してはググる

* package.jsonにhuskyとlint-stagedを追加

```json:package.json
"husky": {
        "hooks": {
            "pre-commit": "lint-staged"
        }
    },
    "lint-staged": {
        "*.php": [
            "vendor/bin/php-cs-fixer --config=.php_cs.dist.php fix"
        ]
     }
```



# Es-lint導入メモ

```zsh
$ npm install eslint --save-dev

$ ./node_modules/.bin/eslint --init

↓ なんかこんな感じの質問に答える

 How would you like to use ESLint? · style
✔ What type of modules does your project use? · esm
✔ Which framework does your project use? · vue
✔ Does your project use TypeScript? · No / Yes
✔ Where does your code run? · browser
✔ How would you like to define a style for your project? · guide
✔ Which style guide do you want to follow? · standard
✔ What format do you want your config file to be in? · JSON
Checking peerDependencies of eslint-config-standard@latest
The config that you've selected requires the following dependencies:

eslint-plugin-vue@latest eslint-config-standard@latest eslint@^7.12.1 eslint-plugin-import@^2.22.1 eslint-plugin-node@^11.1.0 eslint-plugin-promise@^4.2.1 || ^5.0.0
✔ Would you like to install them now with npm? · No / Yes
```

* .eslintrc.jsonの設定を良い感じにする
→設定に関してはググる

* プラグインを入れる

```zsh
# 例
$ npm install -D eslint-plugin-prettier eslint-plugin-simple-import-sort
```


* prettierのインストール

```zsh
$ npm install -D prettier
```

* lint-stagedにアクション追加する（php-cs-fixerと同じ感じ）

* .prettierrcファイルを追加

```zsh
$ npm install -D eslint-config-prettier
```

npmコマンドに、prettierとeslintを追加する（php-cs-fixerと同じ感じ）
AWS認定 DevOpsエンジニア – プロフェッショナル(DOP)に合格するためのTips

## はじめに
AWS認定 DevOpsエンジニア – プロフェッショナル(DOP)に合格しましたが、きちんと整理した合格体験記を書ける気がしなかったので合格のためのTipsだけを簡潔に書いていきます。

## Tips
- 試験は長丁場。私は一通り解くのに2時間30分かかった。
- 時間配分に注意。75問出題されるので、手元のメモに15問か25問ごとの残り時間のマイルストーンを書いておくと試験中に余計な計算をせずに済む。
- 離席できずに休憩できないオンライン受験より、トイレという名目で休憩できるテストセンター受験がおすすめ。試験中に他の人の邪魔にならないように気をつけながら静かに伸びや深呼吸をするのも良い。
- 限られた知識しかなくても二択まで絞り込める問題が多い。難しいと感じても落ち着いて問題を読んで絞り込む。
- セキュリティ系、管理系のサービスの把握は重要。特にCI/CDにどうセキュリティ的なチェックを組み込むかをよく知っておく。Amazon Inspector、AWS CloudTrail、AWS Trusted Advisor、AWS Configといったあたりは概要を知っているだけで選択肢を絞り込むのに役立つことが多い。「セキュリティ - 専門知識」の試験を先に受けるのも遠回りにならない。
- 問題文中に高頻度で出てくる「DevOpsエンジニア」という立場の人は、何かにつけて通知を受け取る必要がある。CI/CDのプロセスの途中で通知を受け取る方法を知っておく。
- AWS OpsWorksに関する問題は出なかった。古い受験体験記の情報に注意する。
- 迷ったらより労力の少ない手法を採用した選択肢を選ぶ。「スクリプトを書く」という選択肢は大抵無駄な労力。
- Gitの一般的なブランチ戦略、Jenkinsのユースケースについて知っておく。
- 自分のレベルのチェックにはこちらの[「AWS 認定 DevOps エンジニア – プロフェッショナル(AWS Certified DevOps Engineer – Professional)の学習方法 - NRIネットコム Design and Tech Blog」](https://tech.nri-net.com/entry/aws_certified_devops_engineer_professional)が役に立つ。

## おまけ
自分のブログに気力がある時に書いた別の認定試験の合格体験記があります。

- AWS認定 セキュリティ-専門知識
[AWS認定 セキュリティ-専門知識(SCS)に合格しての振り返り](https://hanautarecords.com/aws-scs/)

- AWS認定 機械学習–専門知識
[機械学習初心者のAWS認定 機械学習–専門知識(MLS)受験レポート](https://hanautarecords.com/aws-mls/)

- AWS認定 ソリューションアーキテクト – アソシエイト
[AWS認定 ソリューションアーキテクト – アソシエイト(SAA)受験レポート](https://hanautarecords.com/aws-saa/)
Dockerコマンドはじめの一歩

下記、dockerを学ぶ際に理解したコマンド群です。
適宜追加していきます。
<font color="Gainsboro">ずっと下書きに残してた...</font>

----
* コンテナの起動

```bash
docker run <container>
# コンテナ名を任意のものにする
docker run --name <container_name>
```
* ローカル上にダウンロード済のイメージ一覧を見る

```bash
docker images
```
* イメージにタグ付けする

```bash
docker tag <origin_image> <new_image>:tag_name
```
* イメージの情報を確認する

```bash
docker inspect <image>
```
* ローカル上のイメージを削除する

```bash
docker rmi <image>
```
* イメージを取得する

```bash
docker pull <image>
```
* DockerFileからイメージをビルドする

```bash
docker build -t <tag_name> <build_context_path>
```
* コンテナの実行をバックグラウンドでおこない、ポートを外部公開させる

```bash
docker run --name <container> -d -p <port_by_host>:<port_by_container> <image>
# -d デタッチモード
# -p コンテナのポートを公開させる
```
* バインドマウントを利用する

```bash
docker run --name <container> -d \
-v <host_dir>:<container_mount_point>:<options> \
-p <port_by_host>:<port_by_container> <image>
```
* コンテナのシェルに接続する

```bash
docker attach <container>
# もしくは以下
# docker exec -it <container> /bin/bash
```
* コミットする（コンテナの作業状態をイメージとして残す）

```bash
docker commit <container> <image>:<tag>
```

----

* DockerFileの書き方

```docker
FROM 元となるイメージ
RUN buildされるときに実行されるコマンド
CMD コンテナ起動時に実行されるコマンド
```
jupyter notebook と folium で地理院地図を表示

jupyter notebook と folium で地理院地図を表示します。

* 動作確認した環境
 * windows 10, Google chrome 91.0.4472.124
 * python 3.7.0, jupyter 1.0.0, folium 0.12.1

* 実行手順
 1. 作業フォルダを作成し、コマンドプロンプトでその作業フォルダに移動
 2. python の仮想環境を作成し、仮想環境をアクティベート
 3. pipコマンドを利用して、jupyter, folium, および関連のパッケージをインストール
```
pip install jupyter folium
```
 4. jupyter notebook を起動
 5. 新しいノートブックを作成し、以下のコードをコピーして実行

```
import folium
map = folium.Map(location = [35.6804, 139.7670],
              zoom_start = 15,
              tiles = "https://cyberjapandata.gsi.go.jp/xyz/std/{z}/{x}/{y}.png",
              attr = "地理院地図",
              crs = 'EPSG3857')
folium.LatLngPopup().add_to(map)
map
```
* 2行目の```location```で最初に表示される地図の中心座標(緯度経度)を指定
* 3行目の```zoom_start```で、最初に表示される地図のズームレベルを指定
* 4行目の```tites```で表示する地理院地図タイルのURLを指定 (指定可能なタイルや記述方法は地理院地図タイル一覧、Folium documentation を参照)

https://maps.gsi.go.jp/development/ichiran.html

http://python-visualization.github.io/folium/index.html

* (おまけ) 5行目の```LatLngPopup()```を指定すると、地図の任意位置をクリックするとその地点の座標(緯度経度)が表示されます
* 6行目で5行目までに準備した地図をブラウザ中に表示
WebP形式の画像をAdobeMediaEncoderで変換する

# WebPとは
WebPという画像形式があります。
Webで表示するために作られた高圧縮率な画像形式です。
主にWebブラウザで使われています。
この記事にたどり着いた人は、Web上の画像をダウンロードしてきたらwebpという拡張子で困った人だと想定しています。

WebPについて詳しくはこちらがおすすめ
[WebPとは / 他画像フォーマットとの比較 - @szaizen
](https://qiita.com/szaizen/items/6a5819925cf3fa5fe79e "Qiita")

# WebPを扱えるソフト
主要な画像編集ソフトなどでは基本的に扱えません。
なので、一度形式を変換する必要があります。
しかし既存の変換ツールでもWebPは対応しているものが少なく、専用にソフトをインストールするか、Web上で使えるコンバートサービスを利用しているかと思います。

# Adobe製品でWebPを扱えるようにする方法
この方法だとMediaEncoderだけでなく、AfterEffects、PremiereProで扱えるようになります。（当方確認したもの）

## プラグインをインストールする
こちらのプラグインをインストールします。
[WebM for Premiere](http://www.fnordware.com/WebM/)
WebMだしfor Premiereですが、これでWebPもそのほかのAdobe製品も扱えるようになります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/274492/e92e3a1d-0534-cfe9-c8d1-21cf5ef3a381.png)

## MediaEncoderでWebP形式の画像をPNG形式に変換する
この時点でPremiereやAfterEffectsではWebP画像をPNG画像のようにドラッグ&ドロップでプロジェクトにインポートすることができるようになっています。
ここからはMediaEncoderで複数のWebP画像をPNG画像に一括変換する方法を書いていきます。

1. AdobeMediaEncoderに変換したいWebP画像を一気にドラッグ&ドロップする
1. 全選択し、形式をPNGにする![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/274492/ed4385f5-6996-8500-daa8-6c96356a682d.png)
1. プリセットの青文字をクリックする（出てくるポップアップはOKで）![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/274492/91c93f9f-ca8b-1b83-9b6d-a32151bb968e.png)
1. 「シーケンスとして書き出し」をオフにする![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/274492/fe5fa3a2-87bc-bb7e-c50e-eadb7b513bdd.png)
1. 書き出し設定をOKで閉じて、右上の緑三角ボタンで変換を開始

以上でWebP画像をPNG画像に一括変換できます。

※PhotoshopでWebPを扱えるようにするには別途プラグインが必要です。
※Illusuratorでは使えませんでした。
Cでシンプルなサーバを作る

[Kotlin Script でシンプルなサーバを作る](https://qiita.com/KenjiOtsuka/items/085d9ca6df11166b1fc5) をCでやってみました。

TCP の あるポートをリッスンして、 リクエストがあればテキスト（コンテンツ）を返します。

## コード

ブラウザで `http://localhost:49162` にアクセスするとページが表示されます。

```c
#include <netinet/in.h>
#include <stdio.h>
#include <stdlib.h>
#include <sys/socket.h>
#include <unistd.h>
#include <string.h>

void handle_error(char* message) {
  perror(message);
  exit(EXIT_FAILURE);
}

int main(void) {
    int server_fd;

    // create socket file descriptor
    server_fd = socket(AF_INET, SOCK_STREAM, IPPROTO_TCP);
    if (server_fd == -1) handle_error("socket failed");

    struct sockaddr_in address;
    address.sin_family = AF_INET;
    address.sin_addr.s_addr = INADDR_ANY;
    address.sin_port = htons(49162);
    int addr_len = sizeof(address);

    if (bind(server_fd,(struct sockaddr *) &address, sizeof(address)) < 0)
        handle_error("bind failed");

    // start to listen
    if (listen(server_fd, 3) < 0) handle_error("listen failed");

    printf("listening\n");

    while (1) {
        int client = accept(server_fd, (struct sockaddr *) &address, (socklen_t *)&addr_len);
        if (client < 0) handle_error("failed to accept connection.\n");

        char *body = "<!DOCTYPE html><html><head><title>Exemple</title></head><body><p>Server example.</p></body></html>";
        char *format = "HTTP/1.0 200 OK\r\n"
                "Date: Fri, 31 Dec 2021 23:59:59 GMT\r\n"
                "Server: Apache/0.8.4\r\n"
                "Content-Type: text/html\r\n"
                "Content-Length: %d\r\n"
                "Expires: Sat, 01 Jan 2020 00:59:59 GMT\r\n"
                "Last-modified: Fri, 09 Aug 1996 14:21:40 GMT\r\n"
                "\r\n"
                "%s";
        char message[4096];
        sprintf(message, format, strlen(body), body);

        // send the response
        send(client, message, strlen(message), 0);

        close(client);
    }

    close(server_fd);

    return EXIT_SUCCESS;
}
```

### ブラウザでの表示結果

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/25846/62db88da-5101-76e5-ad66-d5547181fc0a.png)
VirtualBox　仮想化環境構築CentOS7

#前提
####目的
- VirtualBoxにCentOS7をインストールして開発環境を構築すること

####執筆者・対象者
- 初学者
- 仮想化について興味がある方
- Linuxについて学習を始める方

####環境
- Windows

####インストールしたもの
- VirtualBox　6.1.22
- CentOS-7-x86_64-DVD-2009.iso

#VirtualBoxをインストール・設定する
１．以下のURLから左のメニューのダウンロードを選択し、自分のOSにあったVirtualBoxをインストール。
（私はWindowsなので写真赤線のものを選択。）
https://www.virtualbox.org/

![OSselect.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1725946/6268613c-f3ef-8247-7968-8dfd98f71590.png)

２．VirtualBoxの設定をする
デフォルトの設定で問題ないので、Next、Yes、Installをクリックしていく。
インストール出来たらFinishをクリック。

#CentOS7をインストールする
１．以下のURLから上部のメニューのダウンロードを選択し、左側のCentOS Linuxの7
を選択してx86_64をクリック。
https://www.centos.org/
![CentOS7select.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1725946/303cad44-4aa4-2e1b-a77b-801c7d707f69.png)

２．どれでもいいので一つ選んで、「CentOS-7-x86_64-DVD-2009.iso」を選択。
![CentOS7isoImage.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1725946/0c4b511e-caca-d00a-8b81-8f7c67ee8ee8.png)
![isoselect.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1725946/562c3841-c998-030a-7ebe-9a825e5e7324.png)
（私は上のものを選択しました。）

＊迷われる方は理化学研究所から出ているものをインストールするとよいと思います。
（https://ftp.riken.jp/Linux/centos/7.9.2009/isos/x86_64/ の「CentOS-7-x86_64-DVD-2009.iso」をダウンロード）

ひとまず、インストールが完了しました。
次に環境構築をしていきます。
→[続きはこちら](https://qiita.com/Drinker/items/57d21e242bc0c831b636)
UITextFieldのTextをInt型に変換する

UITextField.textはオプショナル型(String?)です。
大量のUITextFieldのTextをIntに変換したいとき、ひとつひとつUnwrapしたり ?? を使うのは大変です。

なのでUITextFieldを拡張してメソッドを追加しました。

```Swift
import UIKit

extension UITextField {
    var textToInt: Int {
        let text = self.text
        let int = text
            .flatMap{Int($0)} ?? 0
        return int
    }
}
```

あとは変換したいTextFieldで呼び出すだけです。

```Swift
let example: Int = textField.textToInt
```

## 参考

[Swift実践入門(Amazon)](https://www.amazon.co.jp/%E5%A2%97%E8%A3%9C%E6%94%B9%E8%A8%82%E7%AC%AC3%E7%89%88-Swift%E5%AE%9F%E8%B7%B5%E5%85%A5%E9%96%80-%E7%9B%B4%E6%84%9F%E7%9A%84%E3%81%AA%E6%96%87%E6%B3%95%E3%81%A8%E5%AE%89%E5%85%A8%E6%80%A7%E3%82%92%E5%85%BC%E3%81%AD%E5%82%99%E3%81%88%E3%81%9F%E8%A8%80%E8%AA%9E-PRESS-plus%E3%82%B7%E3%83%AA%E3%83%BC%E3%82%BA/dp/4297112132/ref=sr_1_1?adgrpid=56053864951&dchild=1&gclid=EAIaIQobChMIr7mLz6PI8QIVy62WCh2nlg_wEAAYASAAEgK7b_D_BwE&hvadid=338518511220&hvdev=c&hvlocphy=1009283&hvnetw=g&hvqmt=e&hvrand=636784303374107619&hvtargid=kwd-306987067810&hydadcr=27263_11561109&jp-ad-ap=0&keywords=swift+%E5%AE%9F%E8%B7%B5%E5%85%A5%E9%96%80&qid=1625362626&sr=8-1)
unity5.2の作法 その23 www

#概要

unity5.2の作法、調べてみた。
wwwやってみた。

#makefile

- menu->file->new sceneする。
- menu->file->save sceneでstartとする。
- menu->gameobject->create emptyする。
- menu->assetes->creates->c# scriptでstart.csつくる。
- ダブルクリックして、コードを書く。
- ヒエラルキーのgameobjectに、コードを重ねる。
- 三角で実行。


#サンプルコード

```
using UnityEngine;
using System.Collections;

public class www : MonoBehaviour {
    string json;
    void Start() {
        StartCoroutine("ReadMemo");
    }
    IEnumerator ReadMemo() {
        WWW www = new WWW("https://ohiapp0.herokuapp.com/hello");
        //WWW www = new WWW("http://carmania.dip.jp");
        yield return www;
        if (!string.IsNullOrEmpty(www.error))
        {
            Debug.LogError(string.Format("Fail Whale!\n{0}", www.error));
            yield break;
        }
        json = www.text;
        Debug.Log(json);
    }
    void OnGUI() {
        GUI.color = Color.yellow;
        GUI.Label(new Rect(10, 10, 300, 300), json);
    }
}



```


以上。
西暦から和暦に返還されるプログラム

西暦を入力すると和暦に返還されるプログラムを練習で書いてみました。

<?php
echo '西暦を入力してください';
$year = trim(fgets(STDIN));
// 数字かどうか
if (is_numeric(year) &&
year <= date('Y'))
if (year>=2018)echo′令和です′;elseif(
year >= 1988) {
echo '平成です';
} elseif ($year >= 1925) {
echo '昭和です';
} else {
echo '昭和より前です';
} else {
echo '今年よりも前の数字を入力してください';
}
【Android】GsonでList<Something>をデシリアライズする -> 逆も 超個人的メモ

やるたびにググってる
毎度迷子になるの面倒

**StringなJsonからList**

```
String somethingsJson = "";
Gson gson = new Gson();
Type collectionType = new TypeToken<Collection<Something>>(){}.getType();
List<Something> somethings = gson.fromJson(somethingsJson, collectionType);
```

**ListからStringなJson**

```
Gson gson = new Gson();
List<Something> somethings = new ArrayList<>();
String somethingsJson = gson.toJson(somethings);
```
unity5.2の作法 その22 webrequest

#概要

unity5.2の作法、調べてみた。
webrequestやってみた。


#makefile

- menu->file->new sceneする。
- menu->file->save sceneでstartとする。
- menu->gameobject->create emptyする。
- menu->assetes->creates->c# scriptでstart.csつくる。
- ダブルクリックして、コードを書く。
- ヒエラルキーのgameobjectに、コードを重ねる。
- 三角で実行。

#サンプルコード

```
using UnityEngine;
using System.Collections;
using System;
using System.IO;
using System.Net;
using System.Text;

public class httpweb : MonoBehaviour {
    string html;
	void Start () {
        Encoding enc = Encoding.GetEncoding("Shift_JIS");
        //string url = "https://ohiapp0.herokuapp.com/test";
        string url = "http://carmania.dip.jp";
        WebRequest req = WebRequest.Create(url);
        WebResponse res = req.GetResponse();
        Stream st = res.GetResponseStream();
        StreamReader sr = new StreamReader(st, enc);
        html = sr.ReadToEnd();
        sr.Close();
        st.Close();
        Debug.Log(html);
	}
	void Update () {	
	}
    void OnGUI() {
        GUI.color = Color.yellow;
        GUI.Label(new Rect(10, 10, 300, 300), html);
    }
}


```

以上。
無料かつ高速な自動翻訳してくれる機能をwebにいれこむ

# 入り
翻訳機能ってなってくると、ロケールファイルをつくっていて人力で翻訳するパターンか、GoogleTranslateだったりやDeepLなどのAPIをつかって自動で翻訳する方法があるかと思います。
まずは、いろいろのパターンのメリット・デメリットを書いて行こうかと思います。

# いろいろな方法に対してのメリット・デメリット
### ロケールファイル
人力でコツコツ翻訳ファイルをつくっていくやり方
####メリット
・翻訳を人力でつくっていくので変な翻訳やUIの乱れが起こることが少ない
・サーバー内で管理していくでレスポンスが早い。
####デメリット
・自動ではない
・人力でつくっていくので作業時間がめっちゃかかる。それ専門の人材を用意した方が良いです
・管理がしにくい。（やり方によると思いますが）、一工夫としてgoogleスプレッドで管理すると少しは軽減できます。参考記事（https://tech.hitomedia.jp/entry/2018/05/30/165801）
### GoogleCloudTranslateAPI
こちらはAPIを呼び出すと自動翻訳してくれます。GCP内のサービスで、無料枠があるが実用化すると無料枠では収まらないので有料になります。
####メリット
・自動である
・翻訳をカスタマイズできます。簡単に言うと、正しくない翻訳があったら修正できる機能ですね。
####デメリット
・ページ丸ごと翻訳ってわけにはいかない
・無料枠があるとはいえチャットとかを翻訳するとなると有料になってきますね。$20‡ /1,000,000 文字(50万文字までは無料)
・API呼び出し時間がかかる
・質がめっちゃ良いってわけではないです（DeepLに比べたらですが）
###GASをかました無料API
翻訳機能のコードを書いたGASを作成して、それをAPIとして呼び出す方法
参考記事：https://qiita.com/satto_sann/items/be4177360a0bc3691fdf
####メリット
・自動である
・無料
####デメリット
・ページ丸ごと翻訳ってわけにはいかない
・一回での翻訳できる字数が７００文字まで
・変な翻訳やUIの乱れは出てきます(translate="no"を入れて別途ロケールで対応できます)

#最終的に行き着いたのは
色々紹介してますが、最後に紹介するやり方が一番コスパ良いです。その名は、「Google Website Translator」。
#Google Website Translator
クライアント側でページ丸ごと翻訳してくれるwordpressのプラグインとかで導入できるやつですね。
古臭いですが実はめっちゃ効果的です。色々試しましたがこれに落ち着きました。
色々試したのがアホらしかったです。
参考記事：https://so-zou.jp/web-app/tech/search-engine/google/translate/

###導入方法
####1.まずは、入れて見ましょう
参考記事の通りにやればページ丸ごと自動翻訳してくれます。
https://so-zou.jp/web-app/tech/search-engine/google/translate/
####2.かっこ悪いのでデザインを整えましょう
下記のセレクトボックスのようにwebサービス内に配置したいのでcssを上書きします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/547274/2cebabda-819d-506c-3b8b-c2ca92684e65.png)

```css
.goog-te-banner-frame {
  display: none !important;
}
.goog-tooltip {
  display: none !important;
}
.goog-te-combo {
  margin: 0 !important;
}
.goog-tooltip:hover {
  display: none !important;
}
.goog-text-highlight {
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
.goog-logo-link{
  display: none !important;
}
.goog-te-gadget{
  height: 30px !important;  
  overflow: hidden;
  font-size: unset !important;
}
body{ 
  top: 0 !important;
}
```
###3.デフォルト言語をセッションでセット
デフォルトが「言語を選択してください」となっているのでデフォルト言語に切り替わるようにスクリプトを変更します。

```
<script>
  function googleTranslateElementInit() {
    /* この部分追加 */
    if (document.cookie.match("googtrans") == null) {
      function setCookie(key, value, expiry) {
        var expires = new Date();
        expires.setTime(expires.getTime() + (expiry * 24 * 60 * 60 * 1000));
        document.cookie = key + '=' + value + ';expires=' + expires.toUTCString();
      };
      setCookie('googtrans', '/auto/en', 1); //この部分でデフォルトをenに指定
    };
    /* ここまで */
    new google.translate.TranslateElement({
      includedLanguages: 'ar,de,en,es,fr,ru,th,vi,zh-TW,zh-CN,ja,ko',
    }, 'google_translate_element');
  };
</script>
```
####完成動画
![名称未設定.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/547274/3c2a0760-cc94-87be-7213-b180e192ef86.gif)



#まとめ
Google Website Translatorは古きからあると思いますが偉大です
【Android】UTC(GMT) -> スマホのTimeZoneに応じた時刻表示 超個人的メモ

盛大にハマった
二度とハマりたくない
とりあえずこれで動く

```
String utcDateString = "Wed, 11 May 1982 12:25:45 GMT";
SimpleDateFormat enDateFormat = new SimpleDateFormat("EEE, dd MMM yyyy HH:mm:ss Z", Locale.ENGLISH);
enDateFormat.setTimeZone(TimeZone.getTimeZone("UTC"));
Date utcDate = null;
try {
    utcDate = enDateFormat.parse(utcDateString);
} catch (ParseException e) {
    
}

SimpleDateFormat localizedFormat = new SimpleDateFormat("MM-dd HH:mm", Locale.ENGLISH);
localizedFormat.setTimeZone(TimeZone.getDefault());
String localizedFormattedString = localizedFormat.format(utcDate);
```
例外処理を伝播させる方法

例外処理を伝播させる方法を実装しました。（あくまで実験です）

```Java
class NyException extends RuntimeException{}

class A{
	void bar() {
		try {
			//クラスをまたがって例外処理を伝播させる。三項演算子で判定している
			throw (1 + Math.random()) * 100 > 0 ? new NyException():new RuntimeException();
		}catch (NullPointerException ex) {
			System.out.println("A ");
		}
	}
}

public class Test {
	public static void main(String[] args) {
		try {
			new A().bar();
		} catch (NyException ex) {
			System.out.println("C ");
		}
	}
}
```
Notion APIとGASで日記ページを自動作成する

## やりたいこと
Notionに毎日日記を書いている。
従来は日記データベース以下にその日のページを手動で作成していたが、面倒なので**空ページを毎朝自動作成**したい。
![スクリーンショット 2021-07-04 8.13.11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/58850/748d06df-4911-ee3d-960f-14c204fcf036.png)

日記は、以下の情報のみ保持する単純なページとする。

- タイトル（e.g. `2021/7/4(Sun)`）
- 本文
- 日付（Date型のプロパティ）


## 方針
```
（時間トリガー）→ Google Apps Script → (Notion API) → Notion
```

**ページ作成**
[Notion APIのページ作成API](https://developers.notion.com/reference/post-page)を利用

**リクエスト送信**
Google Apps Script(GAS)を利用し、時間トリガーで毎朝スクリプトを実行

## 実装 (GAS)
[Notion API (※執筆時点ではPublic Beta)](https://developers.notion.com/) を呼び出すだけ。
Notion APIの使い方自体はググれば出てくる。事前にNotionの設定画面からIntegrationを作成して`Integration Token`を取得しておく必要がある。

以下のコードでは、**タイトル**（e.g. `2021/7/4(Sun)`）と当日の**日付**をプロパティとして保持する空ページを、既存の日記データベース（`"**YOUR DATABASE ID**"`でIDを指定）の下に作成している。


```javascript
// Create a common header object for Notion API
const notionHeader = token => ({
  'Content-Type': 'application/json',
  'Authorization': 'Bearer ' + token,
  'Notion-Version': '2021-05-13'
})

// zero-fill month/day string
const zfill2 = str => {
  return str.length === 2 ? str : '0' + str
}

// Create a diary page for the given date
const createDiaryPage = (dbId, date, token) => {
  const url = `https://api.notion.com/v1/pages`
  const jaToday = date.toLocaleDateString("ja-JP", { timeZone: "Asia/Tokyo" }) // e.g. 2021/7/3
  const jaDate = jaToday.split('/')
  const dayOfWeek = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'][date.getDay()]

  const body = {
    parent: {
      database_id: dbId,
    },
    properties: {
      Date: {
        date: {
          start: `${jaDate[0]}-${zfill2(jaDate[1])}-${zfill2(jaDate[2])}`, // YYYY-MM-DD
          end: null
        }
      },
      Name: {
        title: [{
          text: {
            // without zfill (e.g. 2021/7/3(Sat))
            content: `${jaToday}(${dayOfWeek})`
          }
        }]
      }
    }
  }
  const options = {
    method: 'post',
    headers: notionHeader(token),
    payload: JSON.stringify(body)
  }
  const resp = UrlFetchApp.fetch(url, options)
  return JSON.parse(resp.getContentText())
}


// 定時実行する関数
const createEmptyDiaryForToday = () => {
  const diaryDbId = "**YOUR DATABASE ID**"
  const token = "**YOUR TOKEN**"

  const now = new Date()
  console.log(now)
  const resp = createDiaryPage(diaryDbId, now, token)
  console.log(resp)
}
```
### 実装上の注意点
- ページをPOSTする際に適切なプロパティを与えるため、ページのスキーマを知っておく必要がある。
    - → 事前に手動でページを作り、[ページ取得API](https://developers.notion.com/reference/get-page)のレスポンスを見ながら実装すれば良い。
    - （ページ取得のコード例は↓）
- GASの`UrlFetchApp.fetch()`の返り値を`console.log()`すると`{}`と表示される
    - → `.getContentText()`して`JSON.parse()`することでレスポンスを取り出す必要がある
    - 空のレスポンスしか返ってきてないと勘違いしてちょっと詰まった（ドキュメントを読めば済む話ではある）

```javascript
const retrievePage = (pageId, token) => {
  const url = `https://api.notion.com/v1/pages/${pageId}`
  const options = {
    method: 'get',
    headers: notionHeader(token)
  }
  const resp = UrlFetchApp.fetch(url, options)
  return JSON.parse(resp.getContentText())
}
```
自己回帰過程におけるLassoポアソン回帰

```{r}




#自己回帰過程におけるL１ポアソン回帰

#再急降下法

data("AirPassengers")

data=data.frame(no=1:length(AirPassengers),values=c(AirPassengers))

r=3;dim=3

values=log(data$values)

X=array(0,dim=c((nrow(data)-r),dim*r))

Y=c()

for(j in 1:(nrow(data)-r)){

vec=c()

for(i in 1:dim){

vec=c(vec,values[j:(j+r-1)]^i)  

}

X[j,]=vec

Y=c(Y,(values[r+j]))

}

log_sub=0

for(i in 1:length(Y)){

log_sub=log_sub+sum(log(c(1:Y[i])))

}


beta=rep(0.001,ncol(X))

eta=10^(-10)

s=10^(-8)

ite=10^6

for(l in 1:ite){

beta_pre=beta

#if(sum(abs(beta-beta_pre))>10^(-6)){

b_sig=ifelse(beta>0,1,ifelse(beta<0,-1,0))

value1=beta+eta*(apply(X*c(Y)-X*c(exp(X%*%beta)),2,sum))
value2=beta+eta*(apply(-X*c(Y)+X*c(exp(X%*%beta)),2,sum))

beta_plus=ifelse(ifelse(b_sig==1,1,0)*value1>(s),1,0)
beta_plus=beta_plus*(value1)-s*beta_plus
beta_minus=ifelse(ifelse(b_sig==-1,1,0)*value2<(-s),1,0)
beta_minus=beta_minus*(value2)+s*beta_minus

beta=beta_plus+beta_minus

#}

loglik=sum(-Y*X%*%beta+exp(X%*%beta))+s*sum(abs(beta))+log_sub
#print(loglik)
#print(sum(abs(beta-beta_pre)))

}

dev=2*sum(Y*log(Y/exp(X%*%beta))-Y+exp(X%*%beta))

qchisq(1-0.05,length(Y)-ncol(X)-1)




```
【prettier】複数ファイルまとめて実行する

npm + prettier 環境での方法です

#フォルダ配下へ再帰的に実行
カレントディレクトリより下にある、すべてのフォルダを対象にするパターン
## jsをすべてフォーマット
jsをすべてフォーマット

```powershell
npx prettier --write "./**/*.js"
```

##複数の拡張子を指定
js,css,html をすべてフォーマット

```powershell
npx prettier --write "./**/*.{js,css,html}"
```

# フォルダ直下のみ実行
カレントディレクトリの直下にあるjsが対象

```powershell
npx prettier --write "./*.js"
```
yukicoder contest 302 参戦記

# yukicoder contest 302 参戦記

いつもはだいたい途中でギブアップするのだけど、今回は2問解いた時点で残り10分とかそんなんだった……. どっちも瞬殺できないといけなかった…….

## [A 1578 A × B × C](https://yukicoder.me/problems/no/1578)

実際に計算してみると K=1 は A'=BC, B'=AC, C'=AB で (ABC)<sup>2</sup>、K=2 は A''=A<sup>2</sup>BC, B''=AB<sup>2</sup>C, C''=ABC<sup>2</sup> で (ABC)<sup>4</sup> となり、(ABC)<sup>2<sup>K</sup></sup> であることはすぐ見当がつく. K≦10<sup>12</sup> なので 2<sup>K</sup> は計算できない. 繰り返し二乗法で解けないかと考えてドツボにはまってしまったが、フェルマーの小定理により ABC<sup>10<sup>9</sup>+7-1</sup>≡1 (mod 10<sup>9</sup>+7) なので 2<sup>K</sup> を 10<sup>9</sup>+7-1</sup> で割った余りを求めればいいだけだった.

```python
m = 1000000007

A, B, C = map(int, input().split())
K = int(input())

print(pow(A * B * C, pow(2, K, m - 1), m))
```

## [B 1579 New Type of Nim](https://yukicoder.me/problems/no/1579)

ひとまず A, B が10未満について答えを総当りで調べてみた.

```
$ python
Python 3.8.9 (default, May  5 2021, 08:05:34)
[GCC 10.2.0] on cygwin
Type "help", "copyright", "credits" or "license" for more information.
>>> from functools import lru_cache
>>> @lru_cache(maxsize=None)
... def f(a, b, turn):
...     if a == 0 or b == 0:
...         return turn
...     for i in range(1, a + 1):
...         c, d = a - i, b
...         if c == d:
...             if f(c, d, turn) == turn:
...                 return turn
...         else:
...             if f(c, d, turn ^ 1) == turn:
...                 return turn
...     for i in range(1, b + 1):
...         c, d = a, b - i
...         if c == d:
...             if f(c, d, turn) == turn:
...                 return turn
...         else:
...             if f(c, d, turn ^ 1) == turn:
...                 return turn
...     return turn ^ 1
...
>>> for a in range(1, 10):
...   for b in range(a, 10):
...     print(a, b, f(a, b, 0))
...
1 1 1
1 2 1
1 3 0
1 4 0
1 5 0
1 6 0
1 7 0
1 8 0
1 9 0
2 2 0
2 3 0
2 4 0
2 5 0
2 6 0
2 7 0
2 8 0
2 9 0
3 3 1
3 4 1
3 5 0
3 6 0
3 7 0
3 8 0
3 9 0
4 4 0
4 5 0
4 6 0
4 7 0
4 8 0
4 9 0
5 5 1
5 6 1
5 7 0
5 8 0
5 9 0
6 6 0
6 7 0
6 8 0
6 9 0
7 7 1
7 8 1
7 9 0
8 8 0
8 9 0
9 9 1
```

規則性が分かったので後は書くだけ. といいつつ、総当たりのコードで typo をして酷い目にあったのだが…….

```python
A, B = map(int, input().split())

if min(A, B) % 2 == 1 and abs(A - B) <= 1:
    print('Q')
else:
    print('P')
```
[Windows/vs2019]CMakeを使わずにBlenderをビルドしてみた。

[前回](https://qiita.com/rg687076/items/76664f3cb6997a27dd02)の記事で、Blenderのビルド方法を投稿したんですが、もっと簡単にVisual Studioでビルドする方法がありました。
VisualStudio2019だけで、ビルド環境を作る方法です。
[ここ](https://www.irid192.com/1-0e9206e1e5d44557aeb11bbd9eccf158!1-2759d372-b7d4-4209-ba3e-e27cfcf3ed2a.html)に書いてくれてるので、わざわざ書かなくてもいいかとも思いましたが、少し苦労したので、その点だけ残しとこうかと。

## ざっくり手順
vs2019起動 → ソースコードをGit取得 → ライブラリをsvn取得 → ビルド → 実行

## 前提
visual studio 2019インストール済
Gitインストール済(TortoiseGitもついでに)
SVNインストール済(TortoiseSvnもついでに)

## 1.先に作業フォルダを作成して、svnからblenderライブラリを取得しておく。

```コマンドプロンプト.
mkdir D:\blender-git
cd D:\blender-git
svn checkout https://svn.blender.org/svnroot/bf-blender/trunk/lib/win64_vc15 lib/win64_vc15
```
※先にこの手順をしておかないと、VisualStudio2019でのリポジトリのクローンした後のビルドで、エラーになるので、やっておきます。


## 2.VisualStudio2019を起動
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1723966/1eb1b8d1-9cd9-43f6-a5b8-08d464ee2a8a.png)
リポジトリのクローンを選択。

## 3.リポジトリの場所とパスを設定してクローン実行
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1723966/e1b8d1da-13cf-4f11-1d23-e72837aa888f.png)
リポジトリの場所 : git://git.blender.org/blender.git
パス　　　　　　 : 任意に。
右下のクローンボタンを押下。
※かなり時間がかかります。

## 4.ビルド
「ビルド→blenderのインストール」からビルド
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1723966/30941666-6f4d-feea-a9eb-035b2b29f85a.png)

## 5.実行
blender.exe(インストール)を選ぶ
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1723966/aad6f241-751d-f8f6-1495-2bb0e1355c54.png)

これで、実行できるはず。


**<注意>**
リポジトリからクローンすると、cmakeプロジェクトになってしまい、いつもの*.slnファイルがないです。なので、次回開く時、ちょっと面食らう。
なので、一応、残しておきます。

##### 開き方1.
　スタートからvisual studio起動 → 最近開いた項目にあればそこから開く。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1723966/b1cdf26a-8ad5-5424-fce9-88c177ca13a3.png)

##### 開き方2.
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1723966/07b6077a-5f61-8193-66d5-d8969005bda3.png)
　最近開いた項目にない場合、コードなしで続行を選択

##### 　ファイル → 開く → Cmake
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1723966/fd1bd474-c01d-1232-cebe-d87da48aad26.png)


 → 直下(今回はD:\Products\blender-gitd3vs)のCMakeLists.txtを選択 → 待つ(たいがい待つ。5年ぐらい。)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1723966/5659286e-a370-bfee-6bc6-e887a279c327.png)
　※ソリューションエクスプローラに一覧が表示されれば、読込み完了。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1723966/b8b4c9ec-ccaa-f35e-6455-ebc916ac87f7.png)

**<番外編>**
ビルドから再トライ
※なんかちょっとしたことで、動かんくなるので、そのリカバリ方法。

ホームを下記とした場合
D:\Products\blender-gitd2

cd D:\Products\blender-gitd2
.vsフォルダと、outフォルダを削除

で、VS再起動後、手順4からやり直す。
Python3 時間の分岐　メモ

```python
# 時間帯によりメッセージを変える
from datetime import datetime
 
today = datetime.now()
 
# 現在時刻を表示
hour = today.hour
minute = today.minute
print("{}:{}".format(hour, minute))
 
# 時間帯によりメッセージを変えて表示
if hour >= 3 and hour <= 9:
    print("起きてる？")
elif hour >= 10 and hour <= 17:
    print("こんちわ！")
elif hour >= 18 and hour <=21:
    print("お晩です")
else:  # 夜10時から真夜中の2時
    print("夜分にゴメンね！")
命題論理の「ならば」が日常語の「ならば」と意味が異なる理由

命題論理において、論理演算「ならば（`→`）」は「**前件が偽であれば、後件の真理値にかかわらず命題の真理値は真となる**」という性質を持ちます。この性質が日常語の「ならば」の意味と乖離していることは、しばしば論理学の入門書で以下のような小噺を添えて説明されます。

```
親「明日晴れたら遊園地に連れて行ってあげる」
子「わーい」

・・・当日はどしゃぶりの雨だった。

親「よし、遊園地に行くぞ！」
子「雨降ってるけど？」
親「晴れたら行くとは言ったが、晴れなかったら行かないとは言ってない」
子「ヤダー！」
```

```
後日。

親「次のテストで学年1位をとったら、プレステ5を買ってあげる」
子「わーい！頑張るぞ！」

・・・子は学年1位をとれなかった。

子「1位とれなかったー」
親「そうか、じゃあ買ってあげない」
子「1位をとれなかった時に買ってあげないとは言ってないじゃないか」
親「1位をとれなかった場合、買ってあげるまたは買ってあげないのいずれかであっても命題の真理値は真である」
子「殺す」
```

上の小噺は、論理学というよりも「真理値の決定権が親にある」という権力の非対称性の話のような気がしますが（笑）。それはさておき、日常語の「ならば」は**if and only if**（晴れたなら、かつ晴れた時に限り行く）の意味で使われることが多いものの、論理演算の「ならば（`→`）」と同じ意味で使われる場面もあり、つまり両方の意味を含むため上のような乖離が生じるのだと思われます。

## 論理演算というものを一段抽象化して考えてみる

そもそも論理演算とは何者か？という原点に立ち返って考えてみます。

以下は、おなじみのAND（`Λ`）、OR（`∨`）、IF（`→`）の真理値表です。`T`は真（`True`）、`F`は偽（`False`）を意味します。ここにあげた論理演算以外にも、`XOR`、`NAND`などがありますが割愛します。


|#|(P,Q)| P∧Q | P∨Q |P→Q|
|:-:|:-:|:-:|:-:|:-:|
|1|(T,T)| T | T | T |
|2|(T,F)| F | T | F |
|3|(F,T)| F | T | T |
|4|(F,F)| F | F | T |

この表を眺めていて思うのですが、上記以外の真理値表をもつ論理演算子があってもいいのでは？と。例えば、入力`(P,Q)=(F,F)`のみに対して`T`を出力し、それ以外の入力に対して`F`を出力する論理演算子があってもいいのではないか、と。

## (P,Q)とP○Qの真理値の組み合わせ

そこで、`P`の真理値と、`Q`の真理値のすべての組（タプル）を表に書き出してみました。タプルは4通りとなります。

|#||T|F|
|:-:|:-:|:-:|:-:|
|1|T|(T,T)|(T,F)|
|2|F|(F,T)|(F,F)|

さらに「4通りのタプルと、`P○Q`の真理値」のすべてのタプルを表に書き出すと、以下となります（記号「`○`」は、論理演算子を一般化した記号です）。

|#|(P,Q)|((P,Q),P○Q)|((P,Q),P○Q)|
|:-:|:-:|:-:|:-:|
|1|(T,T)|((T,T),T)|((T,T),F)|
|2|(T,F)|((T,F),T)|((T,F),F)|
|3|(F,T)|((F,T),T)|((F,T),F)|
|4|(F,F)|((F,F),T)|((F,F),F)|

4通りの各タプルに対して、`P○Q`の真理値（`T`または`F`）が対応づけられるので、対応づけのパターンは`2^4=16`の16種類になります。この16種類の一部に、おなじみの論理演算（`∧`、`∨`、`→`）を割り当てた表が以下となります。ここでは、既存の論理演算子が割り当てられない無名の論理演算を「`?`」と表記しています。

|#|(P,Q)|?|((P,Q),P∨Q)|?|?|((P,Q),P→Q)|?|?|((P,Q),P∧Q)|?|?|?|?|?|?|?|?|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|1|(T,T)|((T,T),T)|((T,T),T)|((T,T),T)|((T,T),T)|((T,T),T)|((T,T),T)|((T,T),T)|((T,T),T)| ((T,T),F)|((T,T),F)|((T,T),F)|((T,T),F)|((T,T),F)|((T,T),F)|((T,T),F)|((T,T),F)|
|2|(T,F)|((T,F),T)|((T,F),T)|((T,F),T)|((T,F),T)|((T,F),F)|((T,F),F)|((T,F),F)|((T,F),F)|((T,F),T)|((T,F),T)|((T,F),T)|((T,F),T)|((T,F),F)|((T,F),F)|((T,F),F)|((T,F),F)|
|3|(F,T)|((F,T),T)|((F,T),T)|((F,T),F)|((F,T),F)|((F,T),T)|((F,T),T)|((F,T),F)|((F,T),F)|((F,T),T)|((F,T),T)|((F,T),F)|((F,T),F)|((F,T),T)|((F,T),T)|((F,T),F)|((F,T),F)|
|4|(F,F)|((F,F),T)|((F,F),F)|((F,F),T)|((F,F),F)|((F,F),T)|((F,F),F)|((F,F),T)|((F,F),F)|((F,F),T)|((F,F),F)|((F,F),T)|((F,F),F)|((F,F),T)|((F,F),F)|((F,F),T)|((F,F),F)|

つまり、「P,Qの真理値の組み合わせ」と「P○Qの真理値の組み合わせ」のすべての組のうち、特定の組について割り当てたニーモニックが、AND（`∧`）やOR（`∨`）、IF（`→`）である、ということです。

だから、なぜ「IF（ならば）」が上記のような組をとるかというと、「`((P,Q),P→Q)`」列の組にニーモニックを割り当てる時、自然言語の語彙からもっとも名が体を表しているニーモニックを選ぶとすれば「IF（ならば）」だから、になりますかね。論理学の歴史を紐解いたわけではないので、私の想像ですが。

なぜ論理学の「ならば」は、日常用語の「ならば」と意味がずれているのかという疑問に対して、「そう定義したほうが便利だから」「都合がよいから」という簡便的説明をする人がいますが、ようはこういうことが言いたいのだと思います。

## 余談
プログラミング言語のif文（if式ではない）も、論理演算の「ならば（`→`）」とは違います（if文は文であって式ではない）。コードで表現するとすれば、条件演算子の式`((P) ? (Q) : true)`になるかと思います。
【Glassfish5】 Ping Connection Pool failed for mysqlPoolエラー

##エラーその1
データベースへの接続プール作成時、以下のエラーが表示された。
> Class name is wrong or classpath is not set for com.mysql.jdbc.jdbc2.optional.MysqlDataSource Please check the server.log for more details.

これは、Datasource Classname項目の間違い！
<font color="red">❌</font>　com.mysql.jdbc.jdbc2.optional.MysqlDataSource
<font color="red">○</font>　com.mysql.cj.jdbc.MysqlDataSource

##エラーその2
エラーその1を実施後、以下のエラーが表示された。
> Connection could not be allocated because: Cannot open file:/usr/local/glassfish5/glassfish/domains/domain1/config/keystore.jks [Keystore was tampered with, or password was incorrect

Edit JDBC Connection Pool Properties 【Additional Propertiesタブ】
Name項目の間違い！
<font color="red">❌</font> URL - jdbc:mysql://localhost:3306/\<DB_Name\>
<font color="red">○</font> URL - jdbc:mysql://localhost:3306/\<DB_Name\>?<font color="orange">useTimeZone=true&serverTimezone=UTC&autoReconnect=true&useSSL=false</font>
海外からの怪しいアクセスを遮断する

自サーバで海外からの怪しいアクセスを確認したのでブロックをしてみた。
個人的な判断基準とコマンドを参考程度に記載しておく

■前提
AWS上で立てたwebサーバ。HTTP/HTTPSのみ開放している。
ドキュメントルート以下にBasic認証を設定。（個人利用目的のページである為）

①アクセス数の多いアクセス元IPを確認する。

```shell
cat access_log | awk '{print$1}' | sort | uniq -c | sort -nr | head
```
②明らかに数値の多いIPのアクセス先ファイルを確認する。
※ぶっちゃけるとBasic認証をかけているサイトなので、自分以外の複数回アクセスは全て怪しいアクセスになるのだが、攻撃者がどういう攻撃を仕掛けてきてるか見ている。

攻撃パターン1:普通にBasic認証を総当たりで突破を試みている。

```shell
grep '<怪しいIPアドレス>' access_log | awk '{print$7}' | sort | uniq -c | sort -nr | head
    113 /
```

→ ドキュメントルートへのアクセスのみ。ログ内容を見ると全て301,401エラー。
　突破できずにあきらめたっぽい。

攻撃パターン2:特定プログラム固有ファイルの脆弱性をついた不正アクセス

```shell
grep '<怪しいIPアドレス>' access_log | awk '{print$7}' | sort | uniq -c | sort -nr | head
     10 /vendor/phpunit/phpunit/src/Util/PHP/eval-stdin.php
      5 /?XDEBUG_SESSION_START=phpstorm
      5 /wp-content/plugins/wp-file-manager/readme.txt
      5 /solr/admin/info/system?wt=json
      5 /index.php?s=/Index/\\think\\app/invokefunction&function=call_user_func_array&vars[0]=md5&vars[1][]=HelloThinkPHP21
      5 /_ignition/execute-solution
      5 /console/
      5 /Autodiscover/Autodiscover.xml
      5 /api/jsonws/invoke
      5 /?a=fetch&content=<php>die(@md5(HelloThinkCMF))</php>
```
wordpressとかはよく狙われてるイメージ。
https://www.webgogo.jp/index.php/news/211
※自サーバではそもそも使ってないor存在しないファイルだったので、全部401エラーだったようだ

```shell
grep '<怪しいIPアドレス>' access_log | grep -v 'HTTP/1.1" 401'
```

<h4>対策</h4>
そのまま放置して、変なことをされても困るので怪しいIPは一通りiptablesでブロック（Drop）しておいた。

```shell
sudo iptables -A INPUT -s <怪しいIPアドレス> -j DROP
```
CircleCIでjestを実行した際に時間がかかる問題を解決した

## 現象

ローカル開発環境だと**30s**で終わるテストがCircleCIだと**8m30s**かかっていました。
場合によっては以下の様にOOMが発生していました。

```
Exited with code exit status 137
CircleCI received exit code 137
```

## 原因

jestをデフォルトの設定で実行すると並列数を実行環境のCPUの50%と動的に決まるのですが、コンテナの場合だと相性が悪く、並列数が増えることでメモリ使用量が増えた結果OOMしたり、一つ一つのテストが遅くなる様です。

## 対応

CircleCIの場合は`jest`の実行にオプションを付けて並列処理を制御する対応が必要です。

* `--maxWorkers`オプションを付与して並列実行数を制限する
    * See: https://doc.ebichu.cc/jest/docs/ja/cli.html#maxworkers-num
* `--runInBand`オプションを付与して明示的に直列処理をする
    * See: https://doc.ebichu.cc/jest/docs/ja/cli.html#runinband

今回の場合ではコンテナのスペックがさっと把握できなかった事と`--runInBand`で充分な改善が継承できたためこちらで対応しました。
私の環境のCircleCIでテストの実行時間は元々**8m30s**でしたが、`--runInBand`をつけ直列実行にしたことで、**30s**に改善されました。

## 参考

https://doc.ebichu.cc/jest/docs/ja/cli.html
https://ishikawa-pro.hatenablog.com/entry/2020/10/19/100000
[Amplify] amplify push が default authorization type と additional auth type の入れ替えを検知しない時の対処法

# バージョン
amplify cli 5.1.0
macOS 11.4

# 状況

``amplify update api``で``default authorization type``と``additional auth type`` （1つだけ設定されている） が逆になるように設定した後``amplify push``したが、``No changes detected``と表示されてしまい、クラウド側に反映できない。

## 例

``default authorization type``：**API KEY**
``additional auth type``：**Amazon Cognito User Pool**

と設定してある時、``amplify update api``で、


``default authorization type``：**Amazon Cognito User Pool**
``additional auth type``：**API KEY**

に設定し直した後``amplify push``しても、``No changes detected``と表示される。

# 対処法

先に``amplify update api``で``default authorization type``だけ設定して``amplify push``しておくと上手くいった。

## 例

``default authorization type``： **API KEY**
``additional auth type``： **Amazon Cognito User Pool**

と設定してあるなら、先に``amplify update api``で、

``default authorization type``：**Amazon Cognito User Pool**

だけ設定して``amplify push``してから、``amplify update api``で、

``default authorization type``：**Amazon Cognito User Pool**
``additional auth type``：**API KEY**

に設定して``amplify push``すると上手く行く。
windows11 で、右クリックメニューがちょっと面倒になってた

# 意図せずwindows11になっていた。
windodws10がinsider preview のdevチャンネルだったので、自動的にwindows11に変わっていまいました。

# 右クリックのメニューが変だ。
右クリックで出てくるメニューが減ってる。
前まで出てきてた7zipとかTortoiseGitとか出てこなくて困った。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1017728/4ac55a68-6396-369b-6a17-474f9604378c.png)

と思ったら、「show more options」 を押すと出てきました。よかった。
けど、右クリックはよく使うので、一手増えたのが結構不満です。改良希望。

対象を選んで状態で「Shift+f10」を押しても良いようですが、もうちょっと押しやすい場所にしてほしかった。。。

# キーボードで代替 
2021/10/9追記
右クリックを使う代わりに「アプリケーションキー」でもよいみたいです。初めて触りました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1017728/89942586-64a4-20b7-aa1a-996c2dfe26e2.png)

https://www.724685.com/word/wd191218.htm
iOS WebViewアプリで、HTMLのfile inputタグから「写真またはビデオを撮る」を選択するとアプリがクラッシュする

WebViewアプリを開発していて、HTMLのfile inputタグで、「写真またはビデオを撮る」を選択するとアプリがクラッシュする事象が発生したので、備忘録と同じ事象が起きた方のためにメモを残しておきます。


##解決方法

info.plistに下記を追記する

###カメラ起動でのクラッシュを防ぐ

```
<key>NSCameraUsageDescription</key>
<string>You can take photos to document your job.</string>
```

###ビデオ起動でのクラッシュを防ぐ

```
<key>NSMicrophoneUsageDescription</key>
<string>You can record audio and video using this description key.</string>
```
標準入力の取得方法(Python)


# 標準入力の取得方法(Python)

atcoder や paiza などの競技プログラミングをするときによく使う標準入力の取得方法。

## 1つの文字を取得

```python:入力
a
```

```python:実装
s = input()
```

## 1つの数値を取得

```python:入力
1
```

```python:実装
n = int(input())
```

## 1行複数の文字を取得(変数固定)

```python:入力
a b
```

```python:実装
a, b = input().split()
```

## 1行複数の数値を取得(変数固定)

```python:入力
1 2
```

```python:実装
a, b = map(int, input().split())
print('{} {}'.format(a, b))
# 出力
1 2
```

## 1行複数の数値を取得(Listで変数可変)

```python:入力
1 2
```

```python:実装
ls = list(map(int, input().split()))
print(ls)
# 出力
[1, 2]
```

## 複数行1つの文字を取得

競プロでは入力の1行目に行数指定されることがほとんどなので分けて取得。

```python:入力
3 # 行数
1
2
3
```

```python:実装
n = int(input())
l = [int(input()) for _ in range(n)]
print(l)
# 出力
[1, 2, 3]
```

## 複数行複数の数値を取得(変数固定)

競プロでは入力の1行目に行数指定されることがほとんどなので分けて取得。

```python:入力
3       # 行数
1 2 3
4 5 6
7 8 9
```

```python:実装
n = int(input())
for _ in range(n):
  a, b, c = map(int, input().split())
  print('{} {} {}'.format(a, b, c))

# 出力
1 2 3
4 5 6
7 8 9
```

## 複数行複数の数値を取得(2次元配列)

```python:入力
3       # 行数
1 2 3
4 5 6
7 8 9
```

```python:実装
n = int(input())
data = [list(map(int, input().split())) for _ in range(n)]
print(data)
# 出力
[[1, 2, 3], [4, 5, 6], [7, 8, 9]]
```

## 出力するときは f-string が便利

https://realpython.com/python-f-strings/
パスワード認証のサーバでSSH接続を自動化する方法

遠隔サーバにてコマンドを自動実行するにあたり必要になったのでメモ


```bash:connect.sh
#!/bin/bash

# 接続先情報
SSH_USER=work
SSH_PASS=hoge
SSH_HOST=localhost
REMOTE_CMD=$1


# 後述のSSH_ASKPASSで設定したプログラム(本ファイル自身)が返す内容
if [ -n "$PASSWORD" ]; then
  cat <<< "$PASSWORD"
  exit 0
fi

# SSH_ASKPASSで呼ばれるシェルにパスワードを渡すために変数を設定
export PASSWORD=$SSH_PASS

# SSH_ASKPASSに本ファイルを設定
export SSH_ASKPASS=$0
# ダミーを設定
export DISPLAY=dummy:0

# SSH接続 & リモートコマンド実行
RET=`exec setsid ssh $SSH_USER@$SSH_HOST $REMOTE_CMD`
echo $RET
```

shellで実行
`$ ./connect.sh "date"`


crontabで実行
`chmod +x connect.sh`
`*/1 * * * * /home/hoge/connect.sh "date" >> /home/hoge/resalt.log`


活用

```bash:command.sh
/home/work/connect.sh 'date' >> /home/work/date.log
/home/work/connect.sh 'ls -la |grep "data.log"' >> /home/work/file.log
```


備考
・expectコマンドは、バックグラウンドで実行されるような場合には利用できない（cronなど）
・このような場合にはssh_askpassを利用する


参考
https://qiita.com/wadahiro/items/977e4f820b4451a2e5e0
Qiita投稿用の執筆環境を整える

## はじめに

`Visual Studio Code` で `Qiita` へ記事を投稿する環境を整えた方法について記載した記事です。`Visual Studio Code` で `Qiita` の記事を執筆する環境を整えたのには理由があります。まず、私が `Vimmer` であり、`vim` のキーバインドでなければ `PC` での作業効率は格段に落ちるためです。なにより、モチベーションが上がりません。

## この記事でわかること

`Visual Studio Code` で必要最低限の `markdown` が執筆できる環境が構築できます。

## 環境

| 項目               | バージョン         |
| ------------------ | ------------------ |
| OS                 | Ubuntu 18.04.5 LTS |
| Visual Studio Code | 1.57.1             |

## `Visual Studio Code` のプラグイン

- Prettier
- markdownlint
- Markdown Preview Enhanced
- テキスト校正くん

### Prettier

このプラグインを `Visual Studio Code` にインストールされていないと `Qiita` の記事を書くモチベーションが上がらないぐらい重要なプラグインです。必ずインストールすることをオススメします。

```shell
$ code --install-extension esbenp.prettier-vscode
$
```

### markdownlint

`markdown` 構文を目視で精査するのは、極力やりたくない作業です。その作業を開放してくれるのがこのプラグインです。執筆の効率が格段に上がるのでインストールしましょう。

```shell
$ code --install-extension DavidAnson.vscode-markdownlint
$
```

### Markdown Preview Enhanced

`Visual Studio Code` には、必要最低限の `markdown` のプレビュー機能が搭載されています。普段使いでは十分過ぎる機能ですが、あまり見た目がよろしくないです。見た目は執筆のモチベーションに直結するので、このプラグインをインストールしてモチベーションを上げていきましょう。

```shell
$ code --install-extension shd101wyy.markdown-preview-enhanced
$
```

### テキスト校正くん

日本語の校正を手助けしてくれるこのプラグインは、`Qiita` の執筆活動に欠かせないプラグインです。このプラグインをインストールして良き執筆活動に励みましょう。

```shell
$ code --install-extension ICS.japanese-proofreading
$
```

### まとめてインストール

```shell
$ code --install-extension ICS.japanese-proofreading &&
code --install-extension DavidAnson.vscode-markdownlint &&
code --install-extension esbenp.prettier-vscode &&
code --install-extension ICS.japanese-proofreading
$
```

## おわりに

最後まで読んでいただきありがとうございます。この記事がみなさまの良き執筆活動の役に立てればと思います。
【Flutter】pushNamedをちょっとだけ便利に使う方法

##通常の使い方

通常は、遷移する先のルート名をStringで指定します↓
ですが画面が増えて、ルーティングがもっと複雑になってくるとtypo（タイプミス）が発生しかねません。
typoがあったとしてもStringでの指定ですので、IDEは検知してくれないですね。
ビルドしたときにエラーが起きるだけです。

```dart:main.dart
import 'package:flutter/material.dart';
import 'package:qiita/first_screen.dart';
import 'package:qiita/second_screen.dart';
import 'package:qiita/third_screen.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData.light(),
      initialRoute: 'first_screen', //ここはStringで指定する
      routes: {
        'first_screen': (context) => FirstScreen(), //ここも
        'second_screen': (context) => SecondScreen(), //ここも
        'third_screen': (context) => ThirdScreen(), //ここも
      },
    );
  }
}

```

##ちょっとだけ便利な方法

↓のように、各画面でルート名を指定しておき、それを渡すようにすればtypoを防ぐことができます。

```dart:first_screen.dart
import 'package:flutter/material.dart';
import 'third_screen.dart';
import 'second_screen.dart';

class FirstScreen extends StatelessWidget {
  static const String id = 'first_screen'; //ここでルート名を指定しておく

  @override
  Widget build(BuildContext context) {
    return Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        Container(
          child: Text('FirstScreen'),
        ),
        Container(
          child: TextButton(
            onPressed: () {
              Navigator.pushNamed(context, SecondScreen.id);
            },
            child: Text('SecondScreenに移動'),
          ),
        ),
        Container(
          child: TextButton(
            onPressed: () {
              Navigator.pushNamed(context, ThirdScreen.id);
            },
            child: Text('ThirdScreenに移動'),
          ),
        ),
      ],
    );
  }
}

```

```dart:main.dart
import 'package:flutter/material.dart';
import 'package:qiita/first_screen.dart';
import 'package:qiita/second_screen.dart';
import 'package:qiita/third_screen.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData.light(),
      initialRoute: FirstScreen.id, //ここで打ち間違えても、IDEがミスを教えてくれる
      routes: {
        FirstScreen.id: (context) => FirstScreen(),
        SecondScreen.id: (context) => SecondScreen(),
        ThirdScreen.id: (context) => ThirdScreen(),
      },
    );
  }
}

```

2画面しかない場合はあんまりメリット感じないですが、画面が増えれば恩恵が大きいかも。
参考までに他の画面↓

```dart:second_screen.dart
import 'package:flutter/material.dart';

class SecondScreen extends StatelessWidget {

  static const String id = 'second_screen';

  @override
  Widget build(BuildContext context) {
    return Center(
      child: Container(
        child: Text('SecondScreen'),
      ),
    );
  }
}
```
##補足
static const はつけなくてもいいですが、その場合FirstScreen().id、SecondScreen().id、というように()が必要です。

<a href="https://www.buymeacoffee.com/neruk" target="_blank"><img src="https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png" width=200></a>
AWS備忘録(IGWについて)

#概要
・最近、AWSについて勉強していてその備忘録としての情報を記載します。

##IGWについて
・AWSのIGW（インターネットゲートウェイ）は「VPC とインターネットとの間の通信を可能にする VPC※コンポーネント」(公式サイト引用)
※コンポーネント ＝ 構成要素。部品。
リンク：[IGW](https://docs.aws.amazon.com/ja_jp/vpc/latest/userguide/VPC_Internet_Gateway.html)
~~・自分の理解としては、インスタンス(EC2)へインターネットを経由してアクセスするために必要なゲートウェイ~~

##何故調べたのか
・EC2にSSH接続が出来なかった原因が、IGWのルーティング設定が「※0.0.0.0/0」ではなく異なる値が設定されていたためだった。
※全てのホスト、任意の宛先を意味する

##何故、気づけなかったのか
・自分はサーバにアクセスする時は疎通の取れるネットワーク内にいること、サーバ側がSSHやtelnetを許容していれば良いという認識しかなったです。

・クラウドコンピューティングは、インターネットなどのコンピュータネットワークの経由が前提となるという前提的な話が抜け落ちていました。。。

##今後について
今はまだ初歩的なものですが、今後はより質の高い記事を書けるよう勉強していきます。分野については、クラウドやプログラミング(python,js,php etc)やtableauについて書いていきたいなと思います。
使用するテスト言語と期待される生成テストコード

お気に入りのテストフレームワークのDSLを使用した場合、どのようなコードが生成されるかご存知ですか？

開発者としては、知っておくと面白いかもしれないね。もしかしたら、直接書くことができないほど恐ろしいものかもしれない。あるいは、minitestのテストセットよりも簡単かもしれない。

とにかく、RSpecとminitestの間に終わりのない議論を避けながら、この質問に答えようとするために、この記事の目的のために[RSpecクローン](https://r-spec.dev/)プロジェクトを使用する。

## RSpec cloneとは？

このプロジェクトは、正確、セキュリティ、標準化を重視したRSpecのミニマリストな再実装だ。

コミュニティの[RSpecスタイルガイド](https://rspec.rubystyle.guide/)に記載されているガイドラインとベストプラクティスを実施したいという思いから、このRSpecクローンはRSpecのDSLのほとんどを含み、魔法の力を使わずに期待される結果を表現する。

![What did you RSpec?](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/16358/3d673996-12c6-4c5e-0200-d04e8280e490.jpeg)

早速ですが、フレームワークがどのようにテストを構築・実行するのかを理解するために、DSLの構文と生成されたRubyのコードの対応関係をご紹介する。読みやすくするために、これらの対応関係はメソッドごとにまとめられている。

## DSLからRubyへ

### `describe` メソッド

これを書くと

```ruby
RSpec.describe String do
end
```

このコードが生成されることを期待している：

```ruby
Class.new do
  private

  def described_class
    String
  end
end
```

### `context` メソッド

これを書くと

```ruby
RSpec.context "when in a context" do
end
```

このコードが生成されることを期待している：

```ruby
Class.new do
end
```

### `subject` メソッド

これを書くと

```ruby
RSpec.describe ".subject" do
  subject do
    "foo"
  end
end
```

このコードが生成されることを期待している：

```ruby
Class.new do
  private

  def subject
    "foo"
  end
end
```

### エンベデッド `describe` メソッド

これを書くと

```ruby
RSpec.describe ".describe" do
  describe "embedded describe" do
  end
end
```

このコードが生成されることを期待している：

```ruby
base = Class.new do
end

Class.new(base) do
end
```

### `let` メソッド

これを書くと

```ruby
RSpec.describe ".let" do
  let(:answer_to_everything) { 41 + one }
  let(:one) { 1 }
end
```

このコードが生成されることを期待している：

```ruby
Class.new do
  private

  def answer_to_everything
    41 + one
  end

  def one
    1
  end
end
```

### `before` メソッド

これを書くと

```ruby
RSpec.describe ".before" do
  before do
    puts "hello"
  end
end
```

このコードが生成されることを期待している：

```ruby
Class.new do
  private
  
  def initialize
    puts "hello"
  end
end
```

### `expect` メソッド

これを書くと

```ruby
RSpec.describe "#expect" do
  it { expect(41.next).to be(42) }
end
```

このコードが生成されることを期待している：

```ruby
description = Class.new do
end

require "matchi/rspec"
require "r_spec/clone/expectation_target"

example = Class.new(description) { include Matchi::Helper }
sandbox = example.new
sandbox.instance_eval { ExpectationTarget::Value.new(41.next).to be(42) }
```

そして、このメッセージを期待している：

```txt
Success: expected to be 42.
```

## Rubyでのテストが楽しい

[テストを書かない](https://github.com/fixrb/brutal)のであれば別ですが、このようなDSLインターフェイスを使用する利点は、エラーの可能性がある追加のロジックを仕様書に導入することを制限し、アルゴリズムの複雑さが少ない優れたRubyパターンの使用を奨励し、Rubyコードをより短く、より（機械）可読にすることだ。

[Adam Hawkinsさんから](https://speakerdeck.com/ahawkins/bow-before-minitest)、

> RSpecはテストのためのドメイン特化言語で、minitestはrubyだ。

どちらも好きなので、[RSpecクローン](https://r-spec.dev/)も気に入っていただけると嬉しい。