OmniAICreator/Qiita-1.07M huggingface dataset:
爆速で円グラフを実装する[5分]

#はじめに
今回は'chartkick'を使って爆速で円グラフを実装します。

#Gemの導入

 ```ruby:Gemfile
gem "chartkick"
gem 'chartable'
```

```ruby:ターミナル
bundle install
```

#javascriptライブラリの読み込み

```ruby:application.js
//= require Chart.bundle
//= require chartkick
```
application.jsに上記を記載。

#インスタンスメソッドの定義

```ruby:tweets_controller.rb
def index
配列の場合
  @chart = [['国語', 10], ['算数', 20],['理科',30]['社会',40]]
ハッシュの場合
  @chart = {"国語" => 10, "算数" => 20, "理科"　=> 30, "社会" => 40}
end
```
配列でもハッシュでも可能です！！

#viewページ

```ruby:tweets/index.html.haml
= pie_chart @chart
```
この一行を追加するだけ！！

<img width="589" alt="スクリーンショット 2019-10-12 15.40.17.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/501638/05eba8fc-150d-cba4-7784-4ed0e3b2ba56.png">

こんなかんじですね。

#備考
コントローラーの変数を変えればどんなグラフも作れます。
モデルから値を取得することが多いと思うので参考に載せておきます。

```
def index
  @chart = Post.order('created_at ASC').group(:name)
end
```
こんな感じです。

#おわりに
めちゃめちゃ簡単です。
ビューページに一行書けば実装できます:relaxed::relaxed:
では
[Golang]Paiza等で標準入力する際の、受け取り方と前処理のサンプルコード

# はじめに

Paizaや競技プログラミンで、大抵一番初めに必要な処理として、標準入力を受け取ることと、下処理をすることがあります。
備忘録的にまとめておきましたので、共有させて頂きます。

# 標準入力を受け取る方法

## 1行を丸ごと取得する

```golang
reader := bufio.NewReader(os.Stdin)
s, _ := reader.ReadString('\n')
```

続けて、もう一度
`reader.ReadString('\n')`
とすれば、二行目の標準入力が取得できる。
入力される行数だけ繰り返せば、順番に全て取得できる。

# 受け取った文字列の下処理

## 改行を除外する

```golang
s = strings.TrimSpace(s)
```
邪魔な改行キーは、先に処理しちゃいましょう。

# 文字列を数値に変換する

```golang
n, _ := strconv.Atoi(s)
```

かけたり、足したりする場合、数値にキャストしておく必要があります。
その場合は、このように処理します。

# 空白で区切ってスライスにする

```golang
t := strings.Split(s, " ")
```

まとめて取得した値を、空白で区切って、それぞれをスライスに格納します。

# さいごに

簡単ではございますが、今回は以上です。
本家が無料で後悔している内容から、抜粋しておりますので、コンプライアンス的には問題がないかと思いますが、何か問題等があれば、コメントを頂けると嬉しいです。

最後までありがとうございました。
[sketch]電子工作で3つのLEDをチカチカしてみた件

# はじめに

今回は、やや稚拙なものかと思いまが、共有させて頂きます。
`Arduino uno`というマイコンボードを使って、はじめて電子工作してみました。

# 実際に動いている様子

![IMG_0146.MOV.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/330623/79ee9f88-46e8-0aeb-82cf-aced47aaf599.gif)

gifなので、速度感が分かりにくいかもですが、こんな感じに動いてくれました。
やはり、動くと楽しい。

# コード

```c++
void setup() {
  // put your setup code here, to run once:
  pinMode(11,OUTPUT);
  pinMode(12,OUTPUT);
  pinMode(13,OUTPUT);

}

void loop() {
  // put your main code here, to run repeatedly:
  digitalWrite(11,HIGH);
  digitalWrite(12,LOW);
  digitalWrite(13,LOW);

  delay(1000);

  digitalWrite(11,LOW);
  digitalWrite(12,HIGH);
  digitalWrite(13,LOW);
  
  delay(1000);

  digitalWrite(11,LOW);
  digitalWrite(12,LOW);
  digitalWrite(13,HIGH);

  delay(1000);

  digitalWrite(11,HIGH);
  digitalWrite(12,HIGH);
  digitalWrite(13,HIGH);

  delay(1000);
}
```

# さいごに

不恰好かもしれませんが、備忘録も兼ねて保存させて頂きました。
なにかありましたら、コメントいただけると嬉しいです。

最後までありがとうございました。
Google Spreadsheetで今何年かを取得して、生年から今の年齢を取得する


プログラミングって感じでもないけどメモ。

GAS使えばって話はありそうですが、これくらいならGAS使わずにやれました。

## やりたいこと

> ![スクリーンショット 2019-10-12 15.38.22.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/35387/2020ab90-b9e6-c4a2-5b42-17f7c3e80633.png "スクリーンショット 2019-10-12 15.38.22.png")

現在の年齢は毎年更新される情報だけど毎回更新作業をするのは大変んなので、常に更新されていくようにします。

`今の年齢 = 今年 - 生年`なので"今年"を取得できれば良さそうですね。

## "今年"を取得するのに使う関数と手順

### TODAY()

> https://support.google.com/docs/answer/3092984?hl=ja
> ![スクリーンショット 2019-10-12 15.29.17.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/35387/0255aab4-d1b3-1e5c-9e6d-0b5a0bb28639.png "スクリーンショット 2019-10-12 15.29.17.png")

こんな感じで今日の日付を教えてくれます。

この中の`2019`を抜き出したいんですが、このままだとDate型になってて[`MID()`](https://support.google.com/docs/answer/3094129?hl=ja)などの文字列抽出系の関数が使えなかったです。

### TEXT()

そこでTEXT()がちょうどよく使えました。

> https://support.google.com/docs/answer/3094139?hl=ja

> ![スクリーンショット 2019-10-12 15.34.03.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/35387/3b464a70-8074-c33e-5994-9326e3ac74c8.png "スクリーンショット 2019-10-12 15.34.03.png")

TODAY()と組み合わせて`=TEXT(TODAY(),"yyyy")`という書き方をすると`2019`が抽出されます。

## 年齢計算

`=TEXT(TODAY(),"yyyy") - 生年`で年齢計算できますね。

> ![スクリーンショット 2019-10-12 15.42.07.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/35387/8f1c0415-5709-23d6-a05a-33a3a1ab8de6.png "スクリーンショット 2019-10-12 15.42.07.png")
rbenvを使ってUbuntu 18.04にRubyをインストールする

# はじめに
UbuntuにRubyをインストールしたときの記録です。

## 各種バージョン
Ubuntu 18.04 LTS
Ruby 2.6.5

# インストール方法
## rbenvのインストール
rbenvはRubyのバージョン管理ツールです。rbenvを使ってRubyをインストールします。

まずは、関連パッケージをインストール

```bash

$ sudo apt update
$ sudo apt install autoconf bison build-essential libssl-dev libyaml-dev libreadline6-dev zlib1g-dev libncurses5-dev libffi-dev libgdbm5 libgdbm-dev
```

rbenvをGitHubからcloneする

```
$ git clone https://github.com/rbenv/rbenv.git ~/.rbenv
```

`~/.rbenv/bin` にパスを通す

```
$ echo 'export PATH="$HOME/.rbenv/bin:$PATH"' >> ~/.bashrc
```

rbenvをセットアップ

```
$ ~/.rbenv/bin/rbenv init
```

セットアップを自動で行うために`.bashrc`に追記。
メッセージには`.bash_profile`に追記するように出るが、GUI版Ubuntuの場合は`.bashrc`に追記。

```
$ echo 'eval "$(rbenv init -)"' >> ~/.bashrc
```

シェルを再起動 or 以下のコマンドを実行。

```
$ source ~/.bashrc
```

`rbenv-doctor`を使ってrbenvの設定ができたか確認する。

```
$ curl -fsSL https://github.com/rbenv/rbenv-installer/raw/master/bin/rbenv-doctor | bash
```

`ruby-build`がインストールされていない場合は、以下が表示される

```
Checking `rbenv install' support: not found
Unless you plan to add Ruby versions manually, you should install ruby-build.
Please refer to https://github.com/rbenv/ruby-build#installation
```

## ruby-buildのインストール
GitHubからrbenvのプラグインとしてインストール

```
$ mkdir -p "$(rbenv root)"/plugins
$ git clone https://github.com/rbenv/ruby-build.git "$(rbenv root)"/plugins/ruby-build
```

もう一度`rbenv-doctor`を実行する

```
$ curl -fsSL https://github.com/rbenv/rbenv-installer/raw/master/bin/rbenv-doctor | bash
```

これで、`rbenv install`を実行できるようになる

## Rubyのインストール
インストールできるバージョンをチェック

```
$ rbenv install -l
```

バージョンを指定してインストール

```
$ rbenv install 2.6.5
```

Rubyのデフォルトバージョンを指定

```
$ rbenv global 2.6.5
```

確認して終了

```
$ ruby -v
ruby 2.6.5p114 (2019-10-01 revision 67812) [x86_64-linux]
```

# 参考サイト
- [Ruby公式ドキュメント - Rubyのインストール](https://www.ruby-lang.org/ja/documentation/installation/#rbenv)
- [GitHub rbenv](https://github.com/rbenv/rbenv)
- [GitHub ruby-build](https://github.com/rbenv/ruby-build#readme)
- [How To Install Ruby on Rails with rbenv on Ubuntu 18.04](https://www.digitalocean.com/community/tutorials/how-to-install-ruby-on-rails-with-rbenv-on-ubuntu-18-04)
【powershell】 10進数と26進数を相互変換して Excel を扱いやすくする


powershell でもやってみました。[コンソールから Excel を操作する](https://qiita.com/AWtnb/items/b0742a26c622b81248c6) ようなときに使えます。

# 26進数 → 10進数

```powershell
function Convert-Colname2Int ([string]$s) {
    $alphabet = "ABCDEFGHIJKLMNOPQRSTUVWXYZ"
    $s = $s.ToUpper()
    $ret = 0
    for ($i = 0; $i -lt $s.Length; $i++) {
        $ret = $ret*26 + $alphabet.IndexOf($s[$i])+1
    }
    return $ret
}

# Alias
Set-Alias colname2int Convert-Colname2Int
```

# 10進数 → 26進数

```powershell
function Convert-Int2Colname ([int]$i) {
    if ($i -le 0) {
        return
    }

    if ($i -le 26) {
        return ([char]($i + 64)).ToString()
    }

    if (($i % 26) -eq 0) {
        $alphabetIndex = 26
    }
    else {
        $alphabetIndex = $i % 26
    }

    $unitOfAtoZ = [math]::Floor(($i - $alphabetIndex) / 26)
    return ("{0}{1}" -f (int2colname $unitOfAtoZ), ([char]($alphabetIndex + 64)).ToString())
}

# Alias
Set-Alias int2colname Convert-Int2Colname
```

# 動作
```
PS > colname2int A
1

PS > colname2int zx
700

PS > int2colname 1
A

PS > int2colname 700
ZX

PS > 1..30|foreach {int2colname $_}
A
B
C
D
E
F
G
H
I
J
K
L
M
N
O
P
Q
R
S
T
U
V
W
X
Y
Z
AA
AB
AC
AD

```

うまく行っている模様。
Linuxの基本

[未来電子テクノロジー](https://www.miraidenshi-tech.jp/intern-content/program/)でインターンをしている[箕牧和廣](https://qiita.com/mimaki_kazuhiro)です。
今回はLinuxについて書いていこうと思います。

プログラミング初心者であるため、内容に誤りがあるかもしれません。
もし、誤りがあれば修正するのでどんどん指摘してください。

#Linuxとは
Linuxとは『Mac OS』や『Windows 10』のようなOSの１種です。
OSとは、オペレーティングシステムの略称で、コンピュータの全てのハードウェアを管理しているソフトウェアのことです。
具体的な役割としては、マウスやキーボードから入力した情報をアプリケーションに伝え、ハードウェアとソフトウェアの連携をはかります。

#Linuxの特徴
LinuxはオープソースのOSなので、ソースコードを誰でも無料でダウンロード、変更、再配布できます。
また、Linuxを利用する場合、基本的にはLinuxディストリビューションを使用します。
Linuxディストリビューションは、Linuxのアプリケーションやライブラリをひとまとめにして、PCにインストールすれば使える状態にした配布物を指し、利用可能なLinuxディストリビューションは何千とあります。

#覚えておきたいLinux用語
僕が勉強していて分からなかったLinux用語をまとめてみます。

##Linuxカーネル
Linuxカーネルはソフトウェアからの要求に応え、ハードウェアからの応答をソフトウェアに伝える、仲立ちをしてくれます。
代表的な機能としては、プロセス管理、プロセススケジューラ、メモリ管理、ファイルシステムなどです。

##パッケージ
パッケージとはアプリケーションの配布形態です。
Windowsでは、インターネットからインストーラーをダウンロードしてアプリをインストールしますが、Linuxでは、RPMやYumなどのパッケージ管理ツールを利用し、パッケージをダウンロードしてインストールします。

##ディレクトリ
ディレクトリとは、ファイルを分類、整理、保存する入れ物のようなものです。
Windowsの『フォルダ』と同じようなイメージです。

##シェル
シェルとは、Linux上で使用できるコマンドをまとめて記述して実行できるもので、シェルスクリプトとも呼びます。
シェルスクリプトは、プログラミング言語のように条件分岐や繰り返し処理など記述することができます。

##コマンド
Linuxのシェルでは、Linuxに何を実行させるのかを、キーボードで入力します。
コマンドは、このキーボードで入力する命令文のことです。
よく使うコマンドを以下にまとめてみました。

| コマンド       |       説明 |
|:-----------------|------------------:|
| ls             |              ディレクトリ情報の表示 |
| cd           |            ディレクトリの移動 |
| cp             |              ファイルのコピー |
| mv               |                ファイルの移動・ファイル名の変更 |
| rm             |             ファイルの削除 |
| cat          |           テキストファイルの内容を表示 |
| touch        |           ファイルのタイムスタンプの変更 |
| mkdir        |           フォルダ作成　|
| man          |           マニュアルの表示 |

##ライブラリ
ライブラリとは、よく使用されるプログラムの共通部分を抜き出して、他のプログラムから利用できるようにしたものです。
Docker環境でAtCoder〜Ruby編

## AtCoderのRuby環境って特殊だよね？

AtCoderのRubyのバージョンは2.3.3です。ちょっと古いですね。AtCoderの時だけrbenvを使って2.3.3に戻してもいいですけど、Dockerを使ってもいいなぁとぼんやり思っているここの私！
というわけで、DockerでRubyのAtCoder環境を整えてみました。

## Dockerfileを書いてみた

```Dockerfile:Dockerfile
FROM ruby:2.3.3
ENV LANG="C.UTF-8"

ENV USER yourname
ENV HOME /home/${USER}

RUN useradd -m ${USER}
RUN gpasswd -a ${USER} sudo
RUN echo "${USER}:password" | chpasswd

RUN gem install at_coder_friends

USER ${USER}
WORKDIR ${HOME}

CMD ["/bin/bash"]

```

途中でインストールしているgemの `at_coder_friends` というのは、 [AtCoderツールを自作した話](https://qiita.com/nejiko96/items/0cd23ac2c033864ef341) で @nejiko96 さんが作ってくださったAtCoderのテストツールです。テストだけではなく、回答のスケルトンも作ってくれたり、このツールから回答フォームにsubmitできたりとものすごく便利です。現在はRubyとC++に対応している模様です。
Usageなどが書かれたGitHubのリポジトリはこちら＞ [AtCoderFriends](https://github.com/nejiko96/at_coder_friends)

で、ビルドして実行してAtCoderを楽しみましょう！

```sh
docker build --tag at-coder .
docker run --rm -it -v path/to/atcoder_problems:/home/yourname at-coder
```

## 参考URL
https://qiita.com/Riliumph/items/3b09e0804d7a04dff85b
https://qiita.com/nejiko96/items/0cd23ac2c033864ef341
Debian 8にOpenJDK 11をインストール（Amazon Corretto）

# はじめに

Amazon Correttoを利用してDebian8にOpenJDK11をインストール
親記事：[OpenJDKの各種インストール方法とEOLまとめ](https://qiita.com/witchcraze/items/b179202216aab50b7090)
参考：[Debian ベースおよび RPM ベースの Linux ディストリビューションで Amazon Corretto 11 をインストールする手順 - Amazon Corretto](https://docs.aws.amazon.com/ja_jp/corretto/latest/corretto-11-ug/generic-linux-install.html)

## サポート

本手法で導入した場合、[よくある質問 - Amazon Corretto | AWS](https://aws.amazon.com/jp/corretto/faqs/)より、2027-09がEOLになると思われる。
それ以降に報告された脆弱性や不具合への対応は実施されない可能性がある。

## LOG

### インストール

[Amazon Corretto 11 のダウンロード - Amazon Corretto](https://docs.aws.amazon.com/ja_jp/corretto/latest/corretto-11-ug/downloads-list.html)より適切なファイルを確認。
リンク先のファイルが古いときは[英語版ページ](https://docs.aws.amazon.com/corretto/latest/corretto-11-ug/downloads-list.html)を参照。

```shell-session
# cat /etc/os-release
PRETTY_NAME="Debian GNU/Linux 8 (jessie)"
NAME="Debian GNU/Linux"
VERSION_ID="8"
VERSION="8 (jessie)"
ID=debian
HOME_URL="http://www.debian.org/"
SUPPORT_URL="http://www.debian.org/support"
BUG_REPORT_URL="https://bugs.debian.org/"

# apt update;apt install -y wget java-common
# wget -O jdk11.deb https://xxxx/11.xxxx/java-11-amazon-corretto-jdk_11.xxxx.deb && dpkg --install jdk11.deb
... 略
... 略
```

### 各種確認

```shell-session
# which java
/usr/bin/java

# java -version
openjdk version "11.0.3" 2019-04-16 LTS
OpenJDK Runtime Environment Corretto-11.0.3.7.1 (build 11.0.3+7-LTS)
OpenJDK 64-Bit Server VM Corretto-11.0.3.7.1 (build 11.0.3+7-LTS, mixed mode)
```
K8s pod で gsutil を使うコツ

盛大にハマりました。

GCP では通常 gcloud という cli tool を使いますが、BQ や GCS ではなぜか別で用意された bq や gsutil を使用します。この場合に gcloud おなじみの認証方法が使えません。普段手元で使っているぶんには自動で連携してくれるのですが、CI などまっさらな環境でいきなり走らせようとするとどうしたもんか? となるわけです。

### TL;DR
これで動きます。(例)

GCP IAM で適切な権限 (Storage Admin 等) を付与した service account を作成し、JSON 形式の key file を download しておきます。

```
kubectl create secret generic sa-key --from-file=/Users/xxxx/Downloads/xxxx.json
```
```
apiVersion: v1
kind: Pod
metadata:
  name: test-gsutil
spec:
  containers:
  - name: test-gsutil-ls
    image: gcr.io/cloud-builders/gsutil
    command:
      - gsutil
    args:
      - -DD
#      - -q
      - -o
      - Credentials:gs_service_key_file=/secret/xxxx.json
      - ls
      - gs://<bucket-name>/<path>
    volumeMounts:
    - name: gcp-sa-key
      mountPath: /secret
  volumes:
  - name: gcp-sa-key
    secret:
      secretName: sa-key
  restartPolicy: Never
```

### 解説・ハマったポイント

##### gcloud とおなじ認証が使えない
おなじみの環境変数 GOOGLE_APPLICATION_CREDENTIALS は無視されます。上にあるように、option で渡してやることができます。または、下で説明する BOTO を使うことができるようです。(未検証)

##### minikube ならではの罠・時刻ズレ
試行錯誤の途中で急に下のエラーが出るようになりました。

```
ERROR: (gcloud.auth.activate-service-account) There was a problem refreshing your current auth tokens: invalid_grant: Invalid JWT: Token must be a short-lived token (60 minutes) and in a reasonable timeframe. Check your iat and exp values and use a clock with skew to account for clock differences between systems.
```
Mac minikube を hyperkit で使っている場合、Mac を sleep した時間ぶんの minikube 環境との時刻ズレが自動で sync されないようです。気づけば簡単なことなのですが、ずいぶん時間をとられました。いくつか workaround はあるようですが、とりあえず minikube を再起動してやればなおります。
参考 https://github.com/kubernetes/minikube/issues/1378

### その先

##### BOTO config
gsutil は BOTO という設定ファイルをサポートしています。
https://cloud.google.com/storage/docs/boto-gsutil
何が設定できるかは下の gsutil config のページにありますが、詳細は gsutil config で生成される実際の boto file 内を見てねということのようです。
処理並列数などを設定できるようで、なかなか便利に使えそうです。(未検証)

##### gsutil の option、parameter
gsutil -DD で debug 情報を表示したり、-q で逆に出力を抑制したりできます。
https://cloud.google.com/storage/docs/gsutil/addlhelp/TopLevelCommandLineOptions
gsutil config でさまざま設定をつくるすることができ、試行錯誤に役立つかもしれません。
https://cloud.google.com/storage/docs/gsutil/commands/config


### 感想
gcloud に統合していただきたいです。
GCP Cloud Build で動かすならこんな苦労は無いんでしょうね。縛られたくなかったんです。
Djangoで簡単なWebサイトを作ってみよう！

#はじめに
[未来電子テクノロジー](https://www.miraidenshi-tech.jp/intern-content/program/)でインターンをしているsajoです！

プログラミング初心者であるため、内容に誤りがあるかもしれません。
もし、誤りがあれば修正するのでどんどん指摘してください！

今回はDjangoについてまとめていきます。

#プロジェクトとアプリケーションの作成
```shell:terminal
# [django-app]というプロジェクト名のディレクトリを生成
# 仮想環境下でコマンドを実行
$ django-admin startproject django_app

# [hello]というアプリケーションを生成
# プロジェクト内でコマンドを実行
$ python manage.py startapp hello
```

#urls.pyの編集
ここでは「アプリのアドレス管理は、各アプリ内で行わせる」ようにします。
こうすることでアプリを編集した際に、わざわざプロジェクトまで気にする必要がなくなるのです。

```python:django_app/hello/urls.py
from django.urls import path
from . import views

urlpatterns = [
   path('', views.index, name='index'),
]
```

```python:django_app/django_app/urls.py
from django.contrib import admin
from django.urls import path, include

urlpatterns = [
   path('admin/', admin.site.urls),
   paht('hello/', include('hello.urls')),
]
```


#views.pyの編集
ここでは http://localhost:8000/hello/ にアクセスした時に、テンプレートフォルダに格納してある hello/index.html というHTMLファイルを表示させるように、views.pyを編集します。
HTMLファイルで使用する変数を、paramsに辞書形式で定義し、render関数の第３引数で返しています。

```python:django_app/hello/views.py
from django.shortcuts import render
from django.http import HttpResponse

def index(request):
   params = {
      'title':'Hello/Index',
      'msg':'これは、サンプルで作ったページです。',
   }
   return render(request, 'hello/index.html', params)
```

#index.htmlの編集
vies.pyのindex関数で定義したparams辞書は、HTMLファイル内で{{キー}}のように指定すると画面に表示することができます。

```html:index.html
<!doctype html>
<html lang='ja'>
<head>
   <meta charset='utf-8'>
   <title>{{title}}</title>
</head>
<body>
   <h1>{{title}}</h1>
   <p>{{msg}}</p>
</body>
</html>
```

#まとめ
この記事では、Djangoの基本中の基本事項をまとめてみました。

最後までご覧いただきありがとうございました！
git log --stat についての調査メモ

# これは何？
ファイルに行の追加/削除、そして削除を行ったときに `git log --stat` はどういう出力になるのかの調査の結果をまとめたメモ。


# 調査
## 操作内容
### 操作手順の詳細
以下の手順でファイルに変更を行い、その後に `git log --stat` の出力を見てみる。具体的な手順は以下の通り。

1. ファイルを新規に追加しコミット。（ファイル名：stest00.txt）行数は30行。
2. stest00.txt に10行追加して、コミット。
3. stest00.txt から20行削除して、コミット。
4. stest00.txt から10行削除して、コミット。
5. stest00.txt から10行削除して、コミット。
6. stest00.txt のファイル自体を削除して、コミット。

### `git log --stat` を実行
以上の履歴を経た後に `git log --stat` を実行した結果

```console
 $ git log --stat=9999999
commit 108d523590223e02f9bc316bbfbfdd399b053f43 (HEAD -> master, origin/master)
Author: Ryoya Kawai <xxxxyyyyzzzz@xxxxxxx>
Date:   Sat Oct 12 14:55:24 2019 +0900

    delete file

 stest01.txt | 0
 1 file changed, 0 insertions(+), 0 deletions(-)

commit 8b25d3506d506421d70a37c787163eded3c65b89
Author: Ryoya Kawai <xxxxyyyyzzzz@xxxxxxx>
Date:   Sat Oct 12 14:55:03 2019 +0900

    add: add file stest01.txt

 stest01.txt | 0
 1 file changed, 0 insertions(+), 0 deletions(-)

commit ed60eb11974045f256edb6684fa47cb6bfe167ad
Author: Ryoya Kawai <xxxxyyyyzzzz@xxxxxxx>
Date:   Sat Oct 12 14:51:08 2019 +0900

    delete: stat00.txt

 stest00.txt | 10 ----------
 1 file changed, 10 deletions(-)

commit 4a788379e9c02849a11f145f6ee42e676e3c4ae9
Author: Ryoya Kawai <xxxxyyyyzzzz@xxxxxxx>
Date:   Sat Oct 12 14:50:00 2019 +0900

    delete 10 lines

 stest00.txt | 10 ----------
 1 file changed, 10 deletions(-)

commit 5b696a02912dfc70591a7ce62677490389ee4f74
Author: Ryoya Kawai <xxxxyyyyzzzz@xxxxxxx>
Date:   Sat Oct 12 14:49:39 2019 +0900

    deletee: 20lines

 stest00.txt | 20 --------------------
 1 file changed, 20 deletions(-)

commit f9bb1f3d267d3d55684048199771c541c381bc2d
Author: Ryoya Kawai <xxxxyyyyzzzz@xxxxxxx>
Date:   Sat Oct 12 14:49:17 2019 +0900

    add: 10lines

 stest00.txt | 10 ++++++++++
 1 file changed, 10 insertions(+)

commit b5ba23a53eae4ab9647a5636e91f68566746e121
Author: Ryoya Kawai <xxxxyyyyzzzz@xxxxxxx>
Date:   Sat Oct 12 14:48:40 2019 +0900

    add: 30lines

 stest00.txt | 30 ++++++++++++++++++++++++++++++
 1 file changed, 30 insertions(+)

commit aaf0feafd3f76dd7d5bc51b2e2bf85ccccbf01ff
Author: Ryoya Kawai <xxxxyyyyzzzz@xxxxxxx>
Date:   Sat Oct 12 14:47:45 2019 +0900

    first commit

 README.md | 1 +
 1 file changed, 1 insertion(+)
xxxxyyyyzzz /tmp/aaaa $ 
```

### 空のファイルはどうなる？

「ファイルの変更」と履歴には残っているが、追加も削除もゼロとなる。

```console
xxxxyyyyzzz /tmp/aaaa $ git log --stat=9999999
commit 108d523590223e02f9bc316bbfbfdd399b053f43 (HEAD -> master, origin/master)
Author: Ryoya Kawai <xxxxyyyyzzzz@xxxxxxx>
Date:   Sat Oct 12 14:55:24 2019 +0900

    delete file

 stest01.txt | 0
 1 file changed, 0 insertions(+), 0 deletions(-)

commit 8b25d3506d506421d70a37c787163eded3c65b89
Author: Ryoya Kawai <xxxxyyyyzzzz@xxxxxxx>
Date:   Sat Oct 12 14:55:03 2019 +0900

    add: add file stest01.txt

 stest01.txt | 0
 1 file changed, 0 insertions(+), 0 deletions(-)
xxxxyyyyzzz /tmp/aaaa $
```

### まとめ
- 行数追加、削除はそのまま表示
- ファイルを削除したとしても、行数削除として表示される
- ファイルを削除、ファイル追加というイベントは履歴として表示されない
- 空のファイルも履歴として表示されるが、追加も削除もゼロ行で扱われる
Ruby on rails 5 のselect_tagにおいて、未選択を作成する方法

こんにちは、マイクロビジネス研究家の田中です。

本日は、Ruby on rails 5 のoptions_from_collection_for_selectにおいて、未選択を作成する方法について、記述します。

こんな簡単なことすぐわからないの？と思う方は多いと思いますが、
結構ネットで探したんですが、なかなか見つからないです。
1時間ぐらい探してやっとわかったので共有します。

```
<%= select_tag id, Hash , :prompt => "未選択" %>
```

:promt => "未選択がミソです！


終わり！
Windows10で `ngrok` コマンドが失敗する場合、 `ngrok.cmd` と入力する。

## それはLineBot開発中に起こった

LineBotをローカルで動かしたい。
どうやら[ngrok](https://ngrok.com/)というものがあるようだ。さっそく入れて使ってみよう。

``` bash
$ npm install -g ngrok
$ ngrok http 8080
/c/Program Files/nodejs/ngrok: line 1: /node_modules/ngrok/bin/ngrok: No such file or directory
```

おやおや。

## 解決策を見つけた
[TLmaK0 commented](https://github.com/bubenshchykov/ngrok/issues/10#issuecomment-431298246)

``` bash
$ ngrok.cmd http 8080
ngrok by @inconshreveable                                                                                                                                               (Ctrl+C to quit)

Session Status                online
Session Expires               7 hours, 59 minutes
Update                        update available (version 2.3.35, Ctrl-U to update)
Version                       2.3.25
Region                        United States (us)
Web Interface                 http://127.0.0.1:4040
Forwarding                    http://hoge114514.ngrok.io -> http://localhost:8080
Forwarding                    https://hoge114514.ngrok.io -> http://localhost:8080

Connections                   ttl     opn     rt1     rt5     p50     p90     
                              0       0       0.00    0.00    0.00    0.00
```

`ngrok`を`ngrok.cmd`にして実行したらうまくいった。
ありがてぇありがてぇ。

## 最後に
うーん、こんなことにハマるならMacにするかぁ
Debian 8にOpenJDK 8をインストール（Amazon Corretto）

# はじめに

Amazon Correttoを利用してDebian8にOpenJDK8をインストール
親記事：[OpenJDKの各種インストール方法とEOLまとめ](https://qiita.com/witchcraze/items/b179202216aab50b7090)
参考：[Debian ベースおよび RPM ベースの Linux ディストリビューション用の Amazon Corretto 8 のインストール手順 - Amazon Corretto](https://docs.aws.amazon.com/ja_jp/corretto/latest/corretto-8-ug/generic-linux-install.html) 

## サポート

本手法で導入した場合、[よくある質問 - Amazon Corretto | AWS](https://aws.amazon.com/jp/corretto/faqs/)より、2026-05がEOLになると思われる。
それ以降に報告された脆弱性や不具合への対応は実施されない可能性がある。

## LOG

### インストール

[Amazon Corretto 8 のダウンロード - Amazon Corretto](https://docs.aws.amazon.com/ja_jp/corretto/latest/corretto-8-ug/downloads-list.html)より適切なファイルを確認。
リンク先のファイルが古いときは[英語版ページ](https://docs.aws.amazon.com/corretto/latest/corretto-8-ug/downloads-list.html)を参照。

```shell-session
# cat /etc/os-release
PRETTY_NAME="Debian GNU/Linux 8 (jessie)"
NAME="Debian GNU/Linux"
VERSION_ID="8"
VERSION="8 (jessie)"
ID=debian
HOME_URL="http://www.debian.org/"
SUPPORT_URL="http://www.debian.org/support"
BUG_REPORT_URL="https://bugs.debian.org/"

# apt update;apt install -y wget java-common
# wget -O jdk8.deb https://xxxx/8.xxxx/java-1.8.0-amazon-corretto-jdk_8.xxxx.deb && dpkg --install jdk8.deb
... 略
```

### 各種確認

```shell-session
# which java
/usr/bin/java

# java -version
openjdk version "1.8.0_222"
OpenJDK Runtime Environment Corretto-8.222.10.1 (build 1.8.0_222-b10)
OpenJDK 64-Bit Server VM Corretto-8.222.10.1 (build 25.222-b10, mixed mode)
```
コーディング用フォント「 Cascadia Code」の紹介

VS CodeでMicrosoft社が開発した開発環境向けの等幅フォント「Cascadia Code」を使ってみたところ、Font Liguatureによって===や'>='の表示が非常にわかりやすくなった。特にJavaScriptやTypeScriptなどで頻繁に使用される===と==の違いや、!==と!=の違いを際立たせてくれるので、これらの言語を書く機会がある人は是非とも試してほしい。


# Cascadia Code

Cascadia CodeはMicrosoftが開発した開発環境向けの等幅フォントである。Windows Terminalでモダンなルック＆フィールを提供する目的で設計した。Windows Terminalの開発コードがCacadiaだったことから、この名称が付けられている。
リガチャー（合字）をサポートし、コードエディタや開発環境向けとしている。ライセンスはOpen Fontライセンスである。

# Font Liguature(合字)とは？
Font Ligature（以下、日本語で合字と表記する）とは2つ以上の文字を1つの文字に合体させたもので、記号をわかりやすく表示できる。
特に、プログラミングコードには多くの記号が必要なうえに、頻繁に組み合わせて使用するので、合字を使用できる利点は大きい。例えばJavaScriptでは、２つの値が同じかどうかを比較する等価演算子として、=を２つ並べて次のように記述する。


```
a == b
```
しかし、javascriptではややこしいことに、等価演算子==と厳密等価演算子===の２種類の等価演算子があり、間違えやすい。
そこで、1つの意味を1つの文字で表してコード全体の可読性向上を図るのが、合字である。合字を用いると、前述の等価演算子の違いは下記のように記述できる。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/237601/cc8519e7-b32f-26eb-8a1b-990033f14f84.png)

なお、合字はあくまで「フォントの見た目」を変えるだけであり、コードそのものを書き換えるわけではない。合字によってコードが書き換わってしまうことはないので安心してほしい。

#Cascadia Codeフォントをインストールする
1. https://github.com/microsoft/cascadia-code/releases からCascadia.ttfをダウンロードする。
2. ダウンロードしたファイルをクリックすると、Fontの表示画面が開くので、その画面にあるインストールボタンをクリックする。

#Visual Studio Codeで有効にする
1. メニューバーのFile > Preferences を選択して設定画面を表示する。
2. 設定画面左のText Editor > Font を選択する。
3. Font Familyの欄に'Cascadia Code', Consolas, 'Courier New', monospace　と入力する。
4. Font Ligaturesの欄にチェックを入れて有効にする。
5. VS Codeを再起動する。
dnmonsterで生成した画像データをiterm2上で表示してみる

## dnmonsterとは
githubの初期アイコンなどのランダムな画像はindenticonと呼ばれるみたい。
dnmonsterはindenticonを生成して返却してくれるNode.jsで作られたwebサーバ。
[amouat/dnmonster: Dockerised Node server for KevinGuadin's monsterids](https://github.com/amouat/dnmonster)
モンスターがかわいい。

## 実行環境
- macOS Mojave
- iterm2
- docker

## 試してみる

```shell

$ docker run -d -p 8000:8080 amouat/dnmonster
$ curl http::/localhost:8000/monster/sk8metal
�PNG

bKGD�������oIDAT8�c`C�\����*��Ĩe"d1bD�
�lb耑�!��X�b�2�a���D{�[葁.��P
                             g���^�zb$֕�
                                       řa��E
.��t!�+a��Q@]��R�\]��IEND�B`�%
```

PNGの画像データとして返ってきた。

## imgcatを用意する
iterm2で画像を表示するためにimgcatを用意する。

```shell

$ cd /usr/local/bin;wget "https://www.iterm2.com/utilities/imgcat";sudo chmod +x imgcat
```

## dnmonsterから返却された画像データを表示してみる
imgcatを利用してdnmonsterから返却された画像データをiterm2上で表示してみる。

```shell

$ curl http:/localhost:8000/monster/sk8metal | imgcat
```
![スクリーンショット 2019-10-12 14.40.15.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/57545/dad1afb6-b252-9192-b13c-0aff6cdb1815.png)

別のリクエストに変えると画像データも変わる。
![スクリーンショット 2019-10-12 14.43.49.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/57545/c034aaf0-c6ae-f46e-5748-6416564a6b09.png)

## 参考
- [【iTerm2】ターミナル上で画像を表示する方法 - Qiita](https://qiita.com/noraworld/items/ea59c37e48ac0977cc72)
文系大学生がアプリ開発よりも機械学習の方が自学自走しやすいと考える理由について

## はじめに
最近の風潮として、アプリの開発を一人で自学自走は頑張れば可能と言う考えが蔓延っていて、機械学習はなんか難しそうみたいな考え方があるように見受けられます。確かにアプリの開発を一人で自学自走する人はとてもすごいと思いますが、自分はアプリ開発を一人でやりきるのはとても難しく、また**機械学習の自学自走はそれに比べると難しくないと考えています**。

自分の感覚で言うと
・アプリ開発自走→天才じゃないと無理ゲー
・機械学習自走→頑張れば可能
という感じです（これは自分の感覚なので、個人差はあると思います）。

その理由について述べていきたいと思います。

##自分のそれぞれの経験について
まずその前に自分の（お前の経歴なんか興味ねえよって人はすっ飛ばして見て下さい）

###アプリ開発
・実際に去年の３月にtechcampさんの方に通って勉強→３ヶ月ほどやるもそこで挫折
・今年の３月にpreogate→railsチュートリアルの流れで勉強をするも、railsチュートリアルで挫折
###機械学習
・去年の末から初めて今のところ挫折なし
詳しくは以下を参照
https://qiita.com/HayatoYamaguchi/items/1c20595c5e6dac4530dc

こんな感じでやっています。確かに機械学習の方が本腰を入れて行なっていたという面だったり実際に一度アプリ開発でプログラミングを学んだ後だからというものもあるかもしれませんが、それを加味しても自分は機械学習の方が自学自走しやすいと考える理由をいかに述べたいと思います。


##1、参照するページが多く、さらに自分がどこまで反映させたのかがわかりにくい
プログラミング初心者あるあるとして、まずは写生をしますがこの写生内容は往々にして「,」と「.」のミスなどの文字やスペルミスや、括弧やendの位置などのミスが起こりやすいです。その中でエラーメッセージを見てみると、**そのメッセージが起きたサイトに言ってもエラーの根本的な原因はそのページではないなどのことが往々に発生します**（例えばビューファイルのエラーなのに実際はコントローラーの中の変数の受け取りに問題があるなど）。そのためエラーの発掘が自分では困難になり、挫折しやすいです。一方機械学習の場合は最初はクラス分けを行わなければjupyter notebookなどの**一つのファイルで完結します**。そのため、エラーの行を見ればその行や周辺を直せば大体のエラーは解決します。


##2、アプリ開発には必要な言語や概念が多すぎる
機械学習においてプログラミング面で必要なのはpythonやそれに付随する各種ライブラリ（numpy,pandas,sklearnなど）のみです。
しかし、アプリ開発を学ぼうとすると、例えばrailsだったらrailsチュートリアルを完遂して自分でポートフォリオを作ろうとすると、

・htmlcss
・ruby
・javascript
・SQL
・Git

などが必要で、データベースとの連携方法やさらにテストの実装についても理解も必要なことがあります。そのため何もやったことがない初心者が始めようとすると、「なんかごちゃごちゃしてるけど今は何をやればいいんだっけ、、、」という状態になりやすいです。


ここまで見ると機械学習の方がはるかに簡単そう、、、って思いそうなので、一応機械学習の方が難しい点も述べたいと思います。


##機械学習の方が難しい点について
###ある程度の数学や統計が必要である
アプリ開発にはほぼ一切数学の知識は求められません。
一方機械学習ではそうはいかず、ある程度アルゴリズムの中身を理解するとなると、大学基礎レベルの数学は必要になります。そのため数学アレルギーの人には厳しいです。

###論理的な式がより求められる
機械学習ではモデルを作る前にデータの変形などをする必要があります。そのため、「この条件の時にここを変形する」などの少し論理的なコードを書く力が必要です。例えばこれは自分の昔の記事から引っ張ってきたものですが、条件を指定して削除するなどの少し複雑なものになっています。これは簡単な例ですが、論理的な式を求められることが多いです。」

```python
Xmat = Xmat.drop(Xmat[(Xmat['TotalSF']>5) & (Xmat['SalePrice']<12.5)].index)
```


##終わりに
これはあくまでもサンプル数１の考え方ですが、実際にこのような考え方を投稿している人がいなかったので投稿させてもらいました。何をやるかを考えている人には参考にしてもらえると嬉しいです。
[docker for windows] docker-compose での　volumes のパス設定

## 結論
```env:.env
ROOT_PATH=/C/Users/ユーザー名/プロジェクト
```

を追記しdocker-compose.yamlでのvolumesの設定において

./\~~で書かれているところを${ROOT_PATH}/\~~に変換する．

```yaml:docker-compose.yaml
version: "3"
services:
  app:
    build:
      context: ./docker/php
    ports:
      - ${APP_PORT}:8000
    volumes:
      # - ./src:work これはダメ
      - ${ROOT_PATH}/src:/work
      - ${ROOT_PATH}/docker/php/php.ini:/usr/local/etc/php/php.ini
```

※今回のプロジェクトはCドライブ配下を想定しています．

## 理由
docker for windows では相対パスによる

```
./src:/etc/work　無理
```
volumes設定ができないようです．（できない理由は調査中）

単純に既存プロジェクトをインストールしてdocker-compose up -d するだけだとエラーを吐く場合があります．特にdocker for windowsを利用しているとそのあたりでのエラーが多くなってきます．

なので絶対パスで指定してあげる．
.envコピペするだけなので楽という話でした．
マッチングサービス開発者の目線で見た、良いサブスクリプション施策の研究

ただいま転職活動をしています。

レジュメを書いたり面接をしていく中で、「**仕組みが似てるかも**」と思い、マッチングアプリ（恋人が欲しい人向けのアプリ）を使って参考になりそうな知見を集めることにしました。

結果的に、転職活動に必要な知見を得ることはできませんでしたが、**サブスクリプション（ここでは月額課金をさせること）の参考になりそうな施策が見つかったので紹介します**。

ちなみに、どんなアプリを使ったかは明記しません。

また、自身はマッチングサービスを開発したことはありません。サービスを利用した結果、「**この施策はサービス提供する側になったときに使えそうだな**」と思ったことを書いています。

## どんな施策か
メッセージを送って相手からリプが来たときに、「**このリプを見るためには課金が必要です**」と表示して課金情報を表示させる施策です。

課金プランは1か月、3か月、6か月、12か月とあったのですが、「**マッチングが成立し、恋人が出来た会員は本アプリを平均4か月利用しています**」と書かれていました。

これらの情報を見て、「なるほどなぁ、上手くできているなぁ」と思ったのでした。

## なぜ良いと思ったか
このアプリは、**自分がメッセージを送って相手からリプを貰うまでに結構な労力が掛かる**のです。さらに、相手から返ってきたリプに返答するということで、**今まで自分が労力を掛けた結果マッチングしたという達成感**を強く醸成します。

まず、相手からリプを貰うまでにどんな労力が必要かを解説します。プロフィール登録をすると、「**モテ度チェック**」という機能が使えるようになります。プロフィール写真やプロフィールメッセージの文字数など、大きく６項目に分けて、それぞれAからCランクで評価する機能です。総合ランクがAになると、Bに比べてマッチング率が倍以上になるという文句を付けてヤル気を高めるわけです。

このアプリは、随所にこういった**定量情報を記載しているので、説得力があるのです**。こういう姿勢は見習いたいものです。

さて、６項目のすべてをA評価にするまでに自分は5日くらいかけました。時間にすると30時間くらいです。ここまで時間を掛けると、「さあやっとリプが貰えたぞ！」という、**「いざこれから」状態のときにいきなりお預けをくらったような感覚**になるわけですね。これは、なかなか良い訴求を相手にもたらすと思います。

「なるほど、課金が必要なのか。しかしメッセージのやり取りをしたいだけなら1か月プランでも充分かな」などと思っていると、上記の4プランが出てくるわけです。1か月は短すぎるから3か月でも良いと思わせておいて、「**いや、実はうまくいった人は4か月ですよ**」と2重に訴求してくるわけで、「なるほど、じゃあ6か月にしようかな」と思うようになります。ここが非常に巧みだと感じました。

3か月プランと6か月プランだと料金が2倍違うかというとそうではなく、7000円くらいお得になります。これがどのくらいマーケティング的な効果をもたらすかは研究してないので何とも言えません。

## まとめ
良い施策だと思ったポイントは4点です。

1. 「実際に相手と話せる」という、結果に訴求するシチュエーションまであと一歩というところで課金案内を出し、課金させやすくする
2. 課金プランとして「お試しプラン」的なプランを用意している
3. 課金プランとして「しっかりプラン」的なプランも用意している
4. 2と3のプランがあるので、ユーザは「そこそこプラン」的なプランを選ぶ可能性がある

大きく分けると、「あと一歩の状態をつくる」「その人の気持ちに合わせた選択肢がある」という点が良いかなと思います。
MacでSipeed Maixduinoの顔認識を動かす

#Sipeed社製Maixduino環境設定
MacでSipeed社製Maixduinoを動かす環境を立ち上げたので手順を残します。
![スクリーンショット 2019-10-12 14.29.05.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/512829/d3ccfc51-679a-840a-cb71-40f936693e96.png)
##Mac用ドライバーダウンロード&インストール
現時点での最新版。MacOS Mojave v10.14.6では動作した。
http://www.wch.cn/download/CH341SER_MAC_ZIP.html
インストールしてMac再起動
##ファームウェアと顔認識用のモデルダウンロード
https://github.com/sipeed/MaixPy/releases/tag/v0.3.2
以下２つをダウンロード
face_model_at_0x300000.kfpkg #モデル
maixpy_v0.3.2_full.bin #ファームウェア
##ファームウェアアップデート用ツール kflash_gui
https://github.com/sipeed/kflash_gui/releases/tag/v1.3.2
Pre-releaseがいくつかでているが、Mac対応版はこれが最新。インストール時にセキュリティのメッセージが出る場合は、Macのシステム環境設定→セキュリティとプライバシー→kflash_guiの実行許可を行う。
##Maixduino接続確認
ボードをMacとMaixduinoをケーブルで接続後、ターミナルを開いて以下を実行。
`screen /dev/cu.usbserial-xel_sipeed0 115200`

反応がない場合は ctrl-d を押すとソフトリブートする。以下のような画面がでれば接続OK。
![スクリーンショット 2019-10-12 13.58.03.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/512829/259cb621-5a6f-5f7d-9aa7-618b283c4af7.png)
##ファームウェアアップデート
**注）ターミナルを切り、ボード接続を外し、再度接続して通信初期化状態にする必要あり**
kflash_guiを立ち上げて以下のように設定。Open Fileでmaixpy_v0.3.2_full.binを選択しDownloadを押すとファームウェアのダウンロードとアップデートが走る。ダウンロード完了後にアップデートが行われるので、多少時間がかかる。
![スクリーンショット 2019-10-12 14.02.19.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/512829/a8f95ea6-28cb-bf88-ecb4-8f5e016b3775.png)
#顔認識を動かす
##顔認識用モデルダウンロード
flash_guiからOpen Fileでface_model_at_0x300000.kfpkgを選択。アドレスを指定する欄がなくなるが、このままで0x300000に書かれるので問題ない。
![スクリーンショット 2019-10-12 14.06.50.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/512829/95dc443e-fc1f-194a-494c-0d1b90d8f1fb.png)
##顔認識サンプルコード動作確認
ターミナルを開いて以下を実行（>>> が表示されている状態にする）
`screen /dev/cu.usbserial-xel_sipeed0 115200`

以下からサンプルコードをcmd-cでコピー
https://github.com/sipeed/MaixPy_scripts/blob/master/machine_vision/demo_find_face.py
↓
ターミナル上で ctrl-e #ペーストモード
↓
ターミナル上で cmd-v #スクリプトをペースト
↓
ターミナル上で ctrl-d #スクリプト実行

これで顔認識のPythonスクリプトが実行される。カメラで顔を写すとディスプレイ上の顔に□が表示され、且つボード上のLEDが点滅すれば成功。

ターミナル上で ctrl-c #終了
##他のサンプルコード
以下からサンプルコードを参照。上と同じ手順で実行できる。
https://github.com/sipeed/MaixPy_scripts
Shell Scriptの実行ディレクトリを取得する


１９５８年９月の狩野川台風に匹敵する規模台風19号がやってきて、避難命令が発令されたり、河川が溢れたり大変になっています。ラグビーワールドカップの試合も中止になったりと気持ちの面での被害が大きくなっています。

せっかく中心街のアーケード街で買い物でもしようかなと考えていたのに、電車も計画運休で動いていないので、仕方なく部屋でゴソゴソとパソコン触っています。

今回はShell Scriptをどこから呼び出しても、実行スクリプトの絶対パスを取得できる方法をいつも忘れてしまうので、覚書として残しておこうと思います。

# 環境

``` sh
$ uname -a
Linux ip-172-26-5-169 4.4.0-1074-aws #84-Ubuntu SMP Thu Dec 6 08:57:58 UTC 2018 x86_64 x86_64 x86_64 GNU/Linux
$ cat /etc/issue
Ubuntu 16.04.5 LTS \n \l
```

Ubuntu 16.04.5 です。

# 簡単な方法

もし１行で記述する場合は以下の書き方が楽ちんです。

``` sh
DIR="$( cd "$( dirname "$0" )" >/dev/null 2>&1 && pwd )"
echo "DIR is '$DIR'"
```

ただし、この方法はディレクトリがSymbolic linkでは対応していません。


# シンボリックリンクでも大丈夫な方法

``` sh
#!/bin/bash

SOURCE="$0"
while [ -h "$SOURCE" ]; do # resolve $SOURCE until the file is no longer a symlink
  DIR="$( cd -P "$( dirname "$SOURCE" )" >/dev/null 2>&1 && pwd )"
  SOURCE="$(readlink "$SOURCE")"
  [[ $SOURCE != /* ]] && SOURCE="$DIR/$SOURCE" # if $SOURCE was a relative symlink, we need to resolve it relative to the path where the symlink file was located
done
DIR="$( cd -P "$( dirname "$SOURCE" )" >/dev/null 2>&1 && pwd )"
echo "DIR is '$DIR'"
```

だいたいはこのスニペットで大丈夫だと思いますが、もし相対シンボリックリンクも対応したい場合は、下記の方法で取得します。

# 相対シンボリックパスも大丈夫な方法

``` sh
#!/bin/sh

SOURCE="$0"
while [ -h "$SOURCE" ]; do # resolve $SOURCE until the file is no longer a symlink
  TARGET="$(readlink "$SOURCE")"
  if [[ $TARGET == /* ]]; then
    echo "SOURCE '$SOURCE' is an absolute symlink to '$TARGET'"
    SOURCE="$TARGET"
  else
    DIR="$( dirname "$SOURCE" )"
    echo "SOURCE '$SOURCE' is a relative symlink to '$TARGET' (relative to '$DIR')"
    SOURCE="$DIR/$TARGET" # if $SOURCE was a relative symlink, we need to resolve it relative to the path where the symlink file was located
  fi
done
echo "SOURCE is '$SOURCE'"
RDIR="$( dirname "$SOURCE" )"
DIR="$( cd -P "$( dirname "$SOURCE" )" >/dev/null 2>&1 && pwd )"
if [ "$DIR" != "$RDIR" ]; then
  echo "DIR '$RDIR' resolves to '$DIR'"
fi
echo "DIR is '$DIR'"
```

エイリアス、`source`、`bash -c`、シンボリックリンクなどの任意の組み合わせで動作します。

ただし、このスニペットを実行する前に`cd`コマンドを利用して別のディレクトリに移動した場合、結果が間違っている可能性がありますので注意してください。

# 最後に

Ubuntuのデフォルトシェルは`bash`ではなく、`dash`だったんですね（汗

``` sh
$ readlink -f $(which sh)
/bin/dash
```

それを知らなかったので、`BASH_SOURCE[0]`を使うと`Bad substitution`と警告が表示されてしまった。

``` sh
$ sh publish.sh 
publish.sh: 7: publish.sh: Bad substitution
```

# 参考

* [Get the source directory of a Bash script from within the script itself - Stack Overflow](https://stackoverflow.com/questions/59895/get-the-source-directory-of-a-bash-script-from-within-the-script-itself?page=1&tab=votes#tab-top)
* [string - bash: Bad Substitution - Stack Overflow](https://stackoverflow.com/questions/20615217/bash-bad-substitution)
* [https://stackoverflow.com/questions/29832037/how-to-get-script-directory-in-posix-sh](https://stackoverflow.com/questions/29832037/how-to-get-script-directory-in-posix-sh)
Laravel の Controller を Web と API で使いまわす

ベタに。サーバーサイドレンダリングで返す View と、axios で、API呼び出ししたいのと、ほとんど、Controller が同じだったので、api のときは、JSONを、web のときは View を返したかったのだけど、isApi() てきなメソッドがみつからなかったから、つくってみた。

※ もし、違うオフィシャルな実装があれば、教えてやってくださいませ。

基底クラスのコントローラーに isApi() を実装。

"api" ってパス名は、Laravel は、とりあえず定数化とかされていないから、ベタで。

```php:/app/Http/Controllers/Controller.php
<?php

namespace App\Http\Controllers;

use Illuminate\Foundation\Auth\Access\AuthorizesRequests;
use Illuminate\Foundation\Bus\DispatchesJobs;
use Illuminate\Foundation\Validation\ValidatesRequests;
use Illuminate\Routing\Controller as BaseController;

class Controller extends BaseController
{
    use AuthorizesRequests, DispatchesJobs, ValidatesRequests;

    function isApi()
    {
        $paths = explode("/", request()->path());
        return $paths[0] == "api";
    }
}
```

利用するコントローラーでは、こんなかんじで、戻り値を切り替える。

```php:/app/Http/Controllers/HogeController.php

<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;

class HogeController extends Controller
{
    public function index()
    {
        // データを取得するなどの処理
        $hoges =  [];

        if ($this->isApi()) {
            return $hoges;
        } else {
            return view('hoge.index', ['hoges' => $hoges]);
        }
    }
}

```
UIVisualEffectViewを使ってUIVibrancyEffectだけを表示する

#はじめに

###UIVisualEffectViewとは

UIVisualEffectViewは背後にあるViewにエフェクトをかけてくれるViewです。

UIVisualEffectViewにはBlurEffectとVibrancyEffectがあります。

Blur：背後のViewにエフェクトをかけることによって、磨りガラス様な感じになります

Vibrancy：UIBlurEffectのViewの上に置くことによって。曇りガラスの様になります。

使うときはUIVisualEffectViewにaddSubviewしないで、UIVisualEffectView.contentViewに追加します

iPhoneでパスコード入力画面や、コントロールセンターで使われており、以下のパスコード入力画面では、背景がBlurEffectでNumberButtonの背景がVibrancyEffectになっています。

<img width="375" alt="IMG_7521.PNG" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/300780/f8e88227-229a-e2a2-321b-3db2cc075a1c.png">


今回はUIBlurEffectは表示せず、UIVibrancyEffectだけ表示してみよう思います。


#やってみる


まずはImageViewの上にVisual Effect View with Blur and Vibrancyを置いてみます。


<img width="679" alt="スクリーンショット 2019-10-12 12.37.32.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/300780/59740608-c05c-dff8-b935-d8b8ac1278d2.png">

そうすると磨りガラス効果のViewと曇りガラス効果のViewが一気に展開されます。

<img width="1135" alt="スクリーンショット 2019-10-12 13.01.56.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/300780/d8fdbf58-ad5f-366a-7b57-6985e265209d.png">


そこにTextなどを入れると、この様な曇りガラスのテキストになります

<img width="1143" alt="スクリーンショット 2019-10-12 13.43.53.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/300780/8e91dbc1-f3f7-3406-8464-d81442558cfa.png">

ここからUIVibrancyEffectがかかったTextだけを表示していきたいと思います
方法としてはBlurEffectViewにmaskをかけていきます、

```swift:
var mask: UIView? { get set }
```

maskはUIView型なので、UIImageViewやUIViewなど色々な物をUIVibrancyEffectだけを表示ことが可能です


```swift:
class CatalinaViewController: UIViewController {
	
	@IBOutlet weak var text: UILabel!
	@IBOutlet weak var blurEffectView: UIVisualEffectView!
	
	override func viewDidLoad() {
		super.viewDidLoad()
		// Do any additional setup after loading the view.
		self.blurEffectView.mask = text
	}
}
```




アプリを実行すると・・・・・・・・・できました！！

![Simulator Screen Shot - iPhone 11 Pro - 2019-10-12 at 13.52.06.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/300780/bdb36a6e-dd7f-a52e-d121-9c2bd3cc0bed.png)


#参考リンク

[UIVisualEffectView](https://developer.apple.com/documentation/uikit/uivisualeffectview)
簡単 Windows よく使うアプリをショートカットに登録して起動

#はじめに　　（初投稿）
普段windowsで作業しているとき、アプリの起動に以下の手順を踏んでいる方もいる思います
####1.アプリをインストール
####2.ショートカットをデスクトップに作成
####3.クリックしてアプリ起動

しかし、例えばChromeを開いた状態で「ゲームしたい」「エディターを開きたい」となったとき、
ブラウザの最小ボタンを押す⇒デスクトップを表示する⇒アプリをクリックして起動という手順になり
手間が増えると思います。

開いているものが多いほど、手間が増えて**めんどくさい！！**
**デスクトップを表示しなくてもアプリを起動したい！！**

####本稿ではWindows10の標準機能でアプリのショートカット起動を紹介します
**（ツールなどインストール不要）**

#本題
- 環境
    - Windows10

windowsキー + r　を押下すると「ファイル名を指定して実行」ウィンドウが開きます
標準機能で「notepad」と入力するとメモ帳を開けます
この機能を使って任意のアプリを起動する方法を紹介します
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/512781/8e535544-3154-cdb2-11ff-c092e4cf3142.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/512781/d69943c7-68c4-1947-57d5-5be7c00f0baf.png)
最初から使えるコマンド 一部
・ メモ帳             notepad
・ Excel             excel
・ Word              winword
・ 電卓              calc
・ コマンドプロンプト cmd
・ ペイント          mspaint

####Visual Studio Codeをショートカット登録してみる
デスクトップ上のショートカットをコピー
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/512781/83da9b6f-884d-64eb-4e69-f439c7db76b8.png)
C:\Windows\System32 に配置する
管理者権限のポップアップは「続行」を押下する
![qita_system_dir.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/512781/62530e5f-a3c9-adbd-def7-484b0d0d8490.png)
![qita_drop_shortcut.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/512781/3a015160-354a-e74d-ec82-86ddf7dd9817.png)
F2キーを押下して呼び出しやすい名前にする
本稿では例として「vscode」に変更する
![qita_name_change.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/512781/95140f32-e04c-d414-3ff9-fc7b286b5c57.png)
管理者権限系は「続行」や「OK」をする
![qita_vscode_pop.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/512781/667be9c0-af70-6d81-61a7-4fdb730a77d5.png)
名前が変更されていることを確認
![qita_after_name_change.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/512781/70d47acc-ad30-38b3-44b4-45cb82f8128c.png)
windowsキー + r　を押下し、上記でつけた名前を入力する「vscode」
入力後EnterでVisual Studio Codeが起動する
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/512781/86905230-c2d1-45b1-05c2-dc2b525819fa.png)
![qita_open_vscode.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/512781/b2769f3d-a8d1-9cab-deb6-dc2d8f8fc413.png)

以上。少しでも生産性向上につながれば幸いです。
EC2のLaravel6.0環境でVue+Rest APIを連携する　AWS/Laravel連載(10)

# はじめに

前回の記事でLaravelでREST APIを作りました。

[EC2のLaravel6.0環境でRest APIを準備する　AWS/Laravel連載(9)](https://qiita.com/rf_p/items/a79b038fdea63b0ac5cb)

今回はAPI経由で投稿一覧表示部分をVue.js+axiosで実装します。

# Vue, axiosを入れる

Laravelのpackage.jsonは最初からVue.jsとaxiosが入っているのでnpm installだけでOKです。

```powershell
$ npm install
```

Vue部分を書きます。

```javascript:resources/js/app.js
...
const app = new Vue({
  el: '#app',
  data: {
    posts: []
  },
  methods: {
    fetchPosts: function(){
      axios.get('/api/posts').then((res)=>{
        this.posts = res.data
      })
    }
  },
  created() {
    this.fetchPosts()
  },
});
```

上記保存したらビルドが必要です。

```powershell
$ npm run dev
```

終わるとpublic/js/app.jsに書き出されます。

# viewを修正

```php:resources/views/home.blade.php 
@extends('layouts.app')

@section('content')
<div class="container">
    <div class="row justify-content-center">
        <div class="col-md-8">
            <div class="card">
                <div class="card-header">Dashboard</div>

                <div class="card-body">
                    @if (session('status'))
                        <div class="alert alert-success" role="alert">
                            {{ session('status') }}
                        </div>
                    @endif

                    @{{ posts.total }}件
                    <table class="table">
                        <thead>
                            <tr>
                            <th>ID</th>
                            <th>タイトル</th>
                            <th>本文</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr v-for="post in posts.data" v-bind:key="post.id" v-cloak>
                                <td>@{{ post.id }}</td>
                                <td>@{{ post.title }}</td>
                                <td>@{{ post.content }}</td></td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection
```

v-forはVue.jsでのfor文です。
app.jsの中で、APIから取ってきた投稿一覧（ページャー付き）をpostsという変数に入れています。
posts.dataの中身（配列）をループしpostという変数に入れ、件数分を表示しています。

連載10.5回という形で、Vueの開発がしやすくなるツールを紹介しています。
ぜひご確認ください。
[EC2のLaravel6.0環境 VueとLaravelでのTIPS　AWS/Laravel連載(10.5)](https://qiita.com/rf_p/items/963553a83e13f776f02d)


この記事の参考：
[Laravel × Vue.js × axiosでTODOリストを作るよ！ その1
](https://tonyo.design/program/vue-js/todo-list_with_laravel_vue_axios_no1/)
ずんだの1桁足し算問題 Node.js編

[ずんだの1桁足し算問題 Ruby編](https://qiita.com/tbpgr/items/6c75930566dda97bb5b6)

↑ `Node.js` で書いたものです(=ﾟωﾟ)ﾉ

ちなみに, ずんだ成分ゼロです
※ずんだ＝ずんだまるさん = https://twitter.com/edamametsubu318

## コード

```js
const numberArray = [...Array(9).keys()].map(i => ++i)
// これはなくても動く
let total

numberArray.forEach(i => {
   numberArray.forEach(j => {
      total = (i+j)
      console.log(`${i}+${j}=${"~".repeat(total)} ${total}`)
   })
})
```

## 出力

```
1+1=~~ 2
1+2=~~~ 3
1+3=~~~~ 4
1+4=~~~~~ 5
1+5=~~~~~~ 6
1+6=~~~~~~~ 7
1+7=~~~~~~~~ 8
1+8=~~~~~~~~~ 9
1+9=~~~~~~~~~~ 10
2+1=~~~ 3
2+2=~~~~ 4
2+3=~~~~~ 5
2+4=~~~~~~ 6
2+5=~~~~~~~ 7
2+6=~~~~~~~~ 8
2+7=~~~~~~~~~ 9
2+8=~~~~~~~~~~ 10
2+9=~~~~~~~~~~~ 11
3+1=~~~~ 4
3+2=~~~~~ 5
3+3=~~~~~~ 6
3+4=~~~~~~~ 7
3+5=~~~~~~~~ 8
3+6=~~~~~~~~~ 9
3+7=~~~~~~~~~~ 10
3+8=~~~~~~~~~~~ 11
3+9=~~~~~~~~~~~~ 12
4+1=~~~~~ 5
4+2=~~~~~~ 6
4+3=~~~~~~~ 7
4+4=~~~~~~~~ 8
4+5=~~~~~~~~~ 9
4+6=~~~~~~~~~~ 10
4+7=~~~~~~~~~~~ 11
4+8=~~~~~~~~~~~~ 12
4+9=~~~~~~~~~~~~~ 13
5+1=~~~~~~ 6
5+2=~~~~~~~ 7
5+3=~~~~~~~~ 8
5+4=~~~~~~~~~ 9
5+5=~~~~~~~~~~ 10
5+6=~~~~~~~~~~~ 11
5+7=~~~~~~~~~~~~ 12
5+8=~~~~~~~~~~~~~ 13
5+9=~~~~~~~~~~~~~~ 14
6+1=~~~~~~~ 7
6+2=~~~~~~~~ 8
6+3=~~~~~~~~~ 9
6+4=~~~~~~~~~~ 10
6+5=~~~~~~~~~~~ 11
6+6=~~~~~~~~~~~~ 12
6+7=~~~~~~~~~~~~~ 13
6+8=~~~~~~~~~~~~~~ 14
6+9=~~~~~~~~~~~~~~~ 15
7+1=~~~~~~~~ 8
7+2=~~~~~~~~~ 9
7+3=~~~~~~~~~~ 10
7+4=~~~~~~~~~~~ 11
7+5=~~~~~~~~~~~~ 12
7+6=~~~~~~~~~~~~~ 13
7+7=~~~~~~~~~~~~~~ 14
7+8=~~~~~~~~~~~~~~~ 15
7+9=~~~~~~~~~~~~~~~~ 16
8+1=~~~~~~~~~ 9
8+2=~~~~~~~~~~ 10
8+3=~~~~~~~~~~~ 11
8+4=~~~~~~~~~~~~ 12
8+5=~~~~~~~~~~~~~ 13
8+6=~~~~~~~~~~~~~~ 14
8+7=~~~~~~~~~~~~~~~ 15
8+8=~~~~~~~~~~~~~~~~ 16
8+9=~~~~~~~~~~~~~~~~~ 17
9+1=~~~~~~~~~~ 10
9+2=~~~~~~~~~~~ 11
9+3=~~~~~~~~~~~~ 12
9+4=~~~~~~~~~~~~~ 13
9+5=~~~~~~~~~~~~~~ 14
9+6=~~~~~~~~~~~~~~~ 15
9+7=~~~~~~~~~~~~~~~~ 16
9+8=~~~~~~~~~~~~~~~~~ 17
9+9=~~~~~~~~~~~~~~~~~~ 18
```

おもろかったし, node というか JavaScript の復習になった.

ではでは(=ﾟωﾟ)ﾉ
CentOS 8にOpenJDK 11をインストール（Amazon Corretto）

# はじめに

Amazon Correttoを利用してCentOS8にOpenJDK11をインストール
親記事：[OpenJDKの各種インストール方法とEOLまとめ](https://qiita.com/witchcraze/items/b179202216aab50b7090)
参考：[Debian ベースおよび RPM ベースの Linux ディストリビューションで Amazon Corretto 11 をインストールする手順 - Amazon Corretto](https://docs.aws.amazon.com/ja_jp/corretto/latest/corretto-11-ug/generic-linux-install.html)

## サポート

本手法で導入した場合、[よくある質問 - Amazon Corretto | AWS](https://aws.amazon.com/jp/corretto/faqs/)より、2027-09がEOLになると思われる。
それ以降に報告された脆弱性や不具合への対応は実施されない可能性がある。

## LOG

### インストール

[Amazon Corretto 11 のダウンロード - Amazon Corretto](https://docs.aws.amazon.com/ja_jp/corretto/latest/corretto-11-ug/downloads-list.html)より適切なファイルを確認。
リンク先のファイルが古いときは[英語版ページ](https://docs.aws.amazon.com/corretto/latest/corretto-11-ug/downloads-list.html)を参照。

```shell-session
# cat /etc/redhat-release
CentOS Linux release 8.0.1905 (Core)

# yum install -y https://xxxx/11.xxxx/java-11-amazon-corretto-devel-11.xxxx.rpm
# yum install -y which
... 略
```

### 各種確認

```shell-session
# which java
/usr/bin/java

# java -version
openjdk version "11.0.3" 2019-04-16 LTS
OpenJDK Runtime Environment Corretto-11.0.3.7.1 (build 11.0.3+7-LTS)
OpenJDK 64-Bit Server VM Corretto-11.0.3.7.1 (build 11.0.3+7-LTS, mixed mode)
```
apt-key del するときのIDは最後8文字

apt-keyはapt用のGPG公開鍵を管理するコマンドです。3rd partyのリポジトリを追加するときなどに利用します。

ところで、誤って登録してしまった公開鍵を消すのに意外と苦労したので紹介します（apt-key listの出力が昔と変わっていて、古い情報がヒットしてしまった可能性がありそう）


## 消し方

登録済みの公開鍵を削除するコマンドは次の形式になります。

```
# apt-key del <keyid>
```

このkeyidというのは、finger printの最後の8文字のことです。

```
$ sudo apt-key list
/etc/apt/trusted.gpg
--------------------
...

pub   rsa2048 2017-02-20 [SC]
      9DD9 479D 06BA A713 2280  3AC1 6633 2B78 417E 73EA
uid           [ unknown] Hatena Co., Ltd. <admin@mackerel.io>

...

```

上記の鍵は次のように削除できます。

```
$ sudo apt-key del 417E73EA
OK
```


## ネタ元

- [debian \- How to identify gpg key IDs so they may be deleted \- Unix & Linux Stack Exchange](https://unix.stackexchange.com/questions/420961/how-to-identify-gpg-key-ids-so-they-may-be-deleted)
CentOS 8にOpenJDK 8をインストール（Amazon Corretto）

# はじめに

Amazon Correttoを利用してCentOS8にOpenJDK8をインストール
親記事：[OpenJDKの各種インストール方法とEOLまとめ](https://qiita.com/witchcraze/items/b179202216aab50b7090)
参考：[Debian ベースおよび RPM ベースの Linux ディストリビューション用の Amazon Corretto 8 のインストール手順 - Amazon Corretto](https://docs.aws.amazon.com/ja_jp/corretto/latest/corretto-8-ug/generic-linux-install.html) 

## サポート

本手法で導入した場合、[よくある質問 - Amazon Corretto | AWS](https://aws.amazon.com/jp/corretto/faqs/)より、2026-05がEOLになると思われる。
それ以降に報告された脆弱性や不具合への対応は実施されない可能性がある。

## LOG

### インストール

[Amazon Corretto 8 のダウンロード - Amazon Corretto](https://docs.aws.amazon.com/ja_jp/corretto/latest/corretto-8-ug/downloads-list.html)より適切なファイルを確認。
リンク先のファイルが古いときは[英語版ページ](https://docs.aws.amazon.com/corretto/latest/corretto-8-ug/downloads-list.html)を参照。

```shell-session
# cat /etc/redhat-release
CentOS Linux release 8.0.1905 (Core)

# yum install -y https://xxxx/8.xxxx/java-1.8.0-amazon-corretto-devel-1.8.0_xxxx.rpm
# yum install -y which
... 略
```

### 各種確認

```shell-session
# which java
/usr/bin/java

# java -version
openjdk version "1.8.0_222"
OpenJDK Runtime Environment Corretto-8.222.10.1 (build 1.8.0_222-b10)
OpenJDK 64-Bit Server VM Corretto-8.222.10.1 (build 25.222-b10, mixed mode)
```