OmniAICreator/Qiita-1.07M huggingface dataset:
応用カリキュラム Git/GitHub 01

開発環境の管理ツール。

##Git

gitはファイル群を時系列で管理してくれる。
履歴として持ってくれているので、必要に応じて遡れる。
基本的にはターミナルで操作を行う。

##GitHub

Gitの仕組みを用いて、複数人での開発をオンラインでサポートしてくれるサービス。
管理しているプロジェクトを複数人で取り扱うことができるようになる。
Gitのターミナル操作に慣れていなくともGUIで扱うようにできるアプリケーションGitHub Desktopがある。GitHubが提供している。
世界中のあらゆるソースコードが保存、公開されている。

##リポジトリ

Gitの管理下にあるファイルやディレクトリの変更履歴を保管しておく入れ物

- ローカルリポジトリ ローカルに置くリポジトリ
- リモートリポジトリ 外部サーバーなどのネットワーク上に置くリポジトリ

##インデックス

同じバージョンとして記録したいデータを抜き出して登録する場所のこと
ローカルリポジトリの内、どのファイルを登録したいのか取捨選択する操作が必要。

.gitignoreファイルに、除外したいファイルを記述する。

##コミット

インデックスに追加された変更修正をバージョンとして記録する操作
どのような変更を行ったのかを記入するメモ`コミットメッセージ` を入れることができる。
コミットはなるべく細かく行うべき。ファイルの復元はコミット単位毎になる為、1機能1コミット。

###インデックス、コミットについて

インデックス、コミットを一つの変更として、ループさせることで開発を効率化させる。
インデックスが無い場合は、何時間毎だとか、何日毎とかでコミットする、と考えると
いつコミットしたのか、という管理しかできなくて`何の変更を実装しようとしてるのか`っていう単位で管理するインデックス、コミットの方法と比較して無駄が多い、ということかな？？

##プッシュ

ローカルリポジトリの現状を、リモートリポジトリに反映させる操作

##ブランチ

リポジトリで管理しているプロジェクトの流れを記録していく場。リポジトリは必ずブランチを持っている。リポジトリのバージョン管理はブランチ上で行われている為。

ブランチ同士は独立しているために、それぞれのブランチは干渉しない。
開発者ごとに担当する機能を明確に分けることが出来る。
完成途中や問題のあるソースコードをリリースしないで済む。

ブランチ(branch)は「枝」という意味。1つの主流から枝のように別れて管理するイメージ。
1つの主流のことを、`masterブランチ`。そこから派生する枝を、 `トピックブランチ`と呼ぶ。
トピックブランチは、masterブランチをコピーして作成する。実際の開発では、実装機能毎にトピックブランチを作成して、完成する毎にmasterブランチに統合していくことになる。

##プルリクエスト

トピックブランチをmasterブランチにマージをするときの確認作業依頼
ブランチでのコミット履歴を残すことができる、作業についてコミュニケーションがとれる掲示板のようなもの。

`プルリクエストのタイトルには[WIP]をつける`
WIPとは、Work In Progressの略で作業中を意味する。なので、作業が終わっている場合には`WIPを外す`

`プルリクエストの詳細には、WhatとWhyを書く`
どのような実装なのか、なぜ実装が必要なのか、を書いて他の人に伝えることが目的。
プロジェクト毎にルールがまちまちなようなので一例として、基本的にやらないといけないこと、として覚えておくこと。
`プルリクエストの詳細はマークダウン表記で書く`
このQiitaで覚えよう・・・・。

##LGTM

プルリクエストに対して、レビューする人間が「これ以上修正箇所は無いと判断した」というメッセージとして使われる略語。Look goot to meの略

##マージ

トピックブランチをmasterブランチに統合する操作。トピックブランチをマージできれば、そのトピックブランチは不要になるので削除する。

##プル

マージできれば、リモートブランチは最新の状態になったことになる。
ローカルリポジトリにマージした情報を反映させる操作をプルという。

##git clone

URLを指定することで、アプリケーションをローカルリポジトリとしてダウンロードできる。
カリキュラム中に繰り返し使ってきたコマンド。

.gitディレクトリが含まれているので、clone元にpushすることができるが、
他人のリモートリポジトリのCollaboratorsに追加されていなければ、push不可能。

##GitHub flow(コピペ)

- masterブランチのものは何であれデプロイ可能である

- 新しい何かに取り組む際は、説明的な名前のブランチをmasterから作成する（例:  new-oauth2-scopes）

- 作成したブランチにローカルでコミットし、サーバー上の同じ名前のブランチにも定期的に作業内容をpushする

- フィードバックや助言が欲しい時、ブランチをマージしてもよいと思ったときは、  プルリクエスト  を作成する

- 他の誰かがレビューをして機能にOKを出してくれたら、あなたはコードをmasterへマージすることができる

- レビューを経てマージをしたら、直ちにデプロイをする

助言が欲しい時もプルリクエストなんだな。

##デプロイ

アプリケーションをサーバー上で利用可能な状態にすること。外部のサーバーに公開すること。
デプロイ時はGitHubを介しておこなうようにするべき。サーバー側にpullデプロイする。


以上で開発ルーチンは終わりだけども、トラブルシューティングに関するキーワードもある。

##コンフリクト

あるファイルがブランチ毎に情報が異なり辻褄が合わない状況のこと。
２人以上が同じファイルを修正していた時に、先に修正が終わった人がマージした後に、さらにマージしようとした時にコンフリクトとして警告が出てくる。

コンフリクト解決をコミットすれば、コンフリクトの警告が消える。


その他、ブランチを作成し忘れて作業してしまい、masterブランチの修正作業になってしまった、などのトラブルも多々あるようだけども、GitHub Desktopではそれらを修正する機能も大体ついてるっぽい。

##誤った情報をプッシュしてしまった

gitにおいては、`プッシュした情報をローカルリポジトリに戻すことはできない` プッシュする前に作業をしているブランチは正しいのかどうか、必ず確認するようにしましょう、とのこと。
それでも間違った場合は、`git revert`を使いましょう、とのこと。

git revertについては、また使うことになったら復習しよう。。。


チャットスペースの概要だけ見たけどもしんどそう・・・
vue.js autocomplete

element ui を使っている場合は、
element ui についてる auto complete を使うのがベストか。
コピペで動く。


追記
いやーこれなら、
elmentui の ¶Basic multiple select のが便利かもしれんな。。。

```

<template>
    <div>

        <el-row>

            <el-col class="flex-center">
                <h2> Vue.js Autocomplete </h2>
                <div>
                    <el-autocomplete
                            v-model="state"
                            :fetch-suggestions="querySearch"
                            @select="handleSelect"
                            placeholder="Please input"
                            :trigger-on-focus="false">
                    </el-autocomplete>
                </div>


            </el-col>
            

        </el-row>


        <!--:keyってのが無いとバグる-->
        <div v-for="(v,key) in selectedTags" :key="key">
            選択されたID は {{v}}
        </div>

    </div>
</template>

<script>
    export default {

        data() {
            return {
                links: [],
                state: '',
                selectedTags: []
            };
        },
        methods: {
            querySearch(query, cb) {
                var links = this.links;
                var results = query ? links.filter(this.createFilter(query)) : links;
                var top3 = results.slice(0, 3);
                console.log(JSON.stringify(top3));
                cb(top3); // number of things returned
            },
            createFilter(query) {
                return (link) => {
                    return link.value.toLowerCase().includes(query.toLowerCase());
                };
            },
            loadAll() {
                return [
                    {"id": 0, "value": "うどん", "link": "https://github.com/vuejs/vue" },
                    {"id": 1, "value": "うんこ", "link": "https://github.com/vuejs/vue" },
                    {"id": 2, "value": "らーめん", "link": "https://github.com/vuejs/vue" },
                    {"id": 3, "value": "vuex", "link": "https://github.com/vuejs/vue" },
                    {"id": 4, "value": "vue-router", "link": "https://github.com/vuejs/vue" },
                    {"id": 5, "value": "vue-resource", "link": "https://github.com/vuejs/vue" },
                    {"id": 6, "value": "element", "link": "https://github.com/ElemeFE/element" },
                    {"id": 7, "value": "あい", "link": "https://github.com/vuejs/vue" },

                ];
            },
            handleSelect(item) {
                console.log("選択されたアイテムのIDは" + item.id);
                this.state = "";
                this.selectedTags.push(item.id);

            }
        },
        mounted() {
            this.links = this.loadAll();
        }
    }
</script>

```
GoogleMapsAPI v3のマーカーにマテリアルデザインのアイコンを使う + 色や形を変更する方法

# GoogleMapsAPI v3のマーカーにアイコンを使う + 色や形を変更する方法

Google マイマップには用意されたアイコンの中から好きな形と色を選んでマーカーに設定する機能があります。

<img width="474" alt="スクリーンショット 2019-11-21 13.40.31.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/532546/ec6bc779-4c2e-5d15-cae4-917a179d885b.png">

これ、どうやって実現してるのかなと思い調べてみるとサーバーサイドでアイコン画像を生成し都度配信しているようです。

<img width="654" alt="スクリーンショット 2019-11-21 13.42.36.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/532546/9aa3a07c-18b5-2084-9f1d-43dadde962a8.png">

真似して作ろうと思ってもわざわざサーバー側で実装するのは面倒ですね。できればフロント側でいじって変えたいです。

GoogleMapsAPIのマーカーには、[Symbol](https://developers.google.com/maps/documentation/javascript/symbols?hl=en)を設定できます。`Symbol`を使えばSVGのパスをマーカーのアイコンに設定でき、色や形を自由に変えることができます。

ただし、指定できるパスはワンライナーである必要があり、一通りのアイコンを揃えるのは大変ですよね。

そこで[Material Design Icon](https://material.io/resources/icons/)をGoogleMapsAPI
で使えるように最適化したライブラリを作成しnpmで公開したので、使用方法を紹介します。

## インストール

`npm i mdi-paths`

ライセンスはオリジナルを継承して`Apache License, Version 2.0`です。

## 使用方法

使いたいアイコンを[こちら](https://material.io/resources/icons/)から探し、名前を指定してインポートしてください。
ただし、数字から始まるアイコン名はアンダーバーを先頭に付けてください。またJavaScriptの予約語になっている名前は最後にアンダーバーをつけてください。

```js
import {library_books} from 'mdi-paths'

const marker = new google.maps.Marker({
    map: map,
    position: new google.maps.LatLng(0, 0),
    icon: {
        fillColor: '#FFFFFF',
        fillOpacity: 1,
        path: library_books,
        strokeColor: '#000000',
        strokeWeight: 2,
    },
})
```
```js

// 数字から始まるアイコン名
import {_3d_rotation} from 'mdi-paths'
 
// JSの予約語であるアイコン名
import {delete_} from 'mdi-paths'
```

まとめて全てインポートすることもできます。

```js
import mdi_paths from 'mdi-paths'
// --------中略---------
         path: mdi_paths.library_books,
// --------中略---------
```

### スタイルを変更する
```js
const symbol = {
    fillColor: '#FFFFFF',
    fillOpacity: 1,
    path: library_books,
    strokeColor: '#000000',
    strokeWeight: 2,
}

const marker = new google.maps.Marker({
    map: map,
    position: new google.maps.LatLng(0, 0),
    icon: symbol,
})

// 赤色に変更
marker.setIcon({...symbol, fillColor: '#FF0000'})
```

詳しくは[GoogleMapsAPIのドキュメント](https://developers.google.com/maps/documentation/javascript/symbols)を参照してください。

## まとめ
<img width="390" alt="69007751-2d16f100-0985-11ea-9868-203312113bd1.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/532546/688aad68-89e4-b6a1-3fe3-95ab61961d92.png">

有名なマテリアルデザインのアイコンが使えるだけでなく、フロント側だけでアイコンの形や色を自由に変えられるので便利です。
サ変名詞を文節で取り出す

大学の授業で使う必要があったため「名詞,サ変接続」から始まる文節を取り出すものを書いてみました。日本語文法の知識を持っていないため勘でやっています。

追記2019/11/27
コメントありがとうございます。とても勉強になりました(>_<)
コードに反映させてみます。

#コード
```ruby
require 'MeCab'
tmp="" #文字出力に使う
count=0 #動詞出現回数
flag = 0 #サ変の前に文字が入るかどうか
lines = IO.readlines("all_hyouka.txt", chomp: true)

File.open("phrase_data_sahen.rb", "w") do |f|
  lines.each do | line |
    begin
      model = MeCab::Model.new(ARGV.join(" "))
      tagger = model.createTagger()
      n = tagger.parseToNode(line)
      while n do
        feature = n.feature.split(",")
        if tmp!="" && flag == 1
          if feature[0]=="名詞" and feature[1]=="サ変接続" and n.surface!=")" and n.surface!="," and n.surface!="～" and n.surface!="("
            tmp << n.surface
            flag = 0
          else
            tmp = ""
            flag = 0
          end
        elsif tmp!="" && count==0 
          if feature[0]=="動詞" and feature[1]=="自立"
            tmp << n.surface
            count=count+1
          else
            tmp = ""
          end
        elsif tmp!="" && count==1
          case feature[0]
          when "動詞"
            case feature[1]
            when "自立"
              f.print "\n",tmp
              tmp = ""
              count=0
            when "非自立", "接尾"
              tmp << n.surface
            end
          when "助詞","助動詞","フィラー"
            tmp << n.surface
          when "形容詞"
            case feature[1]
            when "自立"
              f.print "\n",tmp
              tmp = ""
              count=0
            when "非自立"
              tmp << n.surface
            end
          when "名詞"
            case feature[1]
            when "サ変接続"
              f.print "\n",tmp
              tmp = n.surface
              count=0
            when "接尾","特殊" #,"非自立"
              tmp << n.surface
            else
              f.print "\n",tmp
              tmp = ""
              count=0
            end
          when "感動詞","接続詞","接頭詞","副詞","記号","連体詞","BOS/EOS"
            f.print "\n",tmp
            tmp = ""
            count=0
          else
            f.print "\n",tmp
            tmp = ""
            count=0
          end
        else
          if (feature[0]=="接頭詞"and feature[1]=="接続名詞")#or(n.feature.split(",")[0]=="副詞" and n.feature.split(",")[1]=="一般")
            tmp = n.surface
            flag = 1
          elsif feature[0]=="名詞" and feature[1]=="サ変接続" and n.surface!=")" and n.surface!="," and n.surface!="～" and n.surface!="("
            tmp = n.surface
          end
        end
        n = n.next
      end
    rescue
      print "RuntimeError: ", $!, "\n";
    end
  end
end

###################以下、語の出現回数計算して大きい順に並べる処理

require "find"

words = Hash.new(0)

lines = IO.readlines("phrase_data_sahen.rb", chomp: true)
lines.each do | line | 
  words[line] += 1
end

File.open("output_sahen.rb","w") do |output|
  output.print "\357\273\277"
  words.sort_by{|word,count| [-count,word]}.each do |word,count|
    output.print word.chomp,"\n"
  end
end

```

#取り出した語の例
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/536456/6c24da31-4c0d-d99f-6e8c-1046acc35793.png)
JavaのBigDecimalでハマらないために

同僚がBigDecimalの扱いでハマったのでメモ。

# イミュータブル（Immutable）とは

~~変数の値~~オブジェクトを操作するとき、その~~変数~~オブジェクト自身の値を書き換えれることを「ミュータブル」、書き換えれないことを「イミュータブル」といいます。Javaの場合、~~intやdouble~~Calendarはミュータブル、Stringはイミュータブルになります。

# BigDecimalはどっち？

BigDecimalのAPIドキュメント
https://docs.oracle.com/javase/jp/8/docs/api/java/math/BigDecimal.html

足し算をする add メソッドについて見てみましょう。

```java
/**
値が(this+augend)でスケールがmax(this.scale(), augend.scale())であるBigDecimalを返します。
パラメータ: augend - このBigDecimalに加算する値。
戻り値: this + augend
*/
public BigDecimal add(BigDecimal augend)
```

さて、次のコードの出力結果はいくつになるでしょう？

```java
public static void main(String args[]) {
    BigDecimal a = new BigDecimal("1");
    BigDecimal b = new BigDecimal("2");
    a.add(b);
    System.out.println(a);
}
```

出力結果。

```
1
```

あれ？3じゃないの？と思ったあなた。APIドキュメントの大事な一文を見落としていますよ。

> **変更が不可能な**、任意精度の符号付き10進数です。

つまり、このコードは、a+b の値を持つBigDecimalのオブジェクトを**新たに作って**、そのオブジェクトを返すという意味だったのです。a自身の値は一切変更されないのです。

```java
a.add(b);
```

DBから数値をBigDecimalで取り出してお金の計算をするコードだったのだけれど、addなどのメソッドの結果を変数に代入せず処理を進めて、物の見事にバグっていました。

コードの字面だけではイミュータブルなことを見抜けない……なんとも厄介なバグなのでした。
IBM Cloud Functionsで、Actionを日本時間指定で月次実行する

# Periodicトリガーについて
Periodicトリガーを作成したときに、曜日や時間・分の指定はブラウザ上から簡単に行えますが、月次で実行したい場合は、cron式を使う必要があり、ブラウザからcron式で指定出来るのは、UTCのみなので、日本時間でファンクションを実行するには、CLIを使います。
![Periodic.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/526658/b9fdd32a-5a6f-3343-0e5a-7a93358f39f5.png)

# CLIプラグインのインストール
```bash
$ ibmcloud plugin install cloud-functions
```
プラグインのインストールに失敗する場合は、古いバージョンのプラグインを試してみて下さい。
以下からダウンロード出来ます。
https://plugins.ng.bluemix.net/ui/repository.html

次でインストールできます。

```bash
$ ibmcloud pulgin install (ダウンロードしたパス) 
```
リージョン、リソースグループ、名前空間は自身の環境に合わせてに設定して下さい。

```bash
$ ibmcloud target -r (リージョン) -g (リソースグループ)
$ ibmcloud fn property set --namespace (名前空間)
```
リージョンの指定は、こちらを参照。
https://cloud.ibm.com/docs/containers?topic=containers-regions-and-zones

|リージョン|指定|
|:-:|:-:|
|東京|jp-tok|
|シドニー|au-syd|
|ダラス|us-south|
|ワシントン|us-east|

# 日本時間のトリガーの作成
日本時間でcron式を使ってトリガーを作成するには、CLIから次のようにします。

```bash
$ ibmcloud fn trigger create (トリガー名) \
--feed /whisk.system/alarms/alarm \
--param cron "(cron式)" --param timezone "Japan" \
```
ここの`Japan`は`Asia/Tokyo`で指定しても構いません。

# cron式サンプル
### 毎月月初3:00AMに実行

```
0 3 1 * *
```

### 1年だけ、毎月10日9:00AMに実行
```
0 9 10 * * 2020
```

### 5年間、毎月10日9:00AMに実行
```
0 9 10 * * 2020-2024
```

# 月末の指定の仕方

月末を指定する`L`は、上記のコマンドでは使えません。
例えば毎月月末11:00PMに実行する、次のようなcron式を指定すると、

```
0 23 L * *
```
このようなレスポンスが返ります。

```json
"response": {
    "result": {
        "error": {
            "error": "cron pattern '0 23 L * *' is not valid"
        }
    },
    "size": 60,
    "status": "application error",
    "success": false
}
```

UTC限定になり、9時間の時差が発生しますが、ブラウザのcron式指定からは利用可能なようなです。(画像では、JSTに補正されています。)
![cron-L.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/526658/6c03c572-b241-c58d-7a2c-45354b469ca8.png)

他にも、日本よりも5時間進んでいるキリスィマスィ島をタイムゾーンに指定する方法もあります。
`0 23 L * *(Japan)`でトリガーを作成する場合、次のように作成することができます。

```bash
$ ibmcloud fn trigger create (トリガー名) \
--feed /whisk.system/alarms/alarm \
--param cron "0 4 1 * *" --param timezone "Pacific/Kiritimati" \
```
Djangoを始める。


たまにしかやらないから、いつも忘れてしまう。

# プロジェクトの作成

```
$ django-admin startproject test
```

上記コマンドを実行すると「test」というプロジェクトが作られ、その直下にmanage.pyと「test」というアプリケーションディレクトリが作成される。

```
/test
/test/manage.py
/test/test/settings.pyほか
```

testディレクトリの直下に同名のtestディレクトリがあるのはややこしいし、美しくない。


```
$ mkdir test
$ cd test
$ django-admin startproject config .
```

のようにすると

```
test
test/manage.py
test/config/settings.pyほか
```

のようなディレクトリ構造になる。


# venvの準備

```
$ python3 -m venv venv
```

プロジェクトの直下で行う。

```
test
test/manage.py
test/config/settings.pyほか
test/venv/
```

## venvの起動
```
$ source venv/bin/activate
```

```
(venv) $
```
起動中は頭に`(venv)`が表示される。


## venvの停止
```
（venv） $ deactivate
```

`$ venv deactivate `のように`venv`をつける必要はない。

## 仮想環境にDjangoをインストール
```
(venv) $ pip install django
```

# pipのアップグレード
> You are using pip version 10.0.1, however version 19.3.1 is available.
> You should consider upgrading via the 'pip install --upgrade pip' command.

Djangoのインストールすると、ほぼ確実に「pip古いよ」と言われるので、ついでにアップグレード。

```
(venv) $ pip install --upgrade pip
```

# Djangoを動かしてみる

```
(venv) $ python manage.py runserver
```

プロジェクトディレクトリ直下、すなわちmanage.pyがある階層に移動して上記コマンドを実行。

>Django version 2.2.7, using settings 'config.settings'
>Starting development server at http://127.0.0.1:8000/
>Quit the server with CONTROL-C.

あとはWebブラウザで「 http://127.0.0.1:8000/ 」にアクセス。

「 http://127.0.0.1:8000/admin/ 」はプロジェクトの管理画面。

>You have 17 unapplied migration(s). Your project may not work properly until you apply the migrations for app(s): admin, auth, contenttypes, sessions.
Run 'python manage.py migrate' to apply them.

```
(venv) $ python manage.py migrate
```

「マイグレートしないとDjangoの管理画面使えないよ」というので、上記コマンドを実行。

```
(venv) $ python manage.py createsuperuser
```

管理画面用のDB設定はされたが、ユーザーが不在なので上記コマンドでユーザーを追加する。
Bigquery のarray_aggを使うと rowの上限に引っかかることがある

# なにこれ
Bigqueryのarray_aggには気をつけよという自戒

## 詳細
とある処理でarray_aggを使用していたのだが、rowの100MBの上限に引っかかってしまった。
別に対してカラム数が多いわけではなかった。
array_aggを外したら問題なかった。array_aggが悪さをしているようだ。

### やったこと
こんなテーブルがあった時に、IDごとに最新の日付のnameを取りたい。


| id | name | date     |
|----|------|----------|
| 1  | a    | 2019-1-1 |
| 1  | b    | 2019-1-2 |
| 1  | c    | 2019-1-3 |
| 2  | d    | 2019-1-2 |
| 2  | e    | 2019-1-4 |
| 2  |      | 2019-1-5 |

こんな処理を書いた

```sql
with t as (
select * from unnest([
struct(1 as id, "a" as name, date("2019-1-1") as date),
(1,"b", "2019-1-2"),
(1,"c", "2019-1-3"),
(2,"d", "2019-1-2"),
(2,"e", "2019-1-4"),
(2,null, "2019-1-5")
])
)

select 
 id,
  array_agg(name IGNORE NULLS　ORDER BY date desc )[offset(0)]
from t
group by 1
```

結果

| id | name | 
|----|------|
| 1  | c    |
| 2  | e    |

### 何が問題か
array_aggを使ってoffset等で指定をすれば値は1つしかとれないが、
BQの状態としては、 `配列をrowに展開した後、位置を指定している`　(と思う。)
要素が多ければ多いほど1rowのサイズが増える。結果、rowの上限に引っかかった。

### 代替案
カッコつけずにwindow関数使おうね
というは易しだが他の値を集計しつつ、出したい時もあると思う
【Android/Kotlin】UIまとめ 

## 目次  
1. パスワード非表示  
2. addTextChangedListenerの書き換え
3. enum書き換え

## 1. パスワード非表示  
![undefined]()

- java

```MainActivity.java
editText.setInputType(InputType.TYPE_CLASS_TEXT | InputType.TYPE_TEXT_VARIATION_PASSWORD);  
```
 - kotlin
 
```activity_main.xml
<EditText
        android:id="@+id/edit_text"
        android:layout_width="200dp"
        android:layout_height="60dp"
        android:inputType="textPassword"></EditText>
```
## 2. addTextChangedListenerの書き換え  
 - java
 

```MainActivity.java
  editText.addTextChangedListener(new TextWatcher() { 
       @Override 
       public void beforeTextChanged(CharSequence s, int start, int count, int after) { 
      }
       @Override 
       public void onTextChanged(CharSequence s, int start, int before, int count) { 
         calculatePasswordStrength(s.toString()); 
       } 
       @Override 
       public void afterTextChanged(Editable s) { 
     } 
     }); 
   } 
```
 - kotlin 
 
```MainActivity.kt
 edit_text.addTextChangedListener(object : TextWatcher{
            override fun afterTextChanged(p0: Editable?) {
            }

            override fun beforeTextChanged(p0: CharSequence?, p1: Int, p2: Int, p3: Int) {
            }

            override fun onTextChanged(p0: CharSequence?, p1: Int, p2: Int, p3: Int) {
            }
})
```
## enum書き換え  
- java

```MainActivity.java
 WEAK(R.string.weak, R.color.weak), 
 MEDIUM(R.string.medium, R.string.medium), 
 STRONG(R.string.strong, R.string.strong),    
 VERY_STRONG(R.string.very_strong, R.string.very_strong); 
```
 - kotlin
 -  companion objectは列挙のあとに書かないとエラーになる。
 
```MainActivity.kt
WEAK {
        override fun stringId(): Int = R.string.weak
        override fun colorId(): Int = R.color.weak
    },
    MEDIUM {
        override fun stringId(): Int = R.string.medium
        override fun colorId(): Int = R.color.medium
    },
    STRONG {
        override fun stringId(): Int = R.string.strong
        override fun colorId(): Int = R.color.strong
    },
    VERY_STRONG {
        override fun stringId(): Int = R.string.very_strong
        override fun colorId(): Int = R.color.very_strong
    };

    abstract fun stringId(): Int
    abstract fun colorId(): Int
```
[Elm] HttpリクエストからのDecodeしてみる

#概要
elmでhttpリクエストして帰ってくるJsonをDecodeしようと思います。
使うapiはgithubAPIです。
`https://api.github.com/users/`この後にユーザー名を入れることで以下のJsonが帰ってきます。

https://api.github.com/users/kuropp の場合
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/286470/6c9c3661-a53e-b9ef-0b84-505a1a33a803.png)

それではやっていきましょう。
必要なモジュールをインストールしてください。

```terminal
elm install elm/http
elm install elm/json
```

#Decode

```elm
import Json.Decode as D exposing (Decoder)

type Msg
    = Click
    | Receive (Result Http.Error User)

update msg model =
    case msg of 
        Click ->
            ( -- modelの書き換え処理
            , Http.get
                  { url = "https://api.github.com/users/" ++ model.input)
                  , expect = Http.expectJson Receive userDecoder
                  }
            )

        -- Receive (OK user)の処理
        -- Receive (Err e)の処理

type alias User = 
    { login : Stirng
    , avatarUrl : String
    , htmlUrl : String
    }

userDecoder : Decorder User
userDecoder = 
    D.map3 User
        (D.field "login" D.string)
        (D.field "avatar_url" D.string)
        (D.field "html_url" D.string)
```
`field`関数により帰ってくるJsonから第一引数の値を見つけ、`string`により`Decode`しています。

#まとめ
elmのdecodeを学んだので復習として記しました。
全体的なコードは[github](https://github.com/kuropp/elm-decode/blob/master/src/Main.elm)にあげています。
参考になれば幸いです。
オンライン学習サイト使ってみた .install paiza progate

プログラミングやエンジニアという仕事に興味がある人に、
何から始めたらいいのか聞かれます。

スクール行った方がいいのかなとか本買ったけどよくわからんという声も聞きます。
まずはオンライン学習サイトでプログラミングってどんなもんというイメージを掴んでほしいと思います。
各サイトに無料講座も結構あるのでそこからチャレンジしてみることを薦めます。

というわけで、私が使ってみたことがある学習サイト。

# [paiza](https://paiza.jp/)

https://paiza.jp/

個人的にもっともおすすめはここです。
基本的には動画のテキストになっていて動画をある程度見た後に実際にプログラミングやってみるという流れで学習します。
プログラミング環境があってエラーも本物が出てくるので本当の環境に近い状態で学習できるのが素晴らしいです。またスキルチェックという課題が難易度ごとにいっぱいあってプロでもなかなか時間がかかるぐらいの内容です。まるで設計書をもとにプログラミングをするというシチュエーションなので実践的。

個人の趣向としては、声優さんっぽいアニメ声の人が動画の声を担当してくれていたり、「コードガールこれくしょん」などのゲーム感覚でプログラミングするサービスもお気に入りです。「コードガールこれくしょん」は小学3年の娘も楽しくやっていました。

## おすすめのポイント

* ブラウザでプログラミングができる環境がある
* プログラミング環境で出るエラーが本物
* テキストが動画
* **スキルチェック**という課題がかなり実践的！

## こんな人におすすめ

* テキストが動画がいい人
* まとまった時間に「スキルチェック」にチャレンジできる人
* 本気でプログラミングに取り組みたい人

# [progate](https://prog-8.com/)

https://prog-8.com/

テキストがpower pointのようなスライド形式になっていて自分のペースでゆっくり進められるのが特徴的でしたい。テキストは初心者向けにとても丁寧に作られていると思います。ある程度テキストを読み進めたら実際にプログラミングをする環境があります。ただし、初心者向けに作られていてエラーも実際のログではなく初心者向けに要約されたメッセージになっていたりします。その丁寧さが逆にエラーの原因を調査しづらくしている点もあると感じました。スマホなど向けのアプリがあるのも特徴ですが、さすがにプログラミングするのはきつい。。

## おすすめのポイント

* 初心者向けにわかりやすく説明が丁寧なテキスト
* ブラウザでプログラミングができる環境がある

## こんな人におすすめ

* プログラミングまったくわからん
* 動画型の学習サイトの進み方が早すぎると感じる人

# [.install](https://dotinstall.com/)

https://dotinstall.com/

ここは玄人向けかなと思っています。ひとつの技術をある程度マスターした人が別の技術に取り組むときや概要を知りたいときに使えると思います。動画のみの学習サイトなので自分で途中で止めながら実践することになります。他にはない言語や技術の動画が多いが特徴です。

個人的な趣向としては有料会員になると動画の声を女性の声にできること。

## おすすめのポイント

* 学習できる言語や技術の種類が多い

## こんな人におすすめ

* 一つ以上基本をマスターしたプログラムがある人
* 技術の概要を素早く知りたい人
* 言語などの公式サイトが分かりにくくて拒否感が起きた人

---

(今も私が使っているサイトは、paizaと.installです。)
Flybase上の遺伝子情報ページに素早くアクセスするAlfred workflow/Albert extension

# 要約

Macアプリ[Alfred]，もしくはLinuxアプリ[Albert]内にショウジョウバエの遺伝子名を入力することで，Flybase上の当該遺伝子情報ページを開く拡張機能を作った．

https://github.com/ishibaki/flybase_search

![output.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214914/054168c8-2dc6-9b6a-f500-30e37e42424f.gif)

# イントロダクション

キイロショウジョウバエは，分子生物学，細胞生物学，発生学など，生物学全体に大きく貢献してきた生物である．
これまでの研究から，ショウジョウバエに関する知見が数多く蓄積され，ショウジョウバエデータベースである[Flybase](http://flybase.org)上にて公開されている．
Flybaseは，その設立当初から，ショウジョウバエデータベースとして最も重要な役割を果たしており，ショウジョウバエ研究者のみならず，他の生物を対象とする研究者にとっても，Flybaseは貴重で必須の情報源となっている．

Flybaseは，ショウジョウバエの全ゲノム配列をはじめとした有用な情報を公開しているが，**研究者が特にアクセスするのは，FBgnページだろう．**
FBgnページは，ショウジョウバエの遺伝子ごとに存在し，遺伝子機能，配列情報，突然変異体・遺伝子組換え体などのバイオリソース情報，当該遺伝子についての論文情報などがまとめられている．
(e.g. [*Myo31DF* FBgn page](http://flybase.org/reports/FBgn0086347))
FBgnページは，Flybaseトップページなどから遺伝子名を検索してアクセスできるが，論文を読んでいるときなどは，**Flybaseにアクセスせず，直に素早く当該遺伝子のFBgnページへアクセスしたくなる．**

本稿では，MacもしくはLinuxにおける**クイックランチャーアプリから，ショウジョウバエ遺伝子名を入力することで直にFBgnページへアクセスする方法を報告する．**
Alfred(for Mac)やAlbert(fo Linux)など，いわゆるクイックランチャーアプリは，任意のキーワードをトリガーとする拡張機能をサポートしている．
筆者が作成した拡張機能について紹介し，インストール方法と使いかたを説明する．

# 結果

## インストール方法

以下のソフトウェアが必要です

- [Alfred] \(Macユーザーの場合)
- [Albert] \(Linuxユーザーの場合)

### Macユーザーの場合

1. [Alfred]をインストールする．
2. [AlfredのPowerpack](https://www.google.co.jp/search?q=alfred%20powerpack)を購入する．
3. [flybase_searcher]をクローンする．
4. `${HOME}/Documents/`に[fbgn.csv]をダウンロードして保存する．
5. `flybase_searcher/alfred/Flybase Search.alfredworkflow`を開くと，自動でインストールされる．

### Linuxユーザーの場合

1. [Albert]をインストールする．
2. [flybase_searcher]をクローンする．
3. `$flybase_searcher/albert/`に[fbgn.csv]をダウンロードして保存する．
4. `flybase_searcher/albert/`を`$HOME/.local/share/albert/org.albert.extension.python`に移動する．

## 使い方

1. ランチャーを起動する．
2. トリガーワード(`fly `)を入力する．
3. 遺伝子名(e.g. *N*, *Myo31DF*, *emc* ...)をトリガーワードに続けて入力して決定する．

# 議論

今回，クイックランチャーを用いたFlybase FBgnページへのアクセスについて示した．
そもそも，FBgnページへ直接移動せず，検索するだけならば，`http://flybase.org/search/{query}#/page/1`というURLを開くように設定するだけで可能である (e.g. [http://flybase.org/search/Myo31DF#page/1](http://flybase.org/search/Myo31DF#/page/1))．
この方法は，遺伝子名をぼんやり覚えているときや，別名から検索したいときには便利である．
これと比較して，本手法は，遺伝子名が完全に分かっているときに，瞬時にFBgnページへアクセスできる点が優れている．
ショウジョウバエ研究を長く行っていると，特にスクリーニングの経験があると，かなり多くのショウジョウバエ遺伝子名を記憶するため，本手法のほうがより素早くFBgnページへ移動できるだろう． 

本手法は，Flybaseだけでなく，[MGI](http://www.informatics.jax.org)や[Human Database](https://humandbs.biosciencedbc.jp/en/)などの検索にも応用可能である．
そもそも，クイックランチャーによるウェブページへのアクセスは，データベースと非常に相性が良い．
これ以外にも，UniprotやPubmedなど，応用の範囲は非常に広く，研究者がデータへ効率的にアクセスする上で必須の手法であるといえる．

[flybase_searcher]: https://github.com/ishibaki/flybase_search
[fbgn.csv]: https://ecsosaka-my.sharepoint.com/:x:/g/personal/u969789f_alumni_osaka-u_ac_jp/EfKcY45yeelMusdqFGsergUBiRRjT6SWP08xipM7YWE1rA?e=n9BrWJ
[Alfred]: https://www.alfredapp.com
[Albert]: https://albertlauncher.github.io
Windowsシミュレータで学ぶuITRON (4) - ミューテックス

# はじめに

**uITRON（FreeRTOSベース）Windowsシミュレータ - Qiita**
https://qiita.com/imagou/items/42c687402e6e58fccddb

今回のお題は、排他の仕組みである**ミューテックス**です。

# 本編

## 1. 環境

[こちらの記事](https://qiita.com/imagou/items/42c687402e6e58fccddb#1-1-%E7%92%B0%E5%A2%83)を参照ください。

## 2. 動かしてみる

### 2-1. （おさらい）受信タスクにメッセージを飛ばす

コンソールで「10」と入力してみましょう（入力後にEnterを押してください）。

```console
[TimerTask]: DELAY 3000ms
[TimerTask]: DELAY 3000ms
10
[SendTask]: RECV EVENT (00000400)
[RecvTask]: RECV MESSAGE (10,1)
```

`RecvTask`が「10」を受信していることがわかるかと思います（2つ目の「1」は受信回数です）。

### 2-2. 受信タスクのロック～メッセージ送信

次に、コンソールで「lock」と入力してみましょう。

```console
[TimerTask]: DELAY 3000ms
[TimerTask]: DELAY 3000ms
lock
[SendTask]: RECV EVENT (00800000)
```

特にコンソールには出てきませんが、この時点で受信タスクはロックしています。

~~※ただし`TimerTask`まで止まってしまうのが謎なので、追って調査します・・・~~
(2019/11/22) 解決させました。

その後、「11」「12」を入力してみます。

```console
11
[SendTask]: RECV EVENT (00000800)
12
[SendTask]: RECV EVENT (00001000)
```

受信タスクがロックしているため、`RecvTask`うんぬんのログが出ません。

### 2-3. 受信タスクのアンロック

「unlock」を入力し、受信タスクをアンロックしてやります。

```console
unlock
[RecvTask]: RECV MESSAGE (11,3)
[RecvTask]: RECV MESSAGE (12,4)
[TimerTask]: DELAY 3000ms
[TimerTask]: DELAY 3000ms
```

解放された`RecvTask`が、「11」「12」を順に受信していることがわかるかと思います。

## 3. 解説

### 3-1. 概要

ミューテックスは、RTOSに限らずよく利用されている、排他の仕組みです。

主たる利用方法は、**「共通のリソースを複数のタスクで触りたい」**場合かと思います。
（今回の例はあくまで動作確認用のため、タスクの停止・再開用途ですが、実用的ではないかと・・・）

### 3-2. コードによる説明

以降は、プログラムコード - `main.c`を引用して説明します。

#### 3-2-1. ミューテックス生成

`cre_mtx()`で生成します。

```C
    T_CMTX cmtx;
    cmtx.mtxatr = TA_TFIFO;
    cre_mtx(MTX_ID(RECV), &cmtx);
```

このパラメータは下表：

|パラメータ番号|名称|説明|
|---|---|---|
|第1パラメータ|ミューテックスID|単なるID。<br>以降はこのIDでもってロック・アンロックを実施。|
|第2パラメータ|T_CMTX構造体変数|下表で説明。|

T_CMTXのメンバは下表：

|名称|指定可能な値|説明|
|---|---|---|
|mtxatr|TA_TFIFO &#124; TA_TPRI|ミューテックス属性。<br>それぞれ、待ちキューの順序をFIFO順とするか、優先度順とするか。|

**※なお、mtxatrはこれ以外の値も指定可能（だが、上記のみで必要十分と考える）。**

#### 3-2-2. ミューテックスのロック

`loc_mtx()`を使います（以下は受信タスクのコード）。
資源がロックされていればアンロックまで待ちますし、そうでなければ即抜けます。

```C
        /* Lock/Unlock Mutex */
        loc_mtx(MTX_ID(RECV));
        unl_mtx(MTX_ID(RECV));
```

以下（コマンドタスク）では`ploc_mtx()`を使っています。
`p`はポーリングを意味し、こちらは待ちに入りません。

すなわち、資源がロックされていれば即エラー`E_TMOUT`を返し、そうでなければ即`E_OK`を返します。
（コメントの通り、コマンドタスクでの多重ロックを避けるために使用しています）

```C
        /* Lock */
        else if (EQUALS_(lock)) {
            /* 多重ロックを避けるためポーリングとする。 */
            if (ploc_mtx(MTX_ID(RECV)) == E_OK) {
                /* ダミーメッセージを投げ、ロック待ちに遷移させる。 */
                set_flg(FLAG_ID(SEND), EVENT_DUMMY);
            }
        }
```

#### 3-2-3. ミューテックスのアンロック

`unl_mtx()`を使います。
資源がロックされていたらアンロック（解放）します。この関数は待ちません。

ざっくり書くと
**コマンドタスクのアンロックにより、受信タスクのロックが解除されて動き出す**
というカラクリです。

```C
        /* Unlock */
        else if (EQUALS_(unlock)) {
            unl_mtx(MTX_ID(RECV));
        }
```


# おわりに

複数の資源を扱えるセマフォという輩もいますが、概ねミューテックスで事足りると思います。

根本的には、**排他不要な設計がベスト**と思いますが、どうしようもない場合（笑）に利用ください！

# 参考

**Micro-ITRON4.0 Specification (in Japanese)**
http://www.ertl.jp/ITRON/SPEC/mitron4-j.html
Amazon SQSでキューが削除されない

SQSをメッセージを受信してから、処理を行ってから、そのメッセージを削除するリクエストを送ったのですが、何度リクエストを送っても削除されませんでした。

以下は削除しているPHPのサンプルコードです

```php
### Controller

        $messageList = $sqsService->receiveMessage(
            self::SQS_CONFIG['QueueUrl'],
            self::SQS_CONFIG['MaxNumberOfMessages'],
            self::SQS_CONFIG['AttributeNames']
        );

        if (is_array($messageList) === true) {
            foreach ($messageList as $message) {

                ...

                // SQSのメッセージを削除する
                $sqsService->deleteMessage(self::SQS_CONFIG['QueueUrl'], $message['ReceiptHandle']);
            }
        }

### sqsService

    function deleteMessage($queueUrl, $receiptHandle)
    {
        $result = null;

        try {
            $client = SqsClient::factory(self::CONFIG);
            $result = $client->deleteMessage([
                'QueueUrl' => $queueUrl,
                'ReceiptHandle' => $receiptHandle,
            ]);
        } catch (Exception $e) {
            var_dump($e->getMessage());
        }

        return $result;
    }
```

ググったところ、以下の`stack overflow`が見つかりました。
https://stackoverflow.com/questions/10194293/sqs-messages-not-deleting

キューの設定値 `defaultVisibilityTimeout`が`0`で設定されている場合に削除が行えないようです。
SQSのコンソールから、以下のように値を変更します。

![f5d3bd78d48ed9ee6a3d349aa4f89b34.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/25625/0f679ab9-a911-3ce3-7619-84a932affb91.jpeg)

これで消えるようになりました。
ご参考までに。
Looper

Android中的Looper类，是用来封装消息循环和消息队列的一个类，用于在android线程中进行消息处理。handler其实可以看做是一个工具类，用来向消息队列中插入消息的。

 

(2) Looper类用来为一个线程开启一个消息循环。     默认情况下android中新诞生的线程是没有开启消息循环的。（主线程除外，主线程系统会自动为其创建Looper对象，开启消息循环。）     Looper对象通过MessageQueue来存放消息和事件。一个线程只能有一个Looper，对应一个MessageQueue。 

 

(2) 通常是通过Handler对象来与Looper进行交互的。Handler可看做是Looper的一个接口，用来向指定的Looper发送消息及定义处理方法。     默认情况下Handler会与其被定义时所在线程的Looper绑定，比如，Handler在主线程中定义，那么它是与主线程的Looper绑定。 mainHandler = new Handler() 等价于new Handler（Looper.myLooper()）. Looper.myLooper()：获取当前进程的looper对象，类似的 Looper.getMainLooper() 用于获取主线程的Looper对象。 

 

(3) 在非主线程中直接new Handler() 会报如下的错误: E/AndroidRuntime( 6173): Uncaught handler: thread Thread-8 exiting due to uncaught exception E/AndroidRuntime( 6173): java.lang.RuntimeException: Can't create handler inside thread that has not called Looper.prepare() 原因是非主线程中默认没有创建Looper对象，需要先调用Looper.prepare()启用Looper。 

 

(4) Looper.loop(); 让Looper开始工作，从消息队列里取消息，处理消息。 

 

注意：写在Looper.loop()之后的代码不会被执行，这个函数内部应该是一个循环，当调用mHandler.getLooper().quit()后，loop才会中止，其后的代码才能得以运行。

(5) 基于以上知识，可实现主线程给子线程（非主线程）发送消息。 

把下面例子中的mHandler声明成类成员，在主线程通过mHandler发送消息即可。         Android官方文档中Looper的介绍： Class used to run a message loop for a thread. Threads by default do not have a message loop associated with them; to create one, call prepare() in the thread that is to run the loop, and then loop() to have it process messages until the loop is stopped.

Most interaction with a message loop is through the Handler class. 

This is a typical example of the implementation of a Looper thread, using the separation of prepare() and loop() to create an initial Handler to communicate with the Looper.
【Laravel】業務で頻繁に使うクエリビルダメソッド

# はじめに
オークファンAdvent Calendar 2日目担当の長谷川爽です。

弊社に19新卒で入社して半年強が経ちました。現在は卸サイト[NETSEA](https://netsea.jp/)の開発を行なっています。

SQLはなんかすごい呪文ぐらいな認識で入社した私が、
半年間LaravelとSQLで開発をしていて覚えた、業務でよく使うクエリビルダーを初心者向けに紹介します。

いくつかの方法があるかと思いますが、DBファサードを使った方法を紹介します。
前提として、`Laravel 5.5 LTS`を使用しているものとします。


## 準備:DBファサードのインポート

`use`を使ってインポートすることで、以下のようにして呼び出せるようになります。
`table`メソッドを使って、例では`user_data`メソッドを指定しました。
アロー演算子 `->` を使うことでメソッドをつなげてクエリを作り込んでいきます。

```php
<?php
use Illuminate\Support\Facades\DB;

class UserData
{
    public function userList() :void
    {
        $users = DB::table('user_data');
    }
}

```


## select()
SELECT 文を追加します。
引数を複数にすることができ、配列を渡すこともできます。
文字列を持つ配列を渡すと、それぞれがSELECT文の対象になります。

```php
// SELECT user_id FROM user_data
DB::table('user_data')->select('user_id');
```
```php
// SELECT user_id, email, first_name, last_name FROM user_data
DB::table('user_data')->select(['user_id','email','first_name','last_name']);
```

## join()
JOIN 文を追加します。
動作はINNER JOINと同じ。

```php
// SELECT user_id FROM user_data INNER JOIN order ON user_data.user_id = order.user_id
DB::table('user_data')->select('user_id')
->join('order', 'user_data.user_id', '=', 'order.user_id');
```

## leftJoin()
LEFT JOIN 文を追加します。

```php
// SELECT user_id FROM user_data LEFT JOIN order ON user_data.user_id = order.user_id
DB::table('user_data')->select('user_id')
->leftJoin('order', 'user_data.user_id', '=', 'order.user_id');
```

## where()
WHERE 文を追加します。
第２引数は比較演算子を設定。

```php
// SELECT user_id FROM user_data INNER JOIN order ON user_data.user_id = order.user_id WHERE user_data.user_id = 123456
DB::table('user_data')->select('user_id')
->join('order', 'user_data.user_id', '=', 'order.user_id')
->where('user_data.user_id', '=', 123456);
```

## orderBy()
ORDER BY 文を追加します。
ソートが必要なときに使います。

```php
// SELECT user_id FROM user_data INNER JOIN order ON user_data.user_id = order.user_id ORDER BY order.date DESC
DB::table('user_data')->select('user_id')
->join('order', 'user_data.user_id', '=', 'order.user_id')
->orderBy('order.date', 'desc');
```

## ヒアドキュメント

`<<<`の後に特定の文字列を入力すると、うしろに書いたコードがそのまま文字列として扱われる機能です。
先にSQLが完成し文が長い場合など、実行するSQL文が既に決まっているときなどに便利です。

途中でPHPの変数を挟むことができます。なお、変数がそのまま入るのでインジェクションに気をつける必要があります。

```php
$query = <<<EOT
SELECT
  user_data.user_id
  , order_data.order_id
FROM
  user_data
  INNER JOIN order_data
    ON user_data.user_id = order_data.user_id
WHERE
  user_data.user_id = 1234
ORDER BY
  order_data.reg_date DESC
EOT;
$data = DB::select($query);
```

## おわりに
SQLは難解でしたが、広く使われている技術ですのでこの仕事をしていくには必須だと思っています。

もしこの記事が役に立ちましたら、いいね:+1:ボタンをお願いします。
会議内容を自動でテキストマイニングしよう！

#はじめに
「MTG内容をテキストマイニングしてぽんとできん？」何ていう相談が出てきました。
そこから始まったkotadoraの冒険の書です。
わからないから初めから勉強。

### 基本的な考え方
なんらかで話す⇒テキストに変換する⇒テキストについてマイニングする⇒JSかなんかで見やすくる
という流れになるのは目に見えた。ただ、やり方がね。

ということで探していくと、google様に良さそうな物があるではないか！というわけでググりまくる。

結局流れとしては

![image.png](https://qiita-image-store.s3.amazonaws.com/0/166400/c427d4c4-9a30-3682-4ba7-173e8de15d61.png)

こんな感じになりそう。まさにcloud functionsさまさまなプランニング。

### cloud functionsとは？？
まぁ要するにpub/subを複数実行できるスグレモノ、という認識です（雑）
pub/subのgoogle様の説明を呼んだのだが、結局パブリッシャーとサブスクライバーって結局何よ、と思ったのでぐぐってみたら、次の記事が。

>情報の提供者をパブリッシャーといいます。 パブリッシャーはある件名についての情報を提供しますが、情報を求めるアプリケーションについては何も認識する必要がありません。
情報の利用者をサブスクライバーといいます。 サブスクライバーはどんな情報が必要かを決定し、その情報が受信されるのを待ちます。 サブスクライバーは、多種多様なパブリッシャーから情報を受信し、その情報を他のサブスクライバーに送信できます。
>>https://www.ibm.com/support/knowledgecenter/ja/SSFKSJ_7.1.0/com.ibm.mq.explorer.doc/p_pubsubers.htm

とのこと。まぁ、さておき作ってみますか。

###とりあえずできるか？
macbookでSpeechAPIできないの？って思いググる。
https://qiita.com/MikuriyaHiroshi/items/9c64a970b037c560906e
あるじゃんか。ありがとうございます、もちろん参考にさせていただきます。

というか、え！？こんな簡単にできるの！？そうです。出来てしまいました。。。。
じゃあ、これにNaturalLanguageAPIつければ・・・いけるじゃん！
あ、ちなみに地味ですが、環境変数exportはexport -p でリストが、-nで消せます。（まぁ重ねれば良いんだけどね。）

######説明と補足
元ネタは　https://github.com/googleapis/nodejs-speech/blob/master/samples/package.json

```javascript:package.json
{
  "name": "test", //import()require()で呼び出すとき使うもの
  "version": "0.0.1", //nameとversionで1セット。この2つで定義。
  "private": true, //これでnpm(NodePackagedModule)のモジュールが非公開のもの＝つまりローカルにインストールされる（$HOME内ということですね。）
  "license": "Apache Version 2.0",
  "author": "Google Inc.",
  "scripts": {
    "test": "cd ..; npm run --verbose speech/system-test/*.test.js"
  }, //ここにはshellスクリプトで実行する内容をそのまま書く。この場合、cd ..　で戻って、npn run。
  "dependencies": {
    "@google-cloud/speech": "0.9.0",
    "@google-cloud/storage": "1.0.0",
    "node-record-lpcm16": "0.3.0"
  }, //依存するパッケージ(もちろんnpmの。)をここに書いている。つまり、ここに書いたパッケージを自動的に落としてくれるという優れもの（もちろんnpmにあるという、ね笑）
  "engines": {
    "node": ">=4.3.2"
  } //ノードの場所定義。
}
```

```javascript:test.json
{
const record = require('node-record-lpcm16'); //const つまり　varとかと違って再度代入出来ない変数。後出しは不可。
const speech = require('@google-cloud/speech');
const speechClient = speech();　//Google-cloudのnpmでのspeechのパッケージの中の関数を使う。
const SAMPLE_RATE = 16000 //サンプリングレート。

const request = { //SpeechAPIのcreateRecognizeStreamという場所に設定（でもどこ？？
  config: {
    encoding: 'LINEAR16',
    sampleRateHertz: SAMPLE_RATE,
    languageCode: 'ja-jp'
  }
}; 

const recognizeStream = speechClient.createRecognizeStream(request)
  .on('error', console.error)
  .on('data', (data) => {
    console.log(data.results);
  });

record.start({
  sampleRate: SAMPLE_RATE,
  thresholdStart: 0.2, // silence threshold to start recording, overrides threshold
  thresholdEnd: 0.1, // silence threshold to end recording, overrides threshold
  silence: '0.1' // seconds of silence before ending
}).pipe(recognizeStream);

}
```

https://www.npmjs.com/package/node-record-lpcm16

APIリファレンス
https://cloud.google.com/nodejs/docs/reference/speech/1.4.x/v1.SpeechClient

注）2018/4月に下書き書いて、そのまま放置してます。ただ、必要に迫られたので一応公開してます
学んだこと

「show」アクションや「edit」アクションのように「id」パラメータを指定して呼び出すアクションの場合は、モデルオブジェクト(下記では`@blog`変数に格納されている)を使って次のように記述します。

```erb
<%= link_to 'Show Page', blog_path(@blog) %>
<%= link_to 'Edit Page', edit_blog_path(@blog) %>
```

三項演算子とは

```rb
if 条件式
A
else            =>      条件式 ? A:B
B
end
```
に省略できる
[ Android ] 画面遷移時のデータのやり取り

今回は画面遷移時にどのようにしてデータをやり取りするかについて記す。

以前の記事https://qiita.com/QiitaD/items/1495f2f9839fe8706d31
で画面遷移の実装方法について記しているが、データのやり取りでもIntentを使う。

##データを引き渡たし
Intentを生成した後putExtraメソッドを使えば、引き渡すことができる。
このメソッドにはkeyとvalueを指定する。

~~~java
Intent intent = new Intent(getApplication(), SubActivity.class);
//intent.putExtra(key,value);
intent.putExtra("EXTRA_DATA", data1);
startActivity(intent);
~~~

これで渡すことができる。

##データの受け取り
受け取るときはgetStringExtra(key)で受け取ることができる。
具体的には以下のように実装する。

~~~java
Intent intent = getIntent();
data1 = intent.getStringExtra("EXTRA_DATA", 0);
~~~

getIntExtra()など引き渡しでどの型を渡したかにより、メソッド名が変化するので、注意していただきたい。



参考URL
https://akira-watson.com/android/activity-2.html
Robloxで「ジャンプ力アップ」のアイテムをつくる

# 概要
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/206887/f411f01c-c42b-38d9-1e83-bb21a23f7a94.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/206887/e55339c0-c870-10eb-ef24-151c931406c8.png)


# プログラミング
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/206887/a924f015-3b71-d6ee-161c-20670ffb78fa.png)

- Workspaceに新しくPartを追加
- 名前をJumpBallとかにしておく
- Scriptを追加


``` Script.lua
-- このScriptの親、つまりJumpBallオブジェクトを変数にいれておく
local boostPart = script.Parent
-- ジャンプ力の設定用の定数
local BOOSTED_JUMP_POWER = 125
 
local function onPartTouch(otherPart)
	-- ぶつかってきたPartの親を変数にいれておく
	-- 人間の場合、体のどこかのPartがぶつかったら、その親である人間本体のオブジェクトを変数にいれる
	local partParent = otherPart.Parent
	-- ぶつかってきたものが人間かどうかを判定
	local humanoid = partParent:FindFirstChildWhichIsA("Humanoid")
	if humanoid then
		-- 当たり判定を無効にする
		-- ボールにぶつかったら、ボールがころころ転がらないようにするため
		boostPart.CanCollide = false
		-- あとで必要なので、「現在のジャンプ力」を変数にいれておく
		local currentJumpPower = humanoid.JumpPower
		-- 「現在のジャンプ力」が、「強化後のジャンプ力」よりも弱ければ、ジャンプ力を強くする
		-- 10秒たったら、元のジャンプ力に戻す
		if currentJumpPower < BOOSTED_JUMP_POWER then
			humanoid.JumpPower = BOOSTED_JUMP_POWER
			wait(10)
			humanoid.JumpPower = currentJumpPower
		end
	end
end

-- 何かがぶつかったらonPartTouch関数が発動
boostPart.Touched:Connect(onPartTouch)
```

# 応用
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/206887/583a541d-b96d-d80f-b062-8717df1c95d9.png)

- ゲームを起動
- workspace内に自分のオブジェクトが登場（わたし場合はyorunegy）
- その中にHumanoidオブジェクトがある
- Humanoidオブジェクトをクリックしてから、画面下にある「Propertys-Humanoid....」というタブをクリック
- この中に複数のProperty（要素）があります。JumpPowerもその１つ
- 上記プログラミングの「JumpPower」の部分を別のProperty名に書き換えれば、違う効果をもったアイテムのできあがりです。
- 使えるPropertyは以下を参考のこと
- 最大HP、歩くスピード、現在のHPなどを変更できます
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/206887/46ae28f0-db2d-5697-2128-c13ba80875f6.png)
ipアドレスを変更する方法

##環境
RedHat Enterprise Linux 7.7

##ipアドレスを変更するには？
###viコマンドの利用
```
# vi /etc/sysconfig/network-scripts/ifcfg-eth0

```
##やり方
①ファイルの中身を確認します

```
# cat /etc/sysconfig/network-scripts/ifcfg-eth0
```

②ファイルの中身を書き換えます

```
# vi /etc/sysconfig/network-scripts/ifcfg-eth0
```

③再起動します

```
# reboot
```

④変更が反映されているのかを起動後に確認します。確認コマンドは下記の通りです。

```
# ip a
```


因みにAWSでは変更できません。下記のように表示されました。

```
# cat /etc/sysconfig/network-scripts/ifcfg-eth0
# Created by cloud-init on instance boot automatically, do not edit.
#
BOOTPROTO=dhcp
DEVICE=eth0
HWADDR=0X:XX:XX:XX:XX:XX
ONBOOT=yes
TYPE=Ethernet
USERCTL=no
 ※数字部分はXと記載しています
```

##引用

LinuxのIPアドレスを変更する
>http://www.searchman.info/tips/1350.html

以上がIPアドレスの変更方法です。
最後までお読みいただきありがとうございました！
「Go 1.4 “Internal” Packages」の挙動を確認してみる

## はじめに

Go の internal パッケージの仕様について実際にコードを動かして確認します。

[Go 1.4 “Internal” Packages](https://docs.google.com/document/d/1e8kOo3r51b2BWtTs_1uADIA5djfXhPT36s6eHVRIvaU/edit)
[Internal packages | Go 1.4 Release Notes](https://golang.org/doc/go1.4#internalpackages)

## 要約

internal の一個上の階層のパスを見て、そのパスの下に配置されているパッケージからならアクセス可能です。たぶん。

**架空の例**

- github.com/xxxx/foo/internal/bar というパッケージがある
- internal の一個上は github.com/xxxx/foo
- github.com/xxxx/foo の下に属する全てのパッケージは github.com/xxxx/foo/internal/bar にアクセス可能
- github.com/xxxx/foo/buz/qux も github.com/xxxx/foo/internal/bar にアクセス可能

**実際の例**

- [golang/go/src/cmd/internal/diff](https://github.com/golang/go/tree/master/src/cmd/internal/diff) というパッケージがある
- internal の一個上は [golang/go/src/cmd](https://github.com/golang/go/tree/master/src/cmd)
- golang/go/src/cmd の下に属する全てのパッケージは golang/go/src/cmd/internal/diff にアクセス可能
-  [golang/go/src/cmd/gofmt](https://github.com/golang/go/blob/39a9cb4b5dbf1e518b0c66fa3a7b4175f90226fc/src/cmd/gofmt/gofmt.go#L24) も golang/go/src/cmd/internal/diff にアクセス可能

## 実際にやってみた

### 前提

```go:foo/**/main.go
package main

import (
	"foo/**/internal/**/hello"
)

func main() {
	hello.Hello()
}
```

```go:foo/**/internal/**/hello/hello.go
package hello

import "fmt"

// Hello ...
func Hello() {
	fmt.Println("Hello, World!")
}
```

### パターン1（呼べるやつ）

```
foo
├── internal
│   └── hello
│       └── hello.go
├── go.mod
└── main.go
```

`foo/internal` は `foo` から呼べる。

![スクリーンショット 2019-11-21 14.09.24.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/237863/ed2a0f9a-97d1-3791-c72b-f6df4b19b7fc.png)

### パターン2（呼べないやつ）

```
foo
├── bar
│   └── internal
│       └── hello
│           └── hello.go
├── go.mod
└── main.go
```

`foo/bar/internal` は `foo` から呼べない。

![スクリーンショット 2019-11-21 14.13.39.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/237863/bce6163f-79ff-76ac-abba-76712de6eab0.png)

### パターン3（呼べるやつ）

```
foo
├── bar
│   ├── internal
│   │   └── hello
│   │       └── hello.go
│   └── main.go
└── go.mod
```

`foo/bar/internal` は `foo/bar` から呼べる。

![スクリーンショット 2019-11-21 14.16.03.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/237863/9a90d9f2-8fe9-df3c-5b41-bfeb446acc06.png)


### パターン4（呼べるやつ）

```
foo
├── cmd
│   └── bar
│       └── main.go
├── internal
│   └── hello
│       └── hello.go
└── go.mod
```

`foo/internal` は `foo/cmd/bar` から呼べる。

![スクリーンショット 2019-11-21 14.22.09.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/237863/ac9e3486-a2fe-63b6-7ebf-4bc9bdeaccd7.png)

## 結論

internal の 一個上を基準に考えればよさそうです。
Vue2.0で$broadcastと$dispatchの再現方法を紹介します

Vue1.0では、`$broadcast`と`$dispatch`が実装されています、例え多層数としても、指定されるコンポーネントにbroadcastまたはdispatchで通信することができます。

下記の通りです：

```html
<componentA @dispatchFromComponentC="alert($event)">
  <componentB>
    <componentC @broadcastFromComponentA="alert($event)">
    <componentC/>
  <componentB/>
<componentA/>
```

```js:componentA.vue
// componentA
$vm.broadcast("broadcastFromComponentA", "i am componentA")
```

```js:componentC.vue
// componentC
$vm.dispatch("dispatchFromComponentC", "i am componentC")
```

コンポーネントAは子コンポーネントBにイベントをbroadcastし、子コンポーネントBがイベントをリッスンし、trueを返すと、引き続き孫コンポーネントCにイベントをbroadcastします。

逆に、コンポーネントCは親コンポーネントBにdispatchし、親コンポーネントBがイベントをリッスンし、trueを返すと、引き続き祖父コンポーネントAにイベントをdispatchします。

しかし、これら二つのメソッドはもうVue 2.0で[削除](https://jp.vuejs.org/v2/guide/migration.html#events-%E3%82%AA%E3%83%97%E3%82%B7%E3%83%A7%E3%83%B3%E5%89%8A%E9%99%A4)されました。`this.$parent.$parent.$parent`や`this.$children.$children.$children`などの書き方を避けるために、今回は、[Element](https://element.eleme.cn/#/)のbroadcastとdispatch再現方法をご紹介させていただきます。

ソースコードは[こちら](https://github.com/ElemeFE/element/blob/dev/src/mixins/emitter.js)です

```js
function broadcast(componentName, eventName, params) {
  /*broadcastを発行するコンポーネントの下の全ての子コンポーネントをトラバースします*/
  this.$children.forEach(child => {
    /*子コンポーネント名を取得*/
    var name = child.$options.componentName;
    if (name === componentName) {
      /*当コンポーネントは指定されているコンポーネントの場合、$emitでイベントを送出する。
      (注意：指定されているコンポーネントでイベントを受け取るために、
　　　事前に$onリスナを追加するのは必要です。)*/
      child.$emit.apply(child, [eventName].concat(params));
    } else {
      /*当コンポーネントは指定されているコンポーネントではない場合、
      broadcast関数で再帰して、当コンポーネントの下の全ての子コンポーネントをトラバースします。*/
      broadcast.apply(child, [componentName, eventName].concat([params]));
    }
  });
}
export default {
  methods: {
    dispatch(componentName, eventName, params) {
      var parent = this.$parent || this.$root;
      /*親コンポーネント名を取得*/
      var name = parent.$options.componentName;
      while (parent && (!name || name !== componentName)) {
        /*当コンポーネントは指定されているコンポーネントではない場合、上層へ探し続きます*/
        parent = parent.$parent;
        if (parent) {
          name = parent.$options.componentName;
        }
      }
      /*当コンポーネントは指定されているコンポーネントの場合、$emitでイベントを送出する。
      (注意：指定されているコンポーネントでイベントを受け取るために、
　　　事前に$onリスナを追加するのは必要です。)*/
      if (parent) {
        parent.$emit.apply(parent, [eventName].concat(params));
      }
    },
    /*ここで、call関数で上記定義したbroadcast内部のthisを当Vueインスタンスに変更する*/
    broadcast(componentName, eventName, params) {
      broadcast.call(this, componentName, eventName, params);
    }
  }
};

```

以上です、役に立ってば幸いと思います:grin:。
応用カリキュラム jQuery 02 jsとjQueryが混じる・・・


```js
//引数が要素番号。DOMの集合の中の要素番号を返す
eq()
```

```js
// HTMLの読込 windows.addEventListener("load", function() {
// をjQueryにて
$(function() {
 // 処理
}
```

```js
// イベントリスナ submit フォームが送信される時に呼び出されるイベント
$("form").on("submit", function() {
 // 処理
});
```

```js
// formタグのsubmitボタンのaction属性を指定していないので、
// 同一ページにリダイレクトしてしまう。
// デフォルトで備わっているイベントをキャンセルする。
$("form").on("submit", function(e) {
  e.preventDefault();
});
```

イベントに関する情報を持つオブジェクトが、イベントオブジェクト。
target,keyCodeなどのプロパティが使える。

```js
// 引数にセレクタを指定して、合致するセレクタを全て取得
$(this).find("input[type="checkbox"]");
```

```js
// 繰り返し処理 each (js)
this.each(function() {
 // 処理
});

// 繰り返し処理 each (jQuery)
$.each(配列, function(index, 配列の要素) {
 // 処理
 return false
});
// return falseでeach文を抜ける
```

```js
// 要素のプロパティを取得する
prop();
// 要素の値を取得する
attr();
// prop(),attr()ほぼ動きが同じ・・・
// 解説してくれてるページはあるけども現状ややこしいのでとりあえずは
// HTMLの属性を取得する場合はattr、input関連の値を取得する場合はprop、と考えておく
```

```js
// 入力された値を取得する
セレクタ.val()
// 値を表示する
セレクタ.text()
```

```js
// 文字列を正規表現オブジェクトに変換
let reg = new RegExp("正規表現文字列");
// 文字列を正規表現オブジェクトと比較(返り値true or false)
文字列.match(reg);
```

正規表現はなんか情報量多いのでリンク 使う時に調べることにしよう
[JavaScript 正規表現まとめ - Qiita/ RegExp](https://qiita.com/iLLviA/items/b6bf680cd2408edd050f)

```js
// 要素に引数で指定したコンテンツを追加する
セレクタ.append();
```

```js
// 文字列から配列を作る
文字列.split(区切り文字)
// 区切り文字無しだと、何もしないっぽい
```

```js
// 与えられた関数を配列のすべての要素に対して呼び出し、その結果からなる新しい配列を生成
// なんか難しい・・・何しか、配列に何らかの操作をした配列を返す？
配列.map(関数)
```

```js
// 配列をひとつなぎの秘宝ワン○ース、もとい文字列にする。
配列.join(区切り文字)
// 区切り文字なしの場合は、カンマで区切られるっぽい
```

```js
// 複数の言葉で正規表現を使用するには「|」を使って文字列を繋げる。
RegExp(文字列配列.join("|"));
```

#参照
[JavaScript 正規表現まとめ - Qiita/ RegExp](https://qiita.com/iLLviA/items/b6bf680cd2408edd050f)
PhotoshopでGIFを作ろう

Qiitaに投稿する際、静止画じゃなくて動画を載せることもあるので作り方をメモしておく。

##ゲームバーを使って動画をキャプチャ
ゲームバーはWindows10の標準機能

- Windowsキー+Gでゲームバーが起動するからそこから【録画】ボタン:red_circle:をクリックして録画を開始
- Windowsキー+Alt+Rだと、そのまま録画開始、もう一度Windowsキー+Alt+Rを押すと録画停止
- 保存先はピクチャ/キャプチャ

##Photoshopでの作業

1. キャプチャした動画をPhotoshopで開く
2. 録画したままの尺だと長いので、【タイムライン】パネルから青いマークをクリック・ドラッグして鋏マークをクリックしてカットする
<img width="694" alt="201911021_Qiita01.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/509471/a793a3fa-7081-43aa-5ba4-cfef985488d0.png">
3. 左上のファイルから**書き出し＞Web用に保存**に進む（表示されるのに時間がかかるので待つ）
4. 表示されたら、ここでの設定は特にしなくてもいいので【保存】をクリックして保存場所と名前を指定（保存するのも少しかかるので待つ）
5. GIFの完成:cinema:

これでQiitaに載せることが出来る！