OmniAICreator/Qiita-1.07M huggingface dataset:
Virtual Box & Vagrant & Centos7 & Artifactory 構築

# **Hello Artifactory みたいなやつ**

## 0. 前提条件
```
- Windows 10 Home
- Oracle VM Virtualbox 6.0.22
- vagrant 2.2.6
- Centos 7.8
- Box centos/7
- Artifactory 4.6.0
```
### 参考情報
[System Requirements For Artifactory 4.x](https://www.jfrog.com/confluence/display/RTF4X/System+Requirements)

## 1. rsync の install  

```bash
# root へ切り替え
su -
# rsync が install されているのか確認
yum list installed | grep rsync

#  - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
# 以降は install されていない場合に実施
#  - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

# rsync の package を検索 [省略可能]
yum search rsync
# rsync の情報を確認 [省略可能]
yum info rsync.x86_64
# rsync の  install を実施
yum install rsync.x86_64
```

## 2. jdk 1.8 の install  

```bash
# root へ切り替え
su -
# 任意の directory を作成し移動
mkdir -p dir; cd $_
# open jdk 1.8 の package を取得
wget https://download.java.net/openjdk/jdk8u41/ri/openjdk-8u41-b04-linux-x64-14_jan_2020.tar.gz
# 圧縮ファイルを解凍
tar xzvf openjdk-8u41-b04-linux-x64-14_jan_2020.tar.gz
# /opt 配下に移動
mv java-se-8u41-ri/ /opt/
# 
alternatives --install /usr/bin/java java /opt/java-se-8u41-ri/bin/java 1
# /etc/profile に $JAVA_HOME $JRE_HOME を追加する
vi /etc/profile
```

### /etc/profile の最下部に下記の内容を追記

```bash
export JRE_HOME=/opt/java-se-8u41-ri/jre
export JAVA_HOME=/usr/bin/java
```

## 3. artifactory 4.6.0 の install

```bash
# root へ切り替え
su -

# 任意の directory を作成し移動
mkdir -p <dir name>; cd $_

# artifactory 4.6.0 の rpm を取得
wget -O artifactory-oss-4.6.0.rpm https://bintray.com/jfrog/artifactory-rpms/download_file?file_path=jfrog-artifactory-oss-4.6.0.rpm

# rpm を利用して install 実施
rpm -ivh artifactory-oss-4.6.0.rpm

# artifactory が起動しているか確認
systemctl status artifactory

# artifactory を起動
systemctl start artifactory

# 起動確認する
less /var/opt/jfrog/artifactory/logs/artifactory.log
```

以上でインストール完了
HTTPメソッドとアクションとCRUDの関係性について

自分なりに関連性をわかりやすくまとめてみたものを投稿します。

![0e2f8bc0606147b6ebe804657aaede87.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/696940/719d18a8-615e-ca2f-e3d8-aca16f1c973a.jpeg)
![85851b58defdb320ba87be7857f711fe.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/696940/7dccc6f7-f0f3-b487-58c1-a3b769bb7c22.jpeg)
はじめての ReactorKit【概要編】



iOS で Flux アーキテクチャの恩恵を受け、リアクティブかつ一方向のデータフローをサポートするための Framework で、これによって **シンプル**で**処理を追いやすく**かつ、**Testable**なアプリ設計を構築することができるようになります。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/292456/f604246f-d392-60cb-2f17-c3f3c997dede.png)


### ReactorKit の恩恵

- Testability
  - ビジネスロジックを View から完全に分離することで、`View` と `Reactor` をそれぞれテストすることが可能になります。

- Start Small
  - ReactorKit はアプリ全体に単一のアーキテクチャを適用する必要がなく、最小で１ViewController からアーキテクチャを導入できるため、プロジェクトの途中から導入する場合でも細かいステップを踏んでいくことができます。

- Less Typing
  - ReactorKit は複雑なコードを回避できるので、導入時コードの記述量を少なく済ませることができます。


また、他のアーキテクチャなどと比較して規約が比較的カッチリと決まっているため、指針をチームに依存させずに開発を進めることができます。

### 基本的な考え方

- Action
  - ユーザインタラクションを抽象化したもので、それぞれのインタラクションを Reactor クラスにオブジェクトとして定義します。`フォローする`や`ページングする`などのインタラクションを表現します。
- Reactor
  - ビジネスロジックを担い View の状態管理をする役割があります。Reactor と View の関係は **1:1** になります。Reactor を担うクラスは `Reactor` プロトコルに準拠し、このクラスには `UIKit` を import しないようにします。
- State
  - View の状態を抽象化したもので、Reactor クラスにそれぞれの状態をオブジェクトとして定義します。`フォローしているか`や`投稿のコレクション`の内容などを表現します。
- View
  - 現在の `State` を描画し、ユーザからのインタラクションを `Action` として `Reactor` に渡す役割を担っています。このレイヤーには `View` というプロトコルと、Storyboard で UIViewController を扱う場合などに使用する `StoryboardView` というプロトコルが用意されています。


![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/292456/0175bef4-bc1e-ad55-3785-e2b04f9eedb4.png)



#### データの流れ

ReactorKit でのデータの流れは下記のような感じです。また、Service レイヤーには API 実行や Local DB からのデータの取得など、Action の通知を受けて処理するべき副作用のロジックなどを追加します。

```
Action → Reactor → State → View → ....Action
```


![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/292456/0e6a24bd-2f92-aac1-1112-b399d69ccff8.png)



Reactor には、**mutate** と **reduce** の２つの関数が存在し、それぞれの役割は下記のような感じです。

- Mutation
  - Action を元に `mutate` 関数で生成される具体的な状態の変更方法を抽象化したものです。これはオブジェクトとして Reactor クラスに定義する必要があり、定義しない場合は Action オブジェクトが Mutation として扱われます。また、Mutation は Reactor 内部に閉じ込められたオブジェクトなので、View からは参照されません。



- mutate
  - Reactor が受け取った Action を元に処理を行い、Observable として Mutation を返却します。
- reduce
  - mutate 関数で返された Mutation を元に新しい State を作成し、返却します。


### テストについて

テストは基本的には下記の3点を抑えることによって動作を担保できます。詳しくは[こちら](https://github.com/ReactorKit/ReactorKit#testing)に記載されています。

#### View

- ユーザインタラクションで Action が正常に通知されているか
- State の変更時に View が更新されるか

#### Reactor

- Action 取得時に State が更新されるか
Ktor + GradleでのAutoreload

先日、「[Androidエンジニアが慣れている技術で作る維持費0円のサーバサイドアプリケーション](https://qiita.com/tfandkusu/items/5bee0e6eec035a74620b)」という記事でKtorとGradleを解説しました。この記事はその補足として、Autoreloadを解説します。

# 解決したい問題

`./gradlew run` コマンドでローカルサーバーを立ち上げることが出来ます。しかし、ソースコードの変更を行った後、その内容をローカルサーバーに反映するときは `CTRL + C` キーで終了してから、再度 `./gradlew run` コマンドを入力する必要があります。この手間を省力化したいです。

# 前提条件

先日の記事「[Androidエンジニアが慣れている技術で作る維持費0円のサーバサイドアプリケーション](https://qiita.com/tfandkusu/items/5bee0e6eec035a74620b)」のGoogle App Engineにデプロイする以外の設定は完了している状態を前提に説明します。

# 動作確認

Ktorの1.4.0および1.4.3で動作確認しています。1.5.0では動作しませんでした。

# KtorのAutoreloadを使う

Ktorの標準機能としてAutoreloadがあります。　[公式解説](https://ktor.io/servers/autoreload.html)

まず `application.conf` ファイルに監視フォルダフルパスの一部分を設定します。
Kotlinソースコードは `src/main/java` 以下に置いたので、 `main` を一部分として指定しました。
その一部分を含む.classファイルの更新がローカルサーバに反映されます。

```src/main/resources/application.conf
ktor {
    deployment {
        port = 8080
        // 追加
        watch = [ main ]
    }
    // 略
}
```

.classファイルの更新が反映されるので、ビルドは必要です。
InteliJ IDEAの `Build Project` ボタンを押すか

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/334798/7a6c21a8-84ab-4bb6-a720-26d409cd0afc.png"> 

ローカルサーバが動作しているコンソールとは別のコンソールで

```sh
./gradlew installDist
```

コマンドを入力します。
ブラウザをリロードすると変更が反映されます。

# ソースコードの変更をトリガーにビルドを実行する

さらに[GradleのContinuous Build](https://docs.gradle.org/current/userguide/command_line_interface.html#sec:continuous_build)を使うことでソースコードの変更をトリガーにビルドを実行できるため、 `Build Project` ボタンクリックや `./gradlew installDist` コマンド入力の手間を省くことができます。

ローカルサーバが動作しているコンソールとは別のコンソールで

```
./gradlew installDist --continuous
```

または

```
./gradlew installDist -t
```

を実行します。
Vuetify 2.3.0からv-contentが非推奨になった。（'v-content' is deprecated, use 'v-main' instead.）

# Vuetify 2.3.0からv-contentが非推奨に

コンソールで
「v-contentは非推奨ですよ。**v-main**使ってください。」

```
'v-content' is deprecated, use 'v-main' instead.
```

と怒られたので、
**v-main**にしたら警告はなくなりました。

調べてみるとどうやら、Vuetify 2.3.0からv-contentが**v-main**に変わったそうです。
ただ後方互換性はあるので、v-contentが全く使えないというわけではないので大丈夫です。ですが特に理由がなければ**v-main**に変更しておく方が良いでしょう。

> Liberator contains a few small upgrades for deprecated functionality. Don't worry, these upgrades are BACKWARDS compatible. If you experience anything that suggests otherwise, please reach out to us in our Discord community.

> General Changes

> v-content is now v-main

[vuetifyjs/vuetify](https://github.com/vuetifyjs/vuetify/releases?after=v2.3.1)
Laravelでlocal以外は強制的にhttpsを利用する

Heroku(無料版)でhttpsスキームを利用したかったので、
LaravelのAppServiceProvider.phpに分岐を追加しました。
前提として、ローカルの開発環境.envにAPP_ENV=localを設定しています。


```php:app/Providers/AppServiceProvider.php
24     public function boot()
25     {
26         // use https on Heroku
27         if (!\App::environment('local')) {
28             \URL::forceScheme('https');
29         }
30     }
```
VSCodeをRemote Desktopで開く方法

WindowsでWSL2を使用し，WSL側にpythonをインストールしてVSCodeのRemote Desktopで開発をしている人向けのtipsです．

1. File Explorerで開きたいディレクトリに移動
2. Shift＋右クリックからlinuxのシェルを立ち上げ
3. `$ code .`でカレントディレクトリでvscodeを立ち上げる

以上で今いるディレクトリでvscodeをRemote Desktop環境で開けます．
UUIDとは

# UUIDとは
UUIDとは、全世界で2つ以上のアイテムが同じ値を持つことがない一意な識別子のこと。
何らかの組織やシステムなどが管理・割り当てを行うわけではなく、誰でもいつでも自由に生成することができるが、他のUUIDと重複することは起きないようになっている。

【iBeaconパケットフォーマット】
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/684074/a6df538c-5236-fec2-7172-3ccc723fa8bb.png)

iBeacon AdvertiesパケットにはUUIDという領域があります。これの用途はなんでしょう？
UUIDとはUniversallyunique identifierの略語で、16バイトで構成されている識別子です。
固有識別番号とも呼ばれ、IT業界では結構使われている識別方法です。

# UUIDはどの値でセットすべきなのか
ランダムUUIDを生成し、自分のUUIDで設定すればよいです！
自分はJavaがメインなのでJavaで書いてみると

```java

String randomId = UUID.randomUUID().toString();
```

こんな感じになります。

ここで疑問なんですけど。。。。
「ランダムで作ると誰かは被るのでは？？」と思われますよね。
UUIDをランダムで生成すると、被る可能性が数学的にほぼないです。
安心して使いましょう！！

# UUIDはどこで使われるのか
同じパスに同じファイル名をアップロードするときによく使われるらしいですね。

```java

import java.util.UUID;  // import
 
public class Uuid
{
    public static void main(String[] args) 
    {   
        // ランダムキー生成
        UUID uuid = UUID.randomUUID();
        System.out.println(uuid);
 
        // "-"を除く
        String convertPw = UUID.randomUUID().toString().replace("-", "");
        System.out.println(convertPw);
    }
}

```
PHPのコンストラクタはprivateにできる

「PHPにおいてコンストラクタのアクセス権は`public`である必要がある」とする記事をいくつか見かけたのですが、**これは誤りです。**
（例）https://laraweb.net/surrounding/1472/

他の言語のことは知りませんが、少なくともPHPは、[コンストラクタ](https://www.php.net/manual/ja/language.oop5.decon.php)を`private`や`protected`に設定することができます。

# コンストラクタがprivateになるとどうなるか

**クラスの外から`new`できなくなります。**
以下のコードはFatalエラーになります。

```php
<?php
class Hoge {
    private function __construct(){}
}

// Fatal error: Uncaught Error: Call to private Hoge::__construct() from invalid context
$hoge2 = new Hoge();
```

自分のクラスの中であれば`new`できます。
以下のコードは正常に動作します。

```php
<?php
class Hoge {
    private function __construct(){}

    public static function instance() : self
    {
        return new self();
    }
}

// OK（public な静的メソッドを通しているのでインスタンスを取得できる）
$hoge = Hoge::instance();
echo get_class($hoge); // -> Hoge
```

`protected`にした場合は、自分自身とそれを継承したクラスからのみ`new`が可能になります。

# いつprivateにするのか

外からインスタンス化できないんじゃ使い道が無いようにも思えますが、案外そんなことはありません。

例えば以下のような使い方が考えられます。（※設計上良くない！ってパターンもあるかもしれませんが、今回は多めに見てください<(_ _)>）

## 定数や静的な要素のみを定義したクラス

定数や`static`な要素のみを定義したクラスは、インスタンス化する意味が無いので、privateなコンストラクタを定義することで、誤って`new`しようとしているおかしなコードを未然に防ぐことができます。

```php
class State
{
    const SUCCESS = 1;
    const FAILURE = 0;

    private function __construct();
}
```

## 実行中に1つだけ生成したいクラス（シングルトンパターン）

実行時に生成されるのが1つまでにしたいようなクラスは、コンストラクタをprivateにしておき、インスタンス取得用の静的メソッドを作っておきます。
最初に呼ばれたときに生成したインスタンスを静的なprivateプロパティとして保持しておき、2回目以降はそれを返すことで、インスタンス取得用のメソッドが何度呼ばれても、生成されるインスタンスが1つである状態を作ることができます。外から`new`できないので、それが保証されるわけです。

```php
<?php

class GlobalTime
{
    private static $instance = null;
    
    private function __construct(){}
    
    // ...
    
    public static function instance()
    {
        if (is_null(self::$instance)) {
            self::$instance = new self();
        }
        
        return self::$instance;
    }
}
```

## インスタンス生成に特定のメソッドを使わせたい場合

インスタンス生成に`new`ではなく、別のファクトリメソッドを使わせることで、コードが説明的になったり、柔軟なインスタンス運用（キャッシュさせておくとか）ができる場合があります。
その場合も、インスタンス化の手段を絞る意味でコンストラクタをprivateにしておくことが有効となります。

```php
class Price
{
    private $value;

    private function __construct(int $value)
    {
        $this->value = $value;
    }

    // ...

    public static function valueOf(int $value)
    {
        return new self($value);
    }
}
```

# 余談

最近の技術系の記事は質の悪いものも多いので、特定のサイトの記述だけを見てそれを信じてしまうのは危険だと思います。
いろんなサイトから情報を得た上で、最後に公式ドキュメントを読むなど、多角的に情報を仕入れて勉強を進めることをおすすめします。
SlackBotに用意しておきたいレスポンス3つ

プログラム書かなくてもbotは作れる！

# bot

新しいメッセージを作りたい、追加したいとき。すぐに見つからない

https://slack.com/customize/slackbot

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/169862/7b9a53bd-903a-d99c-3997-0630925ea6f6.png)

# tenki

雨雲レーダー。現時点での雨雲の状況が、ogpタグがあるようで、slack内で展開してくれるのでサイト開かなくてもslackで完結します。
（勝手に画像更新するので、時間経つと過去の投稿も更新されてるようです）
https://tenki.jp/radar/3/16/

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/169862/33238da3-0ffa-bf70-9954-7effe85bb021.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/169862/9794a88b-971d-0e1b-7d29-14bffb0747ed.png)

# えらんで

改行で複数メッセージを書くと、ランダムで選んで返してくれます。
掃除当番決めても良いですし、
食べログのリンク並べたらランチに困りませんね。

![Slackbot_Responses___yuuyayo_Slack.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/169862/4ab69f2c-29b8-098a-7549-4242da4b8a2e.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/169862/b5fc6892-d78c-c26c-e1cf-975156ab5ec6.png)


他にも便利な使い方あったら教えてください！
【Vue.js】vue-i18nを使って多言語化

vue.js備忘録、第三弾。
業務で多言語対応するのに使っている技術なので、勉強の為に。

## i18nとは
広くは「国際化」という事。internationalizationの先頭iと語尾nの間に18文字がある事からそう呼ばれているとか。読み方は色々あるようですが「あいじゅうはちえぬ」でも間違いではないみたい。

## vue-i18nというライブラリを使う
今回はVue.jsでの導入。[こちら](https://github.com/kazupon/vue-i18n)のライブラリを使用します。

## 導入

まずはライブラリをインストール

```
npm install vue-i18n
```


しっかり読み込む記述をします。

```javascript:main.js
import Vue from 'vue'
import VueI18n from 'vue-i18n';

Vue.use(VueI18n);
const i18n = new VueI18n({
  locale: 'ja',
  messages: {
    // 翻訳用のjson
    ja : require('../lang/ja.json'),
    en : require('../lang/en.json'),
    cn : require('../lang/cn.json'),
    tw : require('../lang/tw.json')
  }
});

const app = new Vue({
  el: '#app',
  i18n: i18n,
  components: {
  }
})
```

翻訳ファイルはjsonで書きます。

```json:ja.json
{
  "ログイン" : "ログイン",
  "会員登録" : "会員登録",
}
```

```json:en.json
{
  "ログイン" : "login",
  "会員登録" : "sing up",
}
```

`$tメソッド`を使って書く事で翻訳が適用出来るようになります。簡単だね。

```nav.vue
<div>
  <p class="login">{{ $t("ログイン") }}</p>
  <p class="sing_up">{{ $t("会員登録") }}</p>
</div>
```

vueだけで言語切り替えするだけならこれも簡単なのですが、
laravelと連携させて、どっちも変更するみたいな動きをさせたい。出来たらまた記事にします。
【RubyonRails】外部キー制約のついたカラムを追加する

##はじめに
環境
- Ruby 2.6.3
- MySQL5.7

##やりたいこと
旅館のオフィス活用マッチングを作成中
ユーザーがホテルをお気に入り登録できるようにしたい
なお、hotel_favoriteはモデル作成済み。

##方法
hotel_favoriteモデルに、user_idとhotel_idを持たせたい。
（user_idは関連付け済み）

##やったこと

```
rails g migration AddhotelidTohotel_favorites
```
→XXXXXXX_add_hotel_ref_tohotel_favorites.rbが作られた。
以下の通り編集しました。

```XXXXXXX_add_hotel_ref_tohotel_favorites.rb
class AddHotelRefTohotelFavorites < ActiveRecord::Migration[6.0]
  def change
    add_reference :hotel_favorites, :hotel, null: false, foreign_key: true
  end
end
```

ここで

```
rails db:migrate
```

以下のように、hotel_favoriteにhotel_idが追加されました。

```schema.rb
  create_table "hotel_favorites", options: "ENGINE=InnoDB DEFAULT CHARSET=utf8mb4", force: :cascade do |t|
    t.datetime "created_at", precision: 6, null: false
    t.datetime "updated_at", precision: 6, null: false
    t.bigint "user_id", null: false
    t.bigint "hotel_id", null: false
    t.index ["hotel_id"], name: "index_hotel_favorites_on_hotel_id"
    t.index ["user_id"], name: "index_hotel_favorites_on_user_id"
```
##まとめ
次回からは、下の記事みたいに、モデル作成時点でやればいいですね。。
https://qiita.com/hiro266/items/8a0374155cd18adbd7cf

```
rails g model hotel_favorite user:references hotel:references
```
ObjectMapperクラス

# ObjectMapperとは
ObjectMapperは、Jacksonライブラリの主要なアクタークラスです。 ObjectMapperクラスは、基本的なPOJO（プレーンオールドJavaオブジェクト）、または汎用のJSONツリーモデル（JsonNode）との間でJSONを読み書きする機能と、変換を実行するための関連機能を提供します。

 また、さまざまなスタイルのJSONコンテンツの両方で動作し、ポリモーフィズムやオブジェクトIDなどのより高度なオブジェクトの概念をサポートするように高度にカスタマイズできます。 ObjectMapperは、より高度なObjectReaderおよびObjectWriterクラスのファクトリーとしても機能します。

**※簡単にいうと？**
JacksonのObjectMapperはJava Objec↔Jsonパーシングを簡単にしてくれるクラスです。

# 使ってみた！
今回、WebSocketを利用してチャットアプリケーションを作成していますが、
実際、使っている箇所のソースコードを共有します。

```java

@Slf4j
@RequiredArgsConstructor
@Service
public class ChatService {
　　// 宣言
    private final ObjectMapper objectMapper;
    private Map<String, ChatRoom> chatRooms;

    @PostConstruct
    private void init() {
        chatRooms = new LinkedHashMap<>();
    }

    public List<ChatRoom> findAllRoom() {
        return new ArrayList<>(chatRooms.values());
    }

    public ChatRoom findRoomById(String roomId) {
        return chatRooms.get(roomId);
    }

    public ChatRoom createRoom(String name) {
        String randomId = UUID.randomUUID().toString();
        ChatRoom chatRoom = ChatRoom.builder()
                .roomId(randomId)
                .name(name)
                .build();
        chatRooms.put(randomId, chatRoom);
        return chatRoom;
    }

    public <T> void sendMessage(WebSocketSession session, T message) {
        try {
　　　　　　 // パーシング
            session.sendMessage(new TextMessage(objectMapper.writeValueAsString(message)));
        } catch (IOException e) {
            log.error(e.getMessage(), e);
        }
    }
}
```
### 結果
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/684074/92573c56-c4c0-c138-c7fa-ddca6b3babfe.png)

正常にJsonが戻ってきますね。

※ちなみに、WebSocketテストで使っているのは以下です。
[Simple WebSocket Clinet](https://chrome.google.com/webstore/search/websocket)

※ソースコードは以下となります。
https://github.com/twan65/websocket-exam
演算子の意味を変えてみる(Elixir)

# はじめに
- [Elixir](https://elixir-lang.org/)のドキュメントを読んでおりました
- [Redefining existing operators](https://hexdocs.pm/elixir/operators.html#redefining-existing-operators)を読んで「へぇ〜」と思ったので書いておきます
- [`+`](https://hexdocs.pm/elixir/Kernel.html#+/2)算の結果を[`-`](https://hexdocs.pm/elixir/Kernel.html#-/2)算にしてみます

# WrongMath

```elixir
defmodule WrongMath do
  def a + b, do: a - b
end
```
- こんなのを定義するわけです
- 早速つかってみましょう

```elixir
iex> defmodule WrongMath do
...>   def a + b, do: a - b
...> end
{:module, WrongMath,
 <<70, 79, 82, 49, 0, 0, 4, 252, 66, 69, 65, 77, 65, 116, 85, 56, 0, 0, 0, 127,
   0, 0, 0, 14, 16, 69, 108, 105, 120, 105, 114, 46, 87, 114, 111, 110, 103, 77,
   97, 116, 104, 8, 95, 95, 105, 110, 102, ...>>, {:+, 2}}

iex> import WrongMath
WrongMath

iex> 1 + 2
** (CompileError) iex:3: function +/2 imported from both WrongMath and Kernel, call is ambiguous

```
- 怒られます
    - あいまいは駄目よとのことです
- 以下のようにすると怒られません

```elixir
iex> import WrongMath
WrongMath

iex> import Kernel, except: [+: 2]
Kernel

iex> 1 + 2
-1
```

# Wrapping Up
- ここでは定義済の演算子をoverrideしてみました
- 公式には、[Defining custom operators](https://hexdocs.pm/elixir/operators.html#defining-custom-operators)の紹介もあります
- 使用にあたっては[Final note](https://hexdocs.pm/elixir/operators.html#final-note)をよくよくご参照ください
- Enjoy [Elixir](https://elixir-lang.org/)! :rocket::lgtm::rocket::lgtm::rocket:
新卒SEの備忘録 【ExcelVBA マクロ 基礎編】

#【ExcelVBA マクロ 基礎編】 

新人研修時のExcelVBAの自分用メモです。

##ExcelVBA マクロ

###・Cells(行、列)

###・最終行の取得　
Cells(Rows.Count, 1).End(xlUp).Row

###・For Next 
ループ処理、よく使う。

###・二重ループは、プログラムの基本
各カウンター変数が、行、列のどの数値を指しているか理解する。

###・仮引数
関数、メソッド定義時に使用される引数

###・実引数
その関数、メソッドを実際に使用する時に引き渡す引数

名前付き引数を使うと、引数の位置や順番を気にせずに使用できる。（配列）
→マクロVBAを読みやすくするため。

###・セルの選択
Range("セル番地").Select	Cells(行、列).Select  *Selectは、Rangeのオブジェクトのメソッド

###・表示形式
Range.NumberFormatLocalを使う。コンマを付ける。

例)12345→\12,345

###・Font指定
Range.Font.プロパティ = 設定値

###・セルのクリア　（マクロVBAで必須）
Clear：全体（数式、文字、書式、コメント全て）をクリア→初期状態
ClearContents：数式と文字を削除→書式（フォント、背景色、罫線等）は残る。

※セルのコピーの書き方で、マクロの技量が計れる。
マクロの処理速度にも大きく影響する重要な処理。

###・Format関数（Expressionは、必須）
Format(expression[,format[,firstdayofweek[,firstweekofyear]]])

###・DateAdd関数（3つとも必ず指定、追加する時間間隔を表す文字列式を指定）
DateAdd(interval, number, date)

###・Replace関数（最小の３つ必ず指定、置換する文字列を指定）
Replace(expression, find, replace[, start[, count[, compare]]])

###・IsEmpty関数（expression）
引数expressionには、Empty値かどうかを判定するバリアント型の変数を指定

###・Setステートメント
オブジェクト変数を使うには、Setステートメントが必要
→　Set　オブジェクト変数　＝　オブジェクト

##おわり。

オブジェクト変数とSetステートメント、Withステートメントを上手く組み合わせることで、マクロの記述が書きやすく、読みやすいものになる。
【React Native】Header Navigationでヘッダータイトル（Header Title）にコンポーネントを渡す方法

こんにちは！
最近はパソコンを持たない大学生も多いみたいですね。
パソコンを持たない＝スマホで完結
スマホアプリの需要の変化についても、気になるこの頃です。

さて、今回は「`React Native`の`Header Navigation`でヘッダータイトル（`Header Title`）にコンポーネントを渡す方法」について、お伝えしていきたいと思います。

![header_title（コンポーネント）.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/659719/d46cc73b-41f7-a8c9-974e-8de808890b0c.gif)

### （復習）`React Navigation`で`title`に任意の値を与える方法
```javascript
export default function SplashScreen() {
  function HomeScreen({navigation}) {
    return (
      <View style={styles.container}>
        <Text style={styles.text}>Home Screen!!</Text>
      </View>
    );
  }

  return (
    <Stack.Navigator>
      <Stack.Screen
        name="Home"
        component={HomeScreen}
        options={{headerTitle: 'title'}}
      />
    </Stack.Navigator>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    alignItems:'center',
    justifyContent:'center',
  },
  text: {
    fontSize: 50,
  },
});
```

※importなどの記述は省略しています。

結果は・・・

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/659719/e8e669c4-47af-c6d0-a924-5288d70728e2.png" width="50%" />

ヘッダータイトルに任意の値（title)を設定することができました。

### `React Navigation`で`title`にコンポーネントを渡す方法
ここから本題です。
ヘッダータイトルにコンポーネントを設定してみたいと思います。

例として、ヘッダータイトルをタップすると、アラートが表示されるようにしてみます。

```javascript
export default function SplashScreen() {
  function HomeScreen({navigation}) {
    return (
      <View style={styles.container}>
        <Text style={styles.text}>Home Screen!!</Text>
      </View>
    );
  }

  // ヘッダータイトルコンポーネント
  const title = () => {
    return (
      <TouchableOpacity onPress={() => alert('headerTitle Tapped')}>
        <Text>Title Component</Text>
      </TouchableOpacity>
    );
  };
  return (
    <Stack.Navigator>
      <Stack.Screen
        name="Home"
        component={HomeScreen}
        // ここで、headerTitleにtitleコンポーネントを渡してあげます。
        options={{headerTitle: title}}
      />
    </Stack.Navigator>
  );
}

```
結果は・・・
![header_title（コンポーネント）.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/659719/d46cc73b-41f7-a8c9-974e-8de808890b0c.gif)

これで、タイトルに独自のコンポーネントを設定することができました！

もちろんヘッダータイトルに画像を設定したりもできます。

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/659719/e61f3efa-1bf9-a1d6-5147-26653d2dac54.png" width="50%" />


### 参考資料
https://stackoverflow.com/questions/51986916/using-a-component-as-a-header-title-in-react-navigation
テーブルで大切な項目たち

テーブルを作成している時に、あれ、あってるよな？ってなって調べ直したのでメモ程度に貼っときます。

----------
### PK : primary key
主キー

----------
### UK : unique key
一意なキー

UNIQUE制約が設定されたカラムには重複した値を格納できなくなる。
この点は PRIMARY KEY制約と似ているが、UNIQUE制約の場合は値として NULLを格納することができ、また複数のカラムにNULLを格納できる。また複数のカラムに対してUNIQUE制約を設定することができる。

----------
### UN : unsigned
符号なし

以下やったことがあって、お世話になったことがある文献
[【メモ】【Laravel】外部キー制約付きMigrateがさっぱり動かないときのチェック・ポイント（Mysql） - Qiita](https://qiita.com/0w0/items/4a9cb7d27794bfb93d46)

----------
### AI : auto increment
カラムにINTEGER PRIMARY KEYを設定する時にAUTOINCREMENTを合わせて設定すると自動的に設定される値のルールが変わる。
対象のカラムに現在格納されている最大の値に1が加えられるのではなく、対象のカラムに今までに格納されたことのある最大の値に1が加えられた値が格納されるようになる。

----------
### FK : foreign key
外部キー

関連したテーブル間を結ぶために設定する列のことで、データの整合性をデータベースに保証させるために利用

----------
間違ってたら速攻直して勉強します。
トランザクション処理とバッチ処理の基礎

#【トランザクション処理とバッチ処理】

業務でよく使用するので簡単にまとめてみました。

基本情報技術者試験の勉強もしているので通ずる部分が多々あります。

[キタミ式イラストIT塾 基本情報技術者]
(https://www.amazon.co.jp/%E3%82%AD%E3%82%BF%E3%83%9F%E5%BC%8F%E3%82%A4%E3%83%A9%E3%82%B9%E3%83%88IT%E5%A1%BE-%E5%9F%BA%E6%9C%AC%E6%83%85%E5%A0%B1%E6%8A%80%E8%A1%93%E8%80%85-%E4%BB%A4%E5%92%8C02%E5%B9%B4-%E3%81%8D%E3%81%9F%E3%81%BF-%E3%82%8A%E3%82%85%E3%81%86%E3%81%98-ebook/dp/B082DT76Z8/ref=sr_1_1?adgrpid=103676090574&dchild=1&gclid=Cj0KCQjwv7L6BRDxARIsAGj-34rucxfZYDfk223g587hm1MuSyPff1q9UPMpZlvZQQ03TF4PmC82Q60aAkXaEALw_wcB&hvadid=450352953016&hvdev=c&hvlocphy=9053306&hvnetw=s&hvqmt=e&hvrand=11482670089444263247&hvtargid=kwd-850979033185&hydadcr=27299_11561646&jp-ad-ap=0&keywords=%E3%82%AD%E3%82%BF%E3%83%9F%E5%BC%8F+%E5%9F%BA%E6%9C%AC%E6%83%85%E5%A0%B1&qid=1598876861&sr=8-1&tag=googhydr-22/)　を活用しています。

##トランザクション処理

###トランザクション処理とは、システムの稼働形態として、要求に対して即座に処理を行い、結果が反映されるもの。

リアルタイムに処理結果を反映する必要のあるシステムは、こうした形態である。

例）銀行ATM　など。

####・トランザクションは、成功または失敗によって終了する。

一連の処理が問題なく、成功すれば整合性を保って更新される。
こうして、結果が確定されることをコミットという。

一連の処理に問題が生じてしまい、更新するはずだった状態から開始直前の状態に戻すことを、ロールバッグという。


##バッチ処理

###バッチ処理とは、即座に反映しなくてもいい処理の場合に、一定期間ごとに処理を取りまとめて実行するもの。

例）リアルタイム性を要求されない銀行ATMの処理、在庫管理　など。

####・バッチファイル　

たくさんの処理を自動で実行してくれるファイル

①指定された時間に自動実行
②ユーザー入力不必要で動作
③終了時に実行結果がわかる（ログなど。）

これらの特徴がある。

####・日常でのバッチ処理

世の中の業務システムは、ユーザーと直接やりとりをしている処理と、ユーザーとは直接やりとりをしないで裏方としてシステムを支えているバッチ処理とで構成されている。

バッチ処理は、リアルタイムの応答性を犠牲にする代わりに、スループット（処理能力）を優先している。
処理データを一定期間まとめて処理をすることで、システム全体の処理性能の向上や応答性の確保、外部システムとの機能連携向上に繋がっている。

デメリットは、データをリアルタイムで集計するのには不向きであること。
Gnu-COBOL 変数で数値を扱う

### 変数定義/代入

```
IDENTIFICATION DIVISION.
PROGRAM-ID. HELLO.

DATA DIVISION.
  WORKING-STORAGE SECTION.
    01 DATA1 PIC 9(5).            *> 「9」        -> 9は数値を表す
    01 DATA2 PIC 9(5) VALUE 200.  *> 「(n)」      -> ()内の数値は桁数を表す
    01 DATA3 PIC 9(5)V9(2).       *> 「VALUE」    -> 初期値を設定
                                  *> 「V」        -> 小数点数を表す 9(5)V(2)は整数部5桁小数部2桁の数値
PROCEDURE DIVISION.
  MAIN SECTION.
    MOVE 12345 TO DATA1.          *> 「MOVE TO」  -> 代入命令
    MOVE 123.45 TO DATA3.
    DISPLAY DATA1.
    DISPLAY DATA2.
    DISPLAY DATA3.
    STOP RUN.

```

### コンパイル/実行

**コンパイル**

```
$ cobc -x --free hello.cob
```

**実行**

```
$ ./hello
12345
00200
00123.45
```
フラクタルな数独

#言いたいこと

何の変哲もない次の数独

<img width="400" alt="s1.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/649673/8f1e18f2-d725-c55c-b2c4-0ca21fd40d94.png">

実は3つのブロックのみで構成されている。

<img width="400" alt="s2.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/649673/70b6ac4a-527d-b087-a239-7efb71d711e7.png">

さらにそれらのブロックも同じ構成である。（{1, 4, 7}, {2, 5, 8}, {3, 6, 9}で色分け）

<img width="300" alt="s3.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/649673/631276a5-043f-f905-214e-815117a232d4.png">

以上

#おまけ

ちょっと待って、プログラミング要素がないやん！
と言われそうなので任意のフラクタル数独が作れるプログラムを雑に作った。

```javascript
const n = 4; // ブロックの一辺のセル数

const numPatternList = [];
const sudokuResult = [];

let numPattern = [];
for (let i = 1; i <= n * n; i++) {
    if (i % n === 1) {
        numPattern = [];
        numPatternList.push(numPattern);
    }
    numPattern.push(i);
}

for (let i = 0; i < n * n; i++) {
    const row = [];
    const ii = Math.floor(i / n);

    for (let j = 0; j < n; j++) {
        const jj = (j - ii + n) % n;
        for (let k = 0; k < n; k++) {
            row.push(numPatternList[(n - i % n + k) % n][(jj + i) % n]);
        }
    }

    sudokuResult.push(row);
}

for (let i = 0; i < n * n; i++) {
    console.log(sudokuResult[i].join(", "));
}
```

##実行

```csv
1, 5, 9, 13, 2, 6, 10, 14, 3, 7, 11, 15, 4, 8, 12, 16
14, 2, 6, 10, 15, 3, 7, 11, 16, 4, 8, 12, 13, 1, 5, 9
11, 15, 3, 7, 12, 16, 4, 8, 9, 13, 1, 5, 10, 14, 2, 6
8, 12, 16, 4, 5, 9, 13, 1, 6, 10, 14, 2, 7, 11, 15, 3
4, 8, 12, 16, 1, 5, 9, 13, 2, 6, 10, 14, 3, 7, 11, 15
13, 1, 5, 9, 14, 2, 6, 10, 15, 3, 7, 11, 16, 4, 8, 12
10, 14, 2, 6, 11, 15, 3, 7, 12, 16, 4, 8, 9, 13, 1, 5
7, 11, 15, 3, 8, 12, 16, 4, 5, 9, 13, 1, 6, 10, 14, 2
3, 7, 11, 15, 4, 8, 12, 16, 1, 5, 9, 13, 2, 6, 10, 14
16, 4, 8, 12, 13, 1, 5, 9, 14, 2, 6, 10, 15, 3, 7, 11
9, 13, 1, 5, 10, 14, 2, 6, 11, 15, 3, 7, 12, 16, 4, 8
6, 10, 14, 2, 7, 11, 15, 3, 8, 12, 16, 4, 5, 9, 13, 1
2, 6, 10, 14, 3, 7, 11, 15, 4, 8, 12, 16, 1, 5, 9, 13
15, 3, 7, 11, 16, 4, 8, 12, 13, 1, 5, 9, 14, 2, 6, 10
12, 16, 4, 8, 9, 13, 1, 5, 10, 14, 2, 6, 11, 15, 3, 7
5, 9, 13, 1, 6, 10, 14, 2, 7, 11, 15, 3, 8, 12, 16, 4
```

<img width="400" alt="s4.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/649673/1d2e9378-2ad1-21c2-c971-cf3f08ac141a.png">

<img width="300" alt="s5.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/649673/bea62bd1-b709-ba4e-37a4-0bc09a43c88d.png">

以上！
タスク優先順位がすぐわかるようになる！基本のビジネスフレームワーク3選

# はじめに
こんな課題をかかえていないでしょうか？

- 忙しくて重要なタスクに手をつけられない:persevere:
- どのタスクをやるか、やらないかで迷う:dizzy_face:
- 実施したタスクが実は無駄だった:scream:

一度はこのようなことを考えたことがあるのではないでしょうか？
この記事では、これらの悩みを解決する助けになるツールをご紹介します。

# どうやって解決するの？
ビジネスフレームワークを使って解決します。

- 緊急度 × 重要度マトリクス
- 意思決定マトリクス
- なぜなぜ分析

これらを1つずつ紹介していきます。

# 緊急度 × 重要度マトリクス
気がつくと急ぎのタスクばかりやって、本当は大切なのにできていないタスクは無いでしょうか？
そんなことを避けるための解決ツールの一つが、` 「緊急度 × 重要度マトリクス」 ` です。

下記の図のように4つの枠に、それぞれのタスクを当てはめます。
＜例＞
![kirby1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/699417/15bf72e9-c1c2-76d7-4242-7fa848c7990a.png)

:arrow_upper_left: 右上エリア：重要度も緊急度も高ければ、対応する。
:arrow_lower_right: 右下エリア：重要度が低いが、緊急度が高いため、対応することになりがち。
:arrow_lower_left: 左下エリア：重要度、緊急度が低いなら、減らすことを考える。
:arrow_upper_left: **左上エリア：ここのタスクは意識して時間を確保しないと後回しになりがちなので、ここを実施するにはどうしたらいいかを考える。ここを実施していくことが、中期的には成果を出せるようになる。**



# 意思決定マトリクス
どれから手をつけるべきかわからない場合に役立つのが、`「意思決定マトリクス」`です。

対象となるタスクを書き出し、それぞれを観点ごとに点数付けし、**合計点数が高いタスクが一番効果的**というフレームワークです。
観点は何を重視するかによって書き換えてください。
点数に傾斜をつけるのもありです。

＜例＞

|  | 売上アップ | 効率化 | リスク | メンテナンス性 | 技術的優位 | スキルアップ | 合計 |
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|  **タスク1** | 3  |  2 | 2  | 2  | 2  | 2  | 13  |
|  **タスク2** | 3  |  3 | 1  | 2  | 1  | 1  | 11  |
|  **タスク3** | 1  |  1 | 1  | 2  | 2  | 3  | 10  |
|  **タスク4** |  1 |  1 | 3  | 1  | 3  | 3  | 12  |


# なぜなぜ分析
せっかくどのタスクを実施するのか決めても、選択肢にしたタスク自体を取り違えていたり、ピント外れだと、効果が出ないこともあります。
そこで使えるのが`「なぜなぜ分析」`です。
トヨタ式の分析と聞いたことがある方もいるかもしれません。

問題について、**「なぜ？」を5回繰り返して、問題を深掘りするフレームワーク**です。

```
＜例＞
問題：　システムが停止した
　↓
なぜ？(1) データ更新を誤った
　↓
なぜ？(2) 更新作業を一人で実施していた
　↓
なぜ？(3) 第3者がチェックする仕組みが無かった
　↓
なぜ？(4) チェックの仕組み作りが後回しになっていた
　↓
なぜ？(5) 仕組み作りの影響（ミスした時の影響）を理解していなかった
```
面倒ですよね。。
ただ頑張ってひねり出してなぜ？を繰り返すと、真の原因が出てきたりします。

*※同僚や部下にナゼナゼと繰り返し質問すると、相手を追い詰めてしまうことがあるので注意してください。*


# まとめ
そんなの知ってる！というかたも多かったかもしれません。
ただ、もし知っているだけで使っていないのでしたら、ぜひ使ってみてください。

使うことで、知識でしかなかったことが、自分の身になっていくのだと思います:muscle:

**自分だったら、どのタスクを実施するのがいいと思うのか、今一度、考えてみてはいかがでしょうか？**

ここまで読んでいただき、ありがとうございました:pray:
【Laravel】Diskを追加して任意の場所にファイルを保存する

## やりたいこと

Laarvelが入っているディレクトリより上のディレクトリにファイルを保存したい。例えば `/home`配下とか。
デフォルトで設定されている `local` ドライバの `root` のパスだと、Laravelの `storage/app` ディレクトリに設定されてしまう。

## ①`config/filesystems.php` に `disks` を追加

```config/filesystems.php
'disks' => [

        'local' => [
            'driver' => 'local',
            'root' => storage_path('app'),
        ],

        // 追加
        'test' => [
            'driver' => 'local',
            'root' => '/home/import',
        ],

        'public' => [
            'driver' => 'local',
            'root' => storage_path('app/public'),
            'url' => env('APP_URL').'/storage',
            'visibility' => 'public',
        ],

        's3' => [
            'driver' => 's3',
            'key' => env('AWS_ACCESS_KEY_ID'),
            'secret' => env('AWS_SECRET_ACCESS_KEY'),
            'region' => env('AWS_DEFAULT_REGION'),
            'bucket' => env('AWS_BUCKET'),
            'url' => env('AWS_URL'),
            'endpoint' => env('AWS_ENDPOINT'),
        ],

    ],
```

新しく `test` ディスクを追加し、`root` に任意のパスを設定。Laravelでは同じドライバに対して複数のディスクを持つことが可能。


## ②ファイルを保存

```hoge.php
$file = 'hoge.txt';
$txt = 'hoge';

Storage::disk('test')->put($file, $txt);
```
`config/filesystems.php` において、`test` ドライバで設定した `root` の値からの相対位置でファイル操作が行われる。つまり上記では、`/hoge/import/hoge.txt` として保存される。
EFSでマウントできない時に確認すること

#確認事項
* セキュリティグループが正しいか確認をする
* VPCのDNS設定を確認する
→DNS解決・DNS ホスト名を有効化する
* マウントポイントが作成されているか確認をする

無い場合は作成をする。

```
mkdir /mnt/efs
```

↓EFSのアタッチにあるコマンドをそのまま使う場合はデフォルトでefsでした。

```
mkdir efs
```

それでも解決できない場合
[マウントの問題のトラブルシューティング](https://docs.aws.amazon.com/ja_jp/efs/latest/ug/troubleshooting-efs-mounting.html)

#ECS・FargateでEFSマウント設定後にタスク起動できないとき

タスク設定を完了後、タスク起動が出来ずエラーが出た時

>タスクを実行できません
>One or more of the requested capabilities are not supported.


プラットフォームのバージョンを、1.4.0にすることで回避できました。
turtlesimの亀を自作画像に変えてみた^^

こちらのサイトからturtlesimをクローンする。
・https://github.com/ros/ros_tutorials

このように沢山の🐢さんがいるのだ！！！！！
![Screenshot from 2019-11-27 23-43-59.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/351913/94ee4fb0-f284-fc84-817a-bf774c515a36.png)

こちらはここに定義されている。
/home/mertcook2/catkin_ws/src/ros_tutorials/turtlesim/src

```turtle_frame.cpp
  QVector<QString> turtles;
  turtles.append("box-turtle.png");
  turtles.append("robot-turtle.png");
  turtles.append("sea-turtle.png");
  turtles.append("diamondback.png");
  turtles.append("electric.png");
  turtles.append("fuerte.png");
  turtles.append("groovy.png");
  turtles.append("hydro.svg");
  turtles.append("indigo.svg");
  turtles.append("jade.png");
  turtles.append("kinetic.png");
  turtles.append("lunar.png");
  turtles.append("melodic.png");
```
ここを好きなファイルに変更したら後はok!!!!
多分サイズとか関係してきそうだ。。。
![Screenshot from 2019-11-27 23-12-00.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/351913/c0bca33f-56b1-9d87-c2e1-1aede8e51884.png)

<blockquote class="twitter-tweet"><p lang="ja" dir="ltr">🐢変更完了！<br>やったー！<a href="https://twitter.com/hashtag/MeRT%E3%81%AE%E9%80%B2%E6%8D%97%E9%80%B2%E6%8D%97?src=hash&amp;ref_src=twsrc%5Etfw">#MeRTの進捗進捗</a> <a href="https://t.co/KTg1hXB687">pic.twitter.com/KTg1hXB687</a></p>&mdash; MeRT(ルット)@Ph.D.Navigation (@MeRTcooking) <a href="https://twitter.com/MeRTcooking/status/1199698490915356678?ref_src=twsrc%5Etfw">November 27, 2019</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
【脱・大量elif】辞書型の活用によるスマートな多分岐

Pythonにはswitch文がありません。それゆえ、多分岐を実装する場合、if文と複数のelif文を書く必要があります。「もっとうまく書けないものか…」そう考えた自分は、以下のように書くようにしました。スマート！（自画自賛）

皆さんはどのように書いていますか？コメントお待ちしております！

#### ビフォー

```python
都道府県 = "愛知県"

if 都道府県 == "新潟県":
    県庁所在地 = "新潟市"
elif 都道府県 == "富山県":
    県庁所在地 = "富山市"
elif 都道府県 == "石川県":
    県庁所在地 = "金沢市"
elif 都道府県 == "福井県":
    県庁所在地 = "福井市"
elif 都道府県 == "岐阜県":
    県庁所在地 = "岐阜市"
elif 都道府県 == "長野県":
    県庁所在地 = "長野市"
elif 都道府県 == "山梨県":
    県庁所在地 = "甲府市"
elif 都道府県 == "静岡県":
    県庁所在地 = "静岡市"
elif 都道府県 == "愛知県":
    県庁所在地 = "名古屋市"

print(都道府県 + "の県庁所在地は" + 県庁所在地 + "です。")
```

#### アフター

```python
都道府県 = "愛知県"

都道府県to県庁所在地 = {
    "新潟県":"新潟市",
    "富山県":"富山市",
    "石川県":"金沢市",
    "福井県":"福井市",
    "岐阜県":"岐阜市",
    "長野県":"長野市",
    "山梨県":"甲府市",
    "静岡県":"静岡市",
    "愛知県":"名古屋市"
}

print(都道府県 + "の県庁所在地は" + 都道府県to県庁所在地[都道府県] + "です。")
```

※Python、変数名を日本語で書けるようです。初学者へのハードルを下げるためにも日本語で書いてみました。
データセット「Moving MNIST」

# はじめに
Moving MNIST はシーケンスの予測・再構築を評価するためのテストセットです。手書き数字が画面内を動き回るように作られた画像の集まりです。

![000000.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/211712/d9503e2b-12d2-425d-28db-b5ea5d376cf9.gif "画像タイトル")
左がデータセットで、右が予測の例です。[こちらのサイト](http://www.cs.toronto.edu/~nitish/unsupervised_video/)から引用しました。

データは10,000種類あり、それぞれ20フレームあります。画像のサイズは64 x 64で、二つの数字が映っています。

## データの読み込み

[こちらのサイト](http://www.cs.toronto.edu/~nitish/unsupervised_video/)からダウンロードできます。

```bash
!curl -o mnist_test_seq.npy http://www.cs.toronto.edu/~nitish/unsupervised_video/mnist_test_seq.npy
```
データを読み込みます。

```python
import numpy as np

path="./mnist_test_seq.npy"
data = np.load(path)

print(data.shape)  # (20, 10000, 64, 64)
```

ipywidgetsを使ってちゃんと動画になっていることを確認してみます。

```python
%matplotlib inline
import matplotlib.pyplot as plt
from ipywidgets import interact

def f(k):
    plt.imshow(data[k][0], 'gray')
    plt.show()

interact(f, k=(0,19,1) )
```

![タイトルなし.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/211712/ebf20bf6-93c5-998e-8855-bd1439e41116.gif)

このようなセットが10,000セットあります。

10フレームを使用して10フレームを予測する場合のDatasetの作り方です。

```python
import numpy as np
from torch.utils.data import Dataset


class MovingMnistDataset(Dataset):
    def __init__(self, path="./mnist_test_seq.npy"):
        self.data = np.load(path)
        # (t, N, H, W) -> (N, t, C, H, W)
        self.data = self.data.transpose(1, 0, 2, 3)[:, :, None, ...]

    def __len__(self):
        return len(self.data)

    def __getitem__(self, i):
        return self.data[i, :10, ...].astype(np.int32), self.data[i, 10:, ...].astype(np.int32)

dataset = MovingMnistDataset()
```
realsense d435i メモ

realsense メモ

step1
https://github.com/IntelRealSense/realsense-ros
step2
https://github.com/IntelRealSense/librealsense/blob/master/doc/distribution_linux.md#installing-the-packages
step3
https://github.com/IntelRealSense/realsense-ros
step4
sudo apt-get update apt-get install ros-melodic-ddynamic-reconfigure

sudo apt-get install ros-melodic-ddynamic-reconfigure
step5
https://github.com/IntelRealSense/librealsense.git
step6
https://qiita.com/k65c1/items/0d9039c021ecbb26b04e
https://qiita.com/k65c1/items/7a4df58b50a587fad3e2
pullしてもpushできない→作業ブランチがmasterではなかった

## 状況
新しく作ったrepositoryにpush。

## エラー

```
git pull origin master
```

> warning: no common commits
remote: Enumerating objects: 3, done.
remote: Counting objects: 100% (3/3), done.
remote: Compressing objects: 100% (2/2), done.
remote: Total 3 (delta 0), reused 0 (delta 0), pack-reused 0
Unpacking objects: 100% (3/3), done.
From https://github.com/okadamasayuki/terraform_sample_verified
 * branch            master     -> FETCH_HEAD
 * [new branch]      master     -> origin/master
fatal: refusing to merge unrelated histories


```
git push origin master
```

> To https://github.com/okadamasayuki/terraform_sample_verified
 ! [rejected]        master -> master (non-fast-forward)
error: failed to push some refs to 'https://github.com/okadamasayuki/terraform_sample_verified'
hint: Updates were rejected because a pushed branch tip is behind its remote
hint: counterpart. Check out this branch and integrate the remote changes
hint: (e.g. 'git pull ...') before pushing again.
hint: See the 'Note about fast-forwards' in 'git push --help' for details.

## エラーの原因
masterではない他のbranchを変更していたのを忘れて、git pull origin **master**、git push origin **master** を実行していました。
CircleCIについて~自分用~

#CircleCIについて
CircleCIについて自分なりにまとめる。
CircleCIとはSaas型のCI/CDサービスである。
CircleCIはクラウド上のコンテナあるいはVMを実行環境として使用する。
コンテナかVMかはユーザーが選択可能ですが、コンテナの方が起動が速く、VMは今後有料になる可能性がある。
CircleCIではコンテナの利用を推奨している。1コンテナであれば無料で使用できる。

一般的にCI/CDでやることはビルドとテストとデプロイの3点である
ビルド
ソースコードから実行可能なアプリケーションを構築します。
具体的には、Dockerイメージのpull、依存パッケージのインストール、コンパイルなど。

テスト
UTなどのテストコードを実行して動作確認をしたり、Rubocop(Ruby)などのコードスタイルチェックなどを行います。

デプロイ
ビルドしてテストが通ったものを本番環境や検証環境などにリリースします。
CircleCIを利用するにあたってGitHubあるいはBitbucketのアカウントが必要となる。

##CIとCDがそれぞれ走る契機。

CI
pull-request作成した時
pull-request作成以降にpushした時
定期実行時(cron)
CD
mergeした時
ブランチによってデプロイ先を変えられる
masterブランチへmergeされたら本番環境、developブランチへmergeされたら検証環境など
定期実行時(cron)

CI/CDの設定は全て .circleci/config.yml に記載する。
.circleci ディレクトリは対象Gitリポジトリのトップに置く。

##必須キー
必ず設定必要なキー。

###version: CircleCIのバージョンを指定する。現状、1か2か2.1を指定可能だが、これからCircleCI始める場合は2か2.1にする。

###jobs: 1つ以上のjobを設定する。jobが1つだけの場合、job名は build でなければならない。各jobではCI環境設定などを行う。

###steps: CI環境上で動作させるコマンドや実行結果の保存、キャッシュ操作などを設定する。

```sample
version: 2.1
jobs:
  build:
    steps:
      (省略)
```
PlantUMLのWindowsへのインストール方法（2020年8月版）

#この一週間、インストール作業に時間を奪われた

以前までPlantUMLを使っていましたが、最近環境が変わったので再構築をしようとしていました。
VSCodeのプラグインを使って逐一確認しながらUMLを書くのにすごく便利なツールです。

しかし、PlantUMLに必要なソフトウェアであるGraphvizのダウンロード場所が分かりづらい上に、それをexeでインストールしただけでは正常に動作してくれないというとんでもなくストレスフルな感じでした。

<blockquote class="twitter-tweet" data-partner="tweetdeck"><p lang="ja" dir="ltr">一週間悩んでたのでほんとお前ほんとお前だぞお前</p>&mdash; 伝心 (@TempProg) <a href="https://twitter.com/TempProg/status/1300410055469137920?ref_src=twsrc%5Etfw">August 31, 2020</a></blockquote>


こちらで解決方法を共有します。

#Javaのダウンロードとインストール
してない場合は[こちら](https://java.com/ja/download/)からしてください。詳細は省略します。

#GrahpVizのダウンロード
GraphVizは[こちら](http://www.graphviz.org/download/)からダウンロードできます。

・・・とは言っても、最近ウェブサイトのリニューアルがあったのか、リンク項目が以前より多くなっている気がします。次の画像の中の「Stable Windows install packages」が正解のリンクです。

![2020-08-31_21h39_21.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/33657/312d3891-5861-6ac8-d8f7-bb58f8f693c6.png)

こちらに進んだら、10 > cmake > Release > x64 と進み、exeファイルを入手します。そちらがインストール用ファイルです。なお、32bit版のコンピュータを利用している場合は x64 の部分を Win32 に読み換えてください。

#GraphVizのインストール
GraphVizのインストールは先程のexeファイルを実行した**後**に、コマンドプロンプトを**管理者権限**で起動して次のコマンドを実行します。

```
dot -c
```

この操作が実行できない場合はパスが通っていない可能性が高いので、GraphVizをインストールしたフォルダに移動してから実行してください。デフォルトでは　C:\Program Files\Graphviz 2.44.1\bin　のようなフォルダに入っているはずです。
この操作を実行しないと、PlantUMLを起動してもGraphVizがクラッシュします。

<blockquote class="twitter-tweet" data-partner="tweetdeck"><p lang="en" dir="ltr">Last version of PlantUML is now working with <a href="https://twitter.com/hashtag/GraphViz?src=hash&amp;ref_src=twsrc%5Etfw">#GraphViz</a> 2.44. Note that you may have to run &#39;dot -c&#39; after GraphViz install <a href="https://t.co/QrOF8c3fwm">https://t.co/QrOF8c3fwm</a></p>&mdash; PlantUML (@PlantUML) <a href="https://twitter.com/PlantUML/status/1299766917260075009?ref_src=twsrc%5Etfw">August 29, 2020</a></blockquote>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>


#PlantUMLのインストール
PlantUMLはVSCodeの拡張機能からインストールしてください。
[こちら](https://marketplace.visualstudio.com/items?itemName=jebbs.plantuml)からインストール可能です。

インストール後は、Alt-Dキーで実行するとクラス図等々が出力されるはずです。

![2020-08-31_21h26_32.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/33657/9baffb3c-5c7a-9dec-6bbf-e5e6f74476a7.png)
【provider "aws" { 】エラーの処理

#### 実行コマンド
```
terraform plan
```

#### エラー
> Error: error configuring Terraform AWS Provider: error validating provider credentials: error calling sts:GetCallerIdentity: InvalidClientTokenId: The security token included in the request is invalid.
	status code: 403, request id: 600b5195-091b-4423-9364-342b681aa47d
  on main.tf line 2, in provider "aws":
   2: provider "aws" {

#### エラーの説明
> status code: 403

403と表示されていることから、認証周りでのエラー。AWSのcredential情報(AWS_ACCESS_KEY_ID, AWS_SECRET_ACCESS_KEY)が正しく設定されていない。
Amazon S3に保存したファイルをsagemakerに転送する方法

## 経緯

機械学習の学習済みモデルなど大きいバイナリファイルをAmazon SageMaker上で使用しようとしたが、直接アップロードしようとすると大きすぎるためか途中でセッションが途切れてしまいアップロードすることが出来なかった。大きいファイルはS3を使わないといけないのかと思い、S3に取り込んだところまでは良かったが結局Sagemakerに転送しなければ意味がないのだが、ちょっと手こずったので備忘録。


##コード
このコードで 'S3のバケット名' の下にあるバイナリファイルをSageMakerのカレントディレクトリの下のmodelの下に転送。

```python:S3toSagemaker
import os
import boto3
import io
import sagemaker

s3_client = boto3.client('s3')
data_bucket_name='S3のバケット名'
file = 'S3のバケットの下にあるファイル名'
response = s3_client.get_object(Bucket=data_bucket_name, Key=file)
response_body = response["Body"].read()
type(response_body)
with open('./model/'+file, mode='wb') as f:  
    f.write(response_body) 
```

##そもそも
SageMakerはデフォルトの容量が5Gなので、最初にインスタンスを立ち上げる時に50Gなり大き目に領域を設定しておく必要がある（後からインスタンスの容量設定を変えられない模様）。
LoadError: cannot load such file -- rspec_junit_formatter

## エラー全体（CircleCIで表示）

> !/bin/bash -eo pipefail
mkdir /tmp/test-results
TEST_FILES="$(circleci tests glob "spec/**/*_spec.rb" | \
  circleci tests split --split-by=timings)"
bundle exec rspec \
  --format progress \
  --format RspecJunitFormatter \
  --out /tmp/test-results/rspec.xml \
  --format progress \
  $TEST_FILES
Error reading historical timing data: file does not exist
Requested weighting by historical based timing, but they are not present. Falling back to weighting by name.
No examples found.
bundler: failed to load command: rspec (/home/circleci/portfolio_AWS/vendor/bundle/ruby/2.5.0/bin/rspec)
LoadError: cannot load such file -- rspec_junit_formatter

## 原因箇所
> cannot load such file -- rspec_junit_formatter

## 解決方法
Gemfileに次を追記。

```
group :test do
  gem 'rspec_junit_formatter'
end
```

#### 参考記事
https://qiita.com/aiandrox/items/babfa4aba0ccf923487c
disabledは簡単に外せる

[先日公開したアプリ](https://qiita.com/nizi24/items/d12e9642b9774670a6ae)に問題が見つかり、解決したので状況を共有します。

# ボタンの無効化は解除できる

下のようにゲストアカウントのプロフィールは変更できないように、ボタンにdisabledを付けていたのですが、

![スクリーンショット 2020-08-31 17.57.40.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/651979/5f2b206b-381b-2341-ba49-c6b12d1d380d.png)

デベロッパーツールを使ってdisabledを消すと、

![recording (1) (1).gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/651979/ef1b0ef7-74e5-91d7-2e7f-11a9ea6f0ad8.gif)


<strong>ボタンの無効化が解除</strong>されてメールアドレスを変更することができてしまいます！

![recording.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/651979/b1b99504-3b12-c4e0-48e9-864ec5b73e1c.gif)

# サーバー側で対策する

ゲストアカウントの場合は変更を受け付けないようにします。

```ruby:users_controller.rb
def update
user = User.find(params[:id])
  if !user.guest && user.update(user_params)
    render json: { user: user }
  end
end
```

ゲストアカウントは更新できないことをテストします。

```ruby:user_request_spec.rb
describe '#update' do
  it 'ユーザー情報を更新できること' do
    user_params = attributes_for(:user, email: 'foo@example.com')
    patch v1_user_path(user.id), params: { user: user_params }
    user.reload
    expect(user.email).to eq 'foo@example.com'
  end

  it 'ゲストアカウントは更新できないこと' do
    guest = create(:user, guest: true, email: 'guest@example.com')
    user_params = attributes_for(:user, email: 'foo@example.com')
    patch v1_user_path(guest.id), params: { user: user_params }
    guest.reload
    expect(guest.email).to eq 'guest@example.com'    
  end
end
```

無事成功！！

```common_lisp
2 examples, 0 failures, 2 passed
```

# パスワードを強力にする

サーバー側の対策によりデータベースの内容を変更することはできなくなりましたが、認証にfirebaseを使っているので、firebase側に保存されているメールアドレスとパスワードは変更されてしまう恐れがあります。


ゲストアカウントだから誰でも使えるしパスワードは「password」でいいか、と推測されやすいパスワードにしていましたが、このままではマズイので変更します。(さらにソースも公開していたのでそもそも推測する必要すらありません。)

```javascript:signup.vue
guestLogin () {
  firebase
    .auth()
    .signInWithEmailAndPassword('guest@example.com', 'password')
}
```

元々は上のようにパスワードを直書きしていましたが、環境変数を使うことにします。

```javascript:signup.vue
guestLogin () {
  firebase
   .auth()
   .signInWithEmailAndPassword('guest@example.com', process.env.GUEST_PASSWORD)
}
```

```:.env
GUEST_PASSWORD=*************
```

これでソースを見てもゲストアカウントのパスワードがわからないようになりました。

# まとめ

ボタンやフィールドを無効にしていても簡単に解除できるので、サーバー側で対策しましょう。

## さいごに

間違いなどがありましたら、ご指摘していただけると幸いです。
Nuxt.jsのサーバフレームワークをKoa.jsに変更する

## 選択できなくなっていたサーバフレームワーク
Nuxt.jsインストール時にはExpressやKoa.jsなどのサーバサイドフレームワークを選択できていたと思うんだけど、最近のバージョンだとそれができなくなっていたので、フレームワークをKoa.jsに変更する方法を記載する。Expressでも同じかと。

## デフォルトでは "connect"
https://ja.nuxtjs.org/api/configuration-servermiddleware
で次のように記載されているように、デフォルトではconnectが適用されるらしい。

```
Nuxt は内部で connect のインスタンスを作ります。
それはミドルウェアをスタックに登録したり、 外部サーバーを
必要とせず に API などのルートを増やす事を可能にしてくれます。
connect 自体はミドルウェアで、登録されたミドルウェアは
nuxt start と express-template のようなプログラム的な
使用法を持つミドルウェアとして使用されます。
```
connectのままでもいいんだろうけども、自分的にはKoa.jsの方が使い慣れてるし、今はまだKoa.jsの方が広く受け入れられてると思う。

## 手順
### 1. Nuxt.js、Koa.jsインストール

```
npx create-nuxt-app app
cd app
npm i koa
```
### 2. server/index.js 作成
アプリフォルダ直下にserverフォルダを作成し、その配下にindex.jsを作成する。
<img width="300" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/82651/bde03a71-dab3-f358-f81f-258e1b997cc9.png">

index.jsはKoa.jsのページにある"Hello World"のサンプルにexport defaultを追加。
あとは煮るなり焼くなり。

``` index.js
const Koa = require('koa')
const app = new Koa()

app.use((ctx) => {
  ctx.body = 'Hello World'
})

export default {
  path: '/api',
  handler: app.callback()
}
```

### 3. nuxt.config.js 編集
serverMiddleware: ['~~/server/'] を追加する。

``` nuxt.config.js
import colors from 'vuetify/es5/util/colors'

export default {

  serverMiddleware: ['~~/server/'],

```

以上で完了。/apiにアクセスするとKoa.jsが動く。
![screen02.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/82651/d97e6025-5f38-4001-bace-e3b485b176c2.png)
Gnu-COBOL-変数で文字列を扱う

### 変数定義

- **`DATA DIVISION`** 内に変数を定義する

```
IDENTIFICATION DIVISION.
PROGRAM-ID. HELLO.

DATA DIVISION.
  WORKING-STORAGE SECTION. *> SECSIONを作成 -> SECTIONを作成しその中に定義していく
    01 DATA1 PIC X(20).    *> 「01」         -> 変数のレベル番号
                           *> 「MY-DATA」    -> 変数名
                           *> PICは「PICTRURE」の略で領域を描くという意味
                           *> 「X」          -> 文字列の場合はX
                           *> 「(n)」        -> (20)は桁数。「X」を20個書いてもよい
                           *> 「.」を忘れずに。
                           *> 予約後は使わないように

PROCEDURE DIVISION.
  MAIN SECTION.
    DISPLAY DATA1.
    STOP RUN.

```

---

### 変数に代入

- **`PROCUDURE DIVISION`**内で変数に値を代入する

```
IDENTIFICATION DIVISION.
PROGRAM-ID. HELLO.

DATA DIVISION.
  WORKING-STORAGE SECTION.
    01 DATA1 PIC X(20).
    01 DATA2 PIC X(20) VALUE 'INITIAL VALUE'. *> 「VALUE」 -> 初期値を設定

PROCEDURE DIVISION.
  MAIN SECTION.
    MOVE 'HELLO WORLD !' TO DATA1.  *> 「MOVE TO」 -> 代入命令
    DISPLAY DATA1.                  *> 文字列はシングルクォートでもダブルクォートでもどちらで括っても良い
    DISPLAY DATA2.
    STOP RUN.

```

---

### コンパイル/実行

**コンパイル**

```
$ cobc -x --free hello.cob
```

**実行**

```
$ ./hello
HELLO WORLD !
INITIAL VALUE
```
In Gemfile: mysql2 エラーへの対応。

## エラー全体
> /private/var/folders/xt/149l2dks7ns2rz9j6ytm7m8c0000gn/T/bundler20200804-35301-1kchfhimysql2-0.5.3/gems/mysql2-0.5.3/ext/mysql2
make "DESTDIR="
compiling client.c
compiling infile.c
compiling mysql2_ext.c
compiling result.c
compiling statement.c
linking shared-object mysql2/mysql2.bundle
ld: warning: directory not found for option
'-L/Applications/Xcode.app/Contents/Developer/Platforms/MacOSX.platform/Developer/SDKs/MacOSX10.15.Internal.sdk/usr/local/lib'
ld: library not found for -lssl
clang: error: linker command failed with exit code 1 (use -v to see invocation)
make: *** [mysql2.bundle] Error 1
make failed, exit code 2
Gem files will remain installed in
/var/folders/xt/149l2dks7ns2rz9j6ytm7m8c0000gn/T/bundler20200804-35301-1kchfhimysql2-0.5.3/gems/mysql2-0.5.3
for inspection.
Results logged to
/var/folders/xt/149l2dks7ns2rz9j6ytm7m8c0000gn/T/bundler20200804-35301-1kchfhimysql2-0.5.3/extensions/universal-darwin-19/2.6.0/mysql2-0.5.3/gem_make.out
An error occurred while installing mysql2 (0.5.3), and Bundler cannot
continue.
Make sure that `gem install mysql2 -v '0.5.3' --source 'https://rubygems.org/'`
succeeds before bundling.
In Gemfile:
  mysql2

## エラーの箇所

> An error occurred while installing mysql2 (0.5.3), and Bundler cannot
continue.

## 解決方法
Gemfileの記載内容を変更

変更前

```
gem 'mysql2'
```

変更後

```
gem 'mysql2', '~>0.5.3'
```

#### 参考記事
https://qiita.com/shota0701nemoto/items/0ec0a4d11c1ff8330f3d