OmniAICreator/Qiita-1.07M huggingface dataset:
Herokuで今までアップしたアプリを整理する。

コードを触り始めて半年が過ぎました。
作ってはアップし、作ってはアップし・・・を繰り返し、Herokuを見てみればもうどれがどのアプリなのか分からなくなりましたｗ

なので今回は、アップしたアプリの整理をしたのでその時に使ったコマンドなどを紹介します。

やった事としては、以下４点になります。

・アプリの一覧を参照
・各アプリの詳細情報
・いらないアプリは削除。
・いるアプリはURLをリネームしておく。

## 各コマンド

※コマンドラインになります。実行環境はWindouws10でpowershellを使っています。

```powershell:アプリの一覧を参照
heroku apps
```

```powershell:各アプリの詳細情報
heroku info -app 【アプリの名前】
```

```powershell:アプリ削除
heroku apps:destroy --app 【アプリの名前】 --confirm 【アプリの名前】
```

```powershell:URLをリネーム
heroku rename 【新しいアプリの名前】 --app 【アプリの名前】
```

## コマンド実行例

以下の実行例とイメージを参考にして下さい。

```powershell:実行例
PS C:\Users\MGT-RD18\git\PFCblanser> heroku apps
=== xxx@gmail.com Apps
affiliate-sample
js-validation-sample
js-validation-sample2
jsp-servlet-test-app
pfcbalancer
restoreheart6312
wether-app-use-api
yj2222

PS C:\Users\MGT-RD18\git\PFCblanser> heroku info -app js-validation-sample2
=== js-validation-sample2
Addons:         cleardb:ignite
Auto Cert Mgmt: false
Dynos:          web: 1
Git URL:        https://git.heroku.com/js-validation-sample2.git
Owner:          masjima2712@gmail.com
Region:         us
Repo Size:      3 MB
Slug Size:      81 MB
Stack:          heroku-18
Web URL:        https://js-validation-sample2.herokuapp.com/
PS C:\Users\MGT-RD18\git\PFCblanser>
PS C:\Users\MGT-RD18\git\PFCblanser> heroku rename js-validation-sample-ver2 --app js-validation-sample2
Renaming js-validation-sample2 to js-validation-sample-ver2... done
https://js-validation-sample-ver2.herokuapp.com/ | https://git.heroku.com/js-validation-sample-ver2.git
 !    Don't forget to update git remotes for all other local checkouts of the app.
PS C:\Users\MGT-RD18\git\PFCblanser>                                                                                                                                        PS C:\Users\MGT-RD18\git\PFCblanser> heroku apps                                                                                                                            === masjima2712@gmail.com Apps
affiliate-sample
js-validation-sample
js-validation-sample-ver2
jsp-servlet-test-app
pfcbalancer
restoreheart6312
wether-app-use-api
yj2222

PS C:\Users\MGT-RD18\git\PFCblanser> heroku apps:destroy --app js-validation-sample-ver2 --confirm js-validation-sample-ver2                                                Destroying ⬢ js-validation-sample-ver2 (including all add-ons)... done
PS C:\Users\MGT-RD18\git\PFCblanser>                                                                                                                                        PS C:\Users\MGT-RD18\git\PFCblanser>  
```


<img width="960" alt="heroku-app-delete.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/420031/b65fac5a-bbfe-40d2-6910-c91e8061ee16.png">


以上になります。ぜひ参考にして下さい。
MySQL/PostgreSQLバージョン別利用できるプロダクト (Alibaba Cloud)

MySQLのDBエンジンのバージョンで、Alibaba Cloudの使えるマネージドデータベースプロダクトが変わってくるのでリストにしてみたよ。（Alibaba Cloud International ベース）

コンソールベースで確認したのでドキュメントよりも新しいです。（2020年1月21日現在）

| Engine        |RDS Basic |RDS HA| RDS Enterprise |POLARDB|
|:-------------:|:-----:|:-----:|:-----:|:-----:|
| MySQL8.0      |   ○   |   ○   |   ○   |   ○   |
| MySQL5.7      |   ○   |   ○   |   ○   |   ×   |
| MySQL5.6      |   ×   |   ○   |   ○   |   ○   |
| MySQL5.5      |   ×   |   ○   |   ×   |   ×   |

| Engine        |RDS Basic |RDS HA| POLARDB|
|:-------------:|:------:|:-----:|:-----:|
| PostgreSQL 12  |   ○   |   ×   |   ×   |
| PostgreSQL 11  |   ○   |   ○   |   ○   |
| PostgreSQL 10  |   ○   |   ○   |   ×   |
| PostgreSQL 9.4 |   ×   |   ○   |   ×   |


ApsaraDB for RDS edition overview
https://www.alibabacloud.com/help/doc-detail/55665.htm
(2020年1月21日現在最新に追いついてない様子)

ApsaraDB for POLARDB
https://www.alibabacloud.com/ja/products/apsaradb-for-polardb
本番環境のデータベースを書き換える(DB破壊系の処理）

ローカル環境ではちゃんと表示出来ているのに本番環境でページが表示されない！

[![Image from Gyazo](https://i.gyazo.com/5f1861010d78152290725de954a35392.png)](https://gyazo.com/5f1861010d78152290725de954a35392)

がーん！！！

他のページは表示されてるのに・・・

気を取り直して、状況を整理して原因を特定してみる

1,デプロイ自体は上手くいっている？　ので他のページは表示されている

2,特定のページだけ表示されていない

３、しかしローカルではちゃんと表示されている（ここ重要）

以上から　なんとな〜く　特定のページに対して　ローカルと本番環境で何か相違が起きてると想像する。

例えばbundler のバージョンが　ローカルと本番環境で異なっている場合　全体のデプロイが上手くいかないはずなので　おそらく該当のページに対して　何らかのエラーなんだろうな〜

と考えてみても仕方ないので　catコマンドでproductionログを見てみることにする

```
cat /var/www/（アプリ名）/current/log/production.log
```
膨大なログをずーーーーっと眺めていると・・・

[![Image from Gyazo](https://i.gyazo.com/7fa290cfe8e1cdd1aaa6a4777de3481c.png)](https://gyazo.com/7fa290cfe8e1cdd1aaa6a4777de3481c)

あっ　FATAL（エラー）表示を発見した。

ふむふむ　「商品の状態」　近辺でエラー発生とな
商品の状態ってここのことですな
[![Image from Gyazo](https://i.gyazo.com/8120dd267d13692c9a8eb02bdaf55fe8.gif)](https://gyazo.com/8120dd267d13692c9a8eb02bdaf55fe8)

あーこの表示作って　データを送信出来るようにモデルとマイグレーションファイル修正したわ〜　
と思い　
[![Image from Gyazo](https://i.gyazo.com/f6743029340b13a936d8bcc9443c0ae3.png)](https://gyazo.com/f6743029340b13a936d8bcc9443c0ae3)
:status　って　カラム名:state　を変更したんだっけな　あとint型に変更したな〜　と思いつつ

# ここで気が付いた！
# 本番環境のデータベースそのままやんけ　と。

すぐに本番環境のmysqlを確認

```　
mysql -u root -p
```
データベースを見る

```
show databases;
```
データベースを指定して

```
use データベース名_production;
```
テーブルを確認

```
show tables;
```
テーブルの中身を確認

```
show columns from テーブル名;
```
で確認しました

# あった

:statusに変えたはずのカラムが本番環境では　:stateのままでした。

ローカル環境と本番環境でテーブルの中身が違うと本番環境では正しく表示されない　

# 原因特定に成功した

では次にどうするか　
本番環境でrails db:migrate　を繰り返しても全然migrateされない

ま〜考えてみれば本番環境のデータベースが簡単にポンポン書き換えされちゃったら混乱するだけだから　もうちっとmaigrateの方法を考えねば。

で僕が　取った方法は　
# 本番環境のDBを一旦リセットして　もう一度作り直す！

# うぉおおおおおーーーー！やってやんぜ！　本番環境のDBをぶっ壊す！

状況説明が長くなりましたが　ここから本題

本番環境のデータベースをリセットする

```
RAILS_ENV=production DISABLE_DATABASE_ENVIRONMENT_CHECK=1 bundle exec rake db:drop
```
ポイントです
意図的にproduction environmentのDBを破壊したい場合は、
環境変数 DISABLE_DATABASE_ENVIRONMENT_CHECK=1指定してあげればOKです。

DBの破壊系はコマンド実行を防止する機能がRails5以降は装備されているため
db:drop
db:drop:all
db:purge
db:purge:all
db:purge:test
db:schema:load
のコマンドはDISABLE_DATABASE_ENVIRONMENT_CHECK=1が必要です


本番環境のDBの破壊に成功した後は　DBを作り直す作業

```
rails db:create RAILS_ENV=production
```
本番環境でマイグレーション

```
rails db:migrate RAILS_ENV=production
```
これでOK！
[![Image from Gyazo](https://i.gyazo.com/e1640b366513734e2fd5edafa5ecf6b1.png)](https://gyazo.com/e1640b366513734e2fd5edafa5ecf6b1)

無事本番環境のデータベース再構築完了です。
Expo × React NativeアプリをAndroidで動かした時、TouchableOpacityのonPressが動かない

Expo × React NativeアプリをAndroidで実機確認した時、TouchableOpacityのonPressが動かなかったので共有します。

# 環境

expo v3.11.7
react-native v36.0.0

# 解決方法

```index.js
import { TouchableOpacity } from 'react-native-gesture-handler';
```

としていたところを

```index.js
import { TouchableOpacity } from 'react-native';
```

としたら治りました。
CentOS7でPHP + facebook/php-webdriverでchromeを動かしてクローリング

#背景
ある日、クローラが必要になった :smirk:

調べてみると、なんとなくPython + Selenium が主流なのかな... :open_mouth:

普段 Laravelを使っているし、PHPでなんとかしたいなぁ...
と、さらに調べたら、以下の組み合わせでいけそう :thumbsup_tone2:

```facebook/php-webdriver``` + ```chrome driver```

一度Laravel duskも入れてみましたが、きっと似たような構成かと思われます。
今回はテスト用でもないので、facebook/php-webdriverのみ入れて使ってみました :ok_woman:

今回は、その環境構築の手順メモです :writing_hand_tone2:

#手順
##試した環境
CentOS 7.7
##1.Chromeのインストール

```console
$ sudo yum install https://dl.google.com/linux/direct/google-chrome-stable_current_x86_64.rpm
```

バージョン確認 :point_up_2_tone2:

```console
$ google-chrome --version
Google Chrome 79.0.3945.130 
```
できましたね :wink::metal_tone2:

##2.ChromeDriverのインストール
Chromeをリモート操作するため、まずはChromeDriverを入手します。

▼ ChromeDriver - WebDriver for Chrome
https://sites.google.com/a/chromium.org/chromedriver/downloads

ChromeDriverはChromeのバージョンに合わせないとエラーが起きるようでした :angel:
今回は「Google Chrome 79」用に下記を取得です。

```console
$ wget https://chromedriver.storage.googleapis.com/79.0.3945.36/chromedriver_linux64.zip
$ unzip chromedriver_linux64.zip
$ sudo mv chromedriver /usr/local/bin/
```

##3.php-webdriverのインストール

▼php-webdriver
https://github.com/php-webdriver/php-webdriver

これは普通にcomposerでプロジェクトに追加です :slight_smile:

```console
composer require php-webdriver/webdriver
```

とりあえず、準備は以上であります:muscle_tone2:

##補足
上記でスクリーンショット撮影のサンプルを作ったら、取得したキャプチャの日本語が文字化けしていたので、フォントを追加 :point_up_tone2:

```console
sudo yum -y install ipa-gothic-fonts ipa-mincho-fonts ipa-pgothic-fonts ipa-pmincho-fonts
fc-cache -fv
```

文字化けというか、フォントがなければ、それはそうですね・・・ :sweat_smile:
花粉症LINE BotからのデータをWEBカレンダーに表示する（花粉カレンダー作成④）

##概要

耳鼻咽喉科の開業医をしています。
花粉症の患者さんに使ってもらえるような花粉飛散情報が分かるカレンダーアプリを作りたいと思っています。
これまでカレンダーを表示して予定を入れることと、ユーザー認証の実装、LINEのデータをFirebaseに貯めるところまで行ってきました。
[Vue.js×FullCallendarでWEBカレンダー作成（花粉カレンダー作成①）](https://qiita.com/doikatsuyuki/items/344b61459977a7ee2eff)
[Auth0で簡単にユーザー認証を実装（花粉カレンダー作成②）](https://qiita.com/doikatsuyuki/items/ebdf27cd0322f0cff3ab)
[花粉症LINE Botのデータをnode.jsを使ってFirebaseに出し入れする（花粉カレンダー作成③）](https://qiita.com/doikatsuyuki/items/3a2a34209bcd0ca1cfbf)

今回はLINEBotのデータが記録されているFirebaseのdatabaseのデータをカレンダーに表示することに挑戦しました。

LINEBotの記事はこちら　
[花粉症の重症度を判定し自分に合う市販薬を教えてくれるLINE Botの作成](https://qiita.com/doikatsuyuki/items/767ebd22a3e6d5d39d33)

##完成動画
https://youtu.be/FKGfKFKBq_U

##作成
**１．FirebaseのRealtime Databaseの確認**

LINEのデータはFirebaseのRealtime Databaseに記録されています。
データは以下のように収納されています。


![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/453374/b2b2f00c-c022-f51a-3b0a-3d4c0c928625.png)

今回は以下の情報を取得して重症度や薬剤名、緯度経度をリアルタイムでカレンダーに記入していきたいと思います。
・postback.data（花粉症の重症度や使用している薬剤の情報）
・postback.params.datatime(重症度判定を行った日や薬剤使用開始した日の情報）
・sorce.userID（LINEのユーザーID）
個別の花粉飛散情報を表示するため
・message.latitude（ユーザー位置情報　緯度）
・message.latitude（ユーザー位置情報　経度）

データは.(ドット）で深堀していくことができるようです。

**2.実装**

以前作成したCalendar.vueに追記していきます。
[Vue.js×FullCallendarでWEBカレンダー作成（花粉カレンダー作成①）](https://qiita.com/doikatsuyuki/items/344b61459977a7ee2eff)


methods: {　}の中に以下を追記します。
緯度や経度は本当はデータが取得できるだけでいいのですが、今回は本日の日付で表示してみました。

```js
childAdded(snap) {
      const message = snap.val();
      const mes = message.events[0];

      if (mes.type == "postback") {
        console.log(mes.postback.data);
        console.log(mes.postback.params.datetime);
        console.log(mes.source.userId);        

        this.calendarEvents.push({
          title: mes.postback.data,//重症度や薬剤
          start: mes.postback.params.datetime,
          end: mes.postback.params.datetime
        });
      }
      if (mes.type == "message") {        
        if(mes.message.type=="location"){
        console.log(mes.message.latitude);
        console.log(mes.message.longitude);
        userlat = mes.message.latitude;// 緯度
        userlong = mes.message.longitude;//経度
        };      
        this.calendarEvents.push({
          // title: mes.message.text,
          title: `緯度${userlat}`,
          start: "2020-01-19T09:00:00",
          end: "2020-01-19T10:30:00"
        },
        {
          title:`緯度${userlong}`,
          start: "2020-01-19T09:00:00",
          end: "2020-01-19T10:30:00" 
        }
        );
      }
    },
```

 async created() { }の中に以下を追記して完成です。

```js
 const ref_message = firebase.database().ref("protoout/studio/messageList");
 //新しいメッセージ2件だけ表示する
 ref_message.limitToLast(2).on("child_added", this.childAdded);
```

LINEから位置情報を送ると緯度と経度が表示されます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/453374/8ac241b6-fe5f-b75c-1035-3c1a0919c46d.png)


##考察
Firebaseのデータをカレンダーに表示することが出来ました。
次は気象APIから花粉情報を表示できるようにしたいと思います。
Zeitの最強ホスティングサービスnowのDNS設定にレコードを追加する方法

今回始めてNext.jsアプリをnowにデプロイしました。

nowでは簡単に独自ドメイン設定ができるので、お名前どっとこむで取得したものを設定しました。
また、SEO対策で欠かせない？Google Search Consoleでのドメイン所有権確認のためにTXTレコードの追加が必要になり、ここで少しつまずいたのでメモ的にDNSレコード追加方法を書いておきます。

## ドメイン設定はName Server転送を選択
そもそものドメイン設定は、Zeitがおすすめしているネームサーバー転送で行いました。
![now-domain-setting.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/18699/3ba65cd8-b4a6-99af-3f5f-3191a1ecebc4.jpeg)
つまり、これから自分のドメインにTXT等レコードを追加したい場合は、お名前ドットコムの設定ではなく、nowのものをイジる必要があるわけです。

## nowで設定した独自ドメインにTXTレコードを追加してみる
nowは非常にミニマルで美しい管理画面を提供してくれているのですが、今回やりたい、レコードの追加はブラウザではできないようです。ではどうやるのか、コマンドラインツール[nowコマンド](https://zeit.co/download)です。

### nowコマンドでTXTレコード追加
npmやyarnでnowコマンドをグローバルインストールした後、

```bash
$ npm i -g now # Or yarn global add now
```

nowにログインします

```bash
$ now login
```

そして以下コマンドで一発完了

```bash
$ now dns add sample.com @ TXT "TXTレコードの値"
```

## 宣伝
こんにちは。
自分は新卒でヤフー→４年で退職→2019/05よりバンクーバー在住のソフトウェアデベロッパーです。
Node.js/Vue/Nuxt/React/Next 周りならフロントバックエンド共に開発できます。
バンクーバーからのリモートでもOK！という案件お待ちしております！
[@taishikat0_Ja](https://twitter.com/taishikat0_Ja)
[taishikato.com/resume](https://taishikato.com/resume.pdf)
iosに続いてGitHubのAndroidモバイルアプリのベータ版も公開されました

2020年1月16日に
GitHubのAndroid版モバイルアプリのβ版も公開されました

https://github.com/mobile

ちなみにiOSベータ版はこちらで
2019年11月12日に始まりました。
https://qiita.com/a-nishimura/items/f98d370af868416eaa20

私はwaitlistに登録してから未だ音沙汰なくて試せてないのですが…
【エラー解消法】Vue.js + Karma + PhantomJS + Firebaseでテストしたときのエラー

掲題の環境で、unitテストを走らせたときのエラーについて解決法を書きます。

## 実行コマンド
`npm run unit`

## エラー内容

```console:error_log
21 01 2020 10:41:54.753:INFO [karma]: Karma v1.7.1 server started at http://0.0.0.0:9876/
21 01 2020 10:41:54.757:INFO [launcher]: Launching browser PhantomJS with unlimited concurrency
21 01 2020 10:41:54.802:INFO [launcher]: Starting browser PhantomJS
21 01 2020 10:41:57.789:INFO [PhantomJS 2.1.1 (Windows 8.0.0)]: Connected on socket 91jkqAnyQjiCS3D5AAAA with id 48032196
PhantomJS 2.1.1 (Windows 8.0.0) ERROR
  ReferenceError: Can't find variable: Map
  at webpack:///node_modules/@firebase/app/dist/index.cjs.js:301:0 <- index.js:1043

PhantomJS 2.1.1 (Windows 8.0.0): Executed 0 of 0 ERROR (0.729 secs / 0 secs)
```

## 解決策
下記の記事を参考に、テストブラウザをPhantomJSからChromeHeadlessに変更しました。
https://dev.oro.com/posts/2017/07/programming/testing-with-headless-chrome/

## 実行環境

- Microsoft Windows 10 Home ※仮想環境ではありません
- node v12.14.1
- npm  v6.13.4
- package.jsonに記述したunitのスクリプト
    - `cross-env BABEL_ENV=test karma start test/unit/karma.conf.js --single-run`

## エラー内容の解釈
Firebase特有のエラーかと思いましたが、そうではありませんでした。

`ReferenceError: Can't find variable: Map` の意味がわからなかったので、この言葉だけでググるとStackOverFlowの記事がヒットしました。
https://stackoverflow.com/questions/43803151/referenceerror-cant-find-variable-map

`Map`というのは、ES6から導入されたオブジェクトのことだそうです。
https://qiita.com/chihiro/items/9965cd7eca0380cf288c

PhantomJSではサポートされてないオブジェクトのため、エラーとなったというわけです。
なお、polyfillで対応しようとしても別のエラーが出るので、おとなしくChromeHeadlessを使ったほうが良いと思いました。
https://stackoverflow.com/questions/41729482/phantomjs-cant-find-variable-map

なお、karma.conf.jsでframeworksにphantomjs-shimを入れていましたが、PhantomJSを使わなくなったので外しました。

## 感想
フロントの開発は、環境を理解するだけで時間が掛かります。
しかし、その分だけ、色んなツールが出て対応が早くなっているのも嬉しいことです。

たくさん覚えることがありますが、コツコツ取り組んでいきます。
buttonタグ押下時の枠線を消す

毎回ほんとに忘れるので、備忘録。

これが　　　　　　　　こうなる
![btn.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/350221/7ab32c9a-44c5-ba01-55b4-8fda3f8c3c4d.png)　　→　　 ![btn-frm.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/350221/5cf7576a-15ca-d0e6-9dd4-8ac44540d780.png)


そんな時は、

```style.css

button {
  outline: 0;
}
```
とすると、枠線が出なくなる。

これだけなのに、毎回忘れる。。
Windows10でADのユーザを検索する方法

```
rundll32 dsquery.dll,OpenQueryWindow
```
をコマンドプロンプトやPowerShellで実行するとウィンドウが開くので、GUIで検索できます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/44676/86afef76-eea2-71bd-2df4-40273744777c.png)
ADへの登録内容を確認するときなどに使えます。

#コマンドの説明
- `rundll32`でDLLファイルの関数を呼び出せます
  - 上記の例では`dsquery.dll`の`OpenQueryWindow`を呼び出しています

#dsquery.dllが存在しない場合
「dsquery.dll を開始中にエラーが発生しました。指定されたモジュールが見つかりません。」と表示される場合dsquery.dllが存在しません。

以下のURLの方法でマイクロソフトから管理ツールをインストールすると解決するかもしれません。
https://www.atmarkit.co.jp/ait/articles/1510/19/news023.html
Xcode11でGithubのBlameと同機能はどこにいったか？

# 概要
* Githubの便利機能のひとつであるBlameは、コード１行毎に最終更新履歴が閲覧出来ます。
* 同様の機能がXcodeにも備わっています。
  * ~~変なコードの犯人探しに最適~~
* Xcode10とXcode11では表示させるための操作が変わりました。

# 結論
* ウィンドウ右上の右から2番目のアイコンをタップ
* Authorsをタップ

<img width="240" alt="スクリーンショット 2020-01-21 11.38.20.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/58367/d1fde427-e0fb-6325-22ea-c42840920a22.png">
Cloud9でRails 6.0のSeleniumとGoogle Chromeを使える設定しましょう！

みなさん、お疲れ様です！

Cloud9で元気いっぱいで新しいRails6アプリを作ろうと思っている方、
必ずテストも作りたいよね！

もうグーグルクロームをインストールしていますよね？　このバッシュスクリプトはめっちゃ便利です。

```bash
$ curl https://intoli.com/install-google-chrome.sh | bash
```

そしてSeleniumのシステムテストを稼働すると、このエラーはありますでしょうか？

```ruby
$ rails test:system
Run options: --seed 47710
# Running:
E
Error:
WelcomeTest#test_visiting_the_index:
Selenium::WebDriver::Error::UnknownError: unknown error: Chrome failed to start: exited abnormally
  (unknown error: DevToolsActivePort file doesn't exist)
  (The process started from chrome location /opt/google/chrome/google-chrome is no longer running, so ChromeDriver is assuming that Chrome has crashed.)
    test/system/welcomes_test.rb:5:in `block in <class:WelcomeTest>'
```

気を落ち込まないように！

* グーグルのバージョンを確認してください  

```bash
$ google-chrome-stable -version
Google Chrome 79.0.3945.130 
```

* 正しいchrome-webdriverをダウンロードして、インストールします。   
**https://chromedriver.chromium.org/downloads**  
で自分のバージョンをダウンロードしてください。例えば今の場合、79が必要ね

```bash
$ wget -N https://chromedriver.storage.googleapis.com/79.0.3945.36/chromedriver_linux64.zip
$ unzip chromedriver_linux64.zip
$ sudo mv -f chromedriver /usr/local/bin/chromedriver
$ sudo chown root:root /usr/local/bin/chromedriver
$ sudo chmod 0755 /usr/local/bin/chromedriver
$ chromedriver --version
ChromeDriver 79.0.3945.36 (3582db32b33893869b8c1339e8f4d9ed1816f143-refs/branch-heads/3945@{#614}) // OK!!!!!!
```

* Railsのシステムテスト用のオプションを設定します  

```ruby:/test/application_system_test_case.rb
require "test_helper"

class ApplicationSystemTestCase < ActionDispatch::SystemTestCase
  driven_by :selenium, using: :chrome, 
                       screen_size: [1400, 1400], 
                       options: { args: %w[headless disable-gpu] }
end

```

* 確認！  

```ruby
$ rails test:system

Run options: --seed 49276

# Running:

2020-01-21 01:54:40 WARN Selenium [DEPRECATION] :args or :switches is deprecated. Use Selenium::WebDriver::Chrome::Options#add_argument instead.
Capybara starting Puma...
* Version 4.3.1 , codename: Mysterious Traveller
* Min threads: 0, max threads: 4
* Listening on tcp://127.0.0.1:41043
.

Finished in 1.324751s, 0.7549 runs/s, 0.7549 assertions/s.
1 runs, 1 assertions, 0 failures, 0 errors, 0 skips
```

まあ後でdeprecationsの問題に考えましょうね、
とりあえず稼働かどうか確認してください！

いかがでしたか？問題なかった？コメント、煽りはコメントに書いてください！
Vue.jsのmountedについて調べました

vue.jsを触る中で出た私の中での新出単語**mounted**を調べたので書いていきます！！

## mountedとは


## ライフサイクルフック
・・・mountedは・・・？(´・ω・｀)となりますが、まあまあ(ノ´ー｀)ノ読んでください



- vue.jsの初期化の決められたタイミングで実行される関数。初期化中に自動的に実行されるらしいです。

他にも

- Vueではインスタンスが作られてから、削除されるまでの間で、ライフサイクルフックを実行することができる
- 初期化の過程で、特定の段階でユーザー自身のコードを追加するために実行する関数


と説明されてました。


 
ちなみに[公式ドキュメント](https://jp.vuejs.org/v2/guide/instance.html#%E3%83%A9%E3%82%A4%E3%83%95%E3%82%B5%E3%82%A4%E3%82%AF%E3%83%AB%E3%83%80%E3%82%A4%E3%82%A2%E3%82%B0%E3%83%A9%E3%83%A0)のvue.jsの**ライフサイクル**図は以下のようになっております。
![lifecycle.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/486722/21f8d990-503e-223b-41f0-17c09549d192.png)

## ライフサイクルてなんやねん
て、私も最初思ってたんですけど、[Vueのライフサイクルを完全に理解された方のQiita](https://qiita.com/chan_kaku/items/7f3233053b0e209ef355)をふむふむと読んで、なんとなく、vueの**ライフサイクル**は、**vueの中で実行される流れ**って感じなのかなと思いました。（語彙力


### ということで

私の解釈だと**ライフサイクルフック**は、**インスタンス作成時**、**elementへのマウント時**、**データの更新時**、**インスタンスの削除時**など、色々やるじゃないですか、その時にのイベント(?)というかタイミング(?)の名前？のことと解釈してます。

## ちゅーことで
mountedは、vue.jsのライフサイクルの中で**elementにマウントした後**、というタイミングの話だったってことです、よね。
なんか間違ってたら教えてください。(´ｰ｀)ﾉｼ
Adobe-Japan1-6およびJIS2004対応の外字チェッカーを作成

　日本語EPUBの作成で結構面倒なのが「使える文字と使えない文字のチェック」です。何せ単行本1冊で10万文字くらいはあったりしますので、それを目視でチェックして使えない文字を見分けるなどというのは普通に考えて無理があるわけです。また、例えベテランの作業者なら対処できるとしても、そういう機械的な処理に関しては極力機械に任せて省力化したいところです。ということで自前のチェッカー内に組み込む目的で<strong>「Adobe-Japan1-6」</strong>および<strong>「JIS X 0213:2004（JIS2004）」</strong>を対象として外字のチェッカーを作りました。

　ターミナルで
 
<pre class="lang:sh decode:true " >perl /ローカルパス/AJ1-6check.pl チェックしたいEPUBファイルのパス</pre> 

　のような形で指定すると、以下のようなチェックログのファイルを出力します。上の例はAdobe-Japan1-6用チェッカーの指定例ですが、JIS2004用チェッカーも使い方は同じです。

<a href="http://densyodamasii.com/wp-content/uploads/2020/01/column77_1.png" rel=lightbox[column77]><img src="http://densyodamasii.com/wp-content/uploads/2020/01/column77_1.png" alt="チェック結果" width="627" height="367" class="size-full wp-image-3847 alignleft size-full thinborder" style="float:left" /></a></a>

　普段ならリストを貼って公開するところなのですが、なにせ膨大な文字をリスト化しているためとんでもない長さになるため、[<strong>ダウンロードリンク</strong>](http://densyodamasii.com/?wpdmpro=aj1-6_jis2004characheck-zip)を貼る形とします。


　なお、Adobe-Japan1-6用のリストは<strong>@monokano</strong>さんのご厚意により、テキストエディタ<a href="https://tama-san.com/ukigami/" rel="noopener" target="_blank"><strong>「浮紙」</strong></a>用の特定文字項目ファイル内のリスト（正規表現のパターン）を流用させていただいています。
　JIS2004用のものは自前で調べて書きました。しんどかった（笑）。

　Mac用のアプリに統合したものは<a href="http://sanyoshasmds.xsrv.jp/main/?page_id=184" rel="noopener" target="_blank"><strong>こちら</strong></a>。Epubcheckのバージョンも4.2.2に上がっています。
vim の操作

# vim の操作
### ノーマルモード
| キーボード操作 | 機能                                        |
|----------------+---------------------------------------------|
| j              | 下にカーソルを移動                          |
| k              | 上にカーソルを移動                          |
| h              | 左にカーソルを移動                          |
| l              | 右にカーソルを移動                          |
| dd             | 一列削除(カットでもある)                    |
| dw             | 単語を削除                                  |
| yy             | 一列コピー                                  |
| p              | dd や yy でカットやコピーした列を張り付ける |
| gg             | ファイルの一番上に移動する                  |
| G(shift + g)   | ファイルの一番下に移動する                  |
| x              | 一文字削除                                  |

### 挿入モード(入力)
| キーボード操作 | 機能                       |
|----------------+----------------------------|
| i              | ヴィジュアルモードへ移行   |
| ESC            | ヴィジュアルモードを抜ける |
| o | 現在の文字列の下の列に挿入モードで移動する |
| a | 現在位置の直後に挿入モードで移動する       |
| Shift + i | 現在の列のトップに挿入モードで移動する |
HTTPSサイトのWordpressのドメイン変更をした場合のひと手間。

WordPress のドメインを変更する場合、以下の方法が紹介されていることが多い。

- wp_options の siteurl を新しいドメインに書き換える
- wp_options の home を新しいドメインに書き換える

通常の場合は大筋これで良いのだろうが、近年はサイトも HTTPS 化されていることが普通である。
その場合のプラグインとして [WordPress HTTPS](https://wordpress.org/plugins/wordpress-https/) を使っている場合、こちらにも設定が必要になる。

- wp_options の wordpress-https_ssl_host を新しいドメインに書き換える

この設定を行わない場合、主に管理機能で更新をした後にドメイン変更前のURLにリダイレクトされたりする（が、機能の都合から HTTPS 必須の部分にリダイレクトされる場合のみこのURLが使われるので、いつ出てくるかが分かりづらい）。

ドメインを書き換える場合は、既存のシステムがあるということなので、この時に HTTPS プラグインが入っているかはチェックするようにしておこう。
Windows10 + Office365のExcelでVimXlsが動かない（Declare ステートメントの確認）

- VimmerでExcelも使う人でVimXlsを使う人は多分120億人くらいいると思うのですが、ようやく私もWindows10にして、さっそくExcelにVimXlsをアドイン導入したらエラーが。

![vimxls_error.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/48561/80207622-feb6-2758-2d43-7392858dfd33.jpeg)

- エラーの説明通りで、DeclareではなくDeclare PtrSafeにしないとだめよ、ということなので全置換しましょう。

![vimxls_replace.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/48561/4c1038f9-264c-807f-1e62-db59e085d42d.jpeg)

- 保存したらもう一度選択しなおして有効にしてあげないと動かないのでやりましょう。

![vimxls_addin.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/48561/a20652fe-cedc-7f7a-7ac8-864decdc2904.jpeg)

- 現場からは以上です。
bitnami redmineのバナーを取り除く

# はじめに
bitnamiのredmine起動させると何やら右下にバナーが表示されています。
表示されていても問題ないのですが、不要なので消したいと思います。
![スクリーンショット 2020-01-18 11.04.18.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/82090/ac4e0280-656b-d8bc-98ae-25ad9721b730.png)


# 
以下の[公式ドキュメント](https://docs.bitnami.com/aws/how-to/bitnami-remove-banner/)によると`/opt/bitnami/apps/APPNAME/bnconfig`に無効にするコマンドがあるようです。
ということなので実行してみると、

```bash:bnconfig
$ sudo /opt/bitnami/apps/redmine/bnconfig --disable_banner 1
sudo: /opt/bitnami/apps/redmine/bnconfig: command not found
```

コマンドが無いと言われてしまいました。
確認してみると、

```bash:確認
$ ls /opt/bitnami/apps/redmine/
bnconfig.disabled  conf  htdocs  licenses  scripts  updateip
```

`bnconfig`というのはありませんでしたが、`bnconfig.disabled`というのがありました。
ということで改めてこちらのコマンドで試してみます。

```bash:bnconfig.disabled
$ sudo /opt/bitnami/apps/redmine/bnconfig.disabled --disable_banner 1
```

```bash:再起動
$ sudo /opt/bitnami/ctlscript.sh restart apache
Unmonitored apache
Syntax OK
/opt/bitnami/apache2/scripts/ctl.sh : httpd stopped
Syntax OK
/opt/bitnami/apache2/scripts/ctl.sh : httpd started at port 80
Monitored apache
```

無事バナーが消えました。


# おわりに
今回はbitnami redmineで行いましたが、bitnami製品なら共通の手順で消せるようです。


[参考]
・Remove The Bitnami Banner
https://docs.bitnami.com/aws/how-to/bitnami-remove-banner/
・How to reenable bnconfig tool
https://community.bitnami.com/t/how-to-reenable-bnconfig-tool-77d4821d-de86-c23f-331b-9b53c3f469b1/70602/5
Vue.js(Nuxt.js)で画像を表示させる方法（imgタグ、背景画像）

##Vue.js(Nuxt.js)で画像を表示させる方法

###imgタグとして画像を表示させる

```vue
<img src="~/assets/keyvisual.jpg">
```

###背景画像として表示させる

```css
background: url("~@/assets/keyvisual.jpg");
```
Raspberry Piの初期のセットアップ

#1. 初めに
IoTを利用して実験することができます。実験するために色なデバイスを使えます。この記事で人気があるデバイスを紹介したいと思いまして、これはRaspberry Piです。そして最初のセットアップの方法を説明します。今Rasberry Piのシーリズが色々ですが例としてRaspberry Pi 3Bのモデルを使っております。
まずRasberry Piの必要なモジュールをみましょう。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/344186/b7ffc969-834e-b7d7-4666-40cc2e02f6ba.png)
#2. Raspberry Piの構造を確認する
上の画像に色なエレメントがありますが次の項目を確認しなければならないと思います。
- Micro USB Power Input: これはRaspberry Piの電源です。完全のモジュールを電を提供するのでないといけないです。
- USB Port:　これにキーボードとマウスを使うようにプラグすることが必要です。
- Micro SD カード：　 Raspberry Piは組み込みコンピューターなのでメモリが必要です。それでメモリとしてSDカードを使います。Raspberry Piでは配置されていませんため、別途購入する必要があります。
- HDMIケーブル：　最初Raspberry Piにsshできないと思います。利用するために画面を準備してPiのHDMIポートと差し込んで表示することができるでしょう。
#3. Raspberry Piの最初のセットアップ
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/344186/49cde0af-df87-c7dd-a6e7-1bd1a553520c.png)
上記のステップの通りにやります。
##1. Bootable SD カードを準備する
まずSDカードにRaspberry Piのオペレーチングシステムをインストールします。[ここ](https://www.raspberrypi.org/downloads/raspbian/)にバージョンを選んでダウンロードしてください。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/344186/4ac98371-b7d6-3b10-5863-e899f5a50e44.png)
三つのバージョンでどうちらでもいいです。カードリーダを使ってパソコンを差し込んでその後 Macのターミナルを開いて次のコマンドをインプットしてください。
```//SD カードのディスクがわかる
sudo diskutil list
//X はSD カードのディスク（例：disk1, disk2, disk3...）
sudo umount diskX 
//X はSD カードのディスク（例：disk1, disk2, disk3...）
sudo diskutil umount diskXs1
//X はSD カードのディスク（例：disk1, disk2, disk3...）
//pathの代わりに上記のダウンロードしたイメージのパス
sudo dd bs=4m if= of=/dev/diskX
```
ちょっと待ってください。私のパソコンには３０分頃かかります。進捗をチェックしたい場合、pvというツールを使えます。具体的には[ここのリンク](https://askubuntu.com/questions/215505/how-do-you-monitor-the-progress-of-dd)を参考してください。
##2. 重要なモジュールをつながる
Bootableカードが利用できた後でカードリーダにカードを取り外してSDを Raspberry Piを入れてください。
Raspberry Piを利用できるようにマウスとキーボードを準備しなければなりません。他には最初に画面も必要です。WIFIとかBluetoothなどのセットアップします。画面はHDMIケーブルを使ってRaspberry Piと画面をつながります。最後にMicro USBポートとつながって電源を提供すると起動できます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/344186/4fabef98-70d0-df53-10d6-342a597f0b23.png)
起動するときに赤いLEDが点灯します。SDカードからデータを読む時に青いLEDが点灯します。
注意：もし今度からsshしたい方は設定の中にConnectionにはsshをEnableしてください。それからコンソルで```ifconfig```をインプットしてIPを記憶して置きます。
##3. OSをインストールする
Raspberry Piを起動してからWifi、Bluetoothなどの基本的な設定します。
最初は画面が必要ですが今度からPCでRaspberry Piが同じのWifiかLANを接続するとsshでコンソルを実行することができます。
まずRaspberry Piを電源をつながって、起動します。その時接続したネットワークを自動的につながります。
パソコンからそのRaspberry PiのアドレスIPを見つけます。
ターミナルから次の通りにコンソルでインプットしてください。ipaddressの代わりにRaspberry PiのIPをインプットします。
```ssh pi@ipaddress
```
これまでsshできました。できない場合はRasberry Piでsshのパーミッションを提供しないかを確認してください。

#4. 最後に
上記のようにRaspberry Piをセットアップすることを紹介しました。MacBook用の紹介ですが他のOSはそのようなステップをやりますのでやり方がちょっと違うだろう。
問題があれば私のEメール「hungph.dev.ict@gmail.com」をエラーを含めてメールしてください。
terraform で 同じスペックの EC2 を複数台作る

こんにちわ、 @ktoshi です！

2020年になり、そろそろ始める時期になってきたのではないでしょうか、そう**新人研修**です。

昔は余ったサーバを持ってきて一台一台セットアップして…と準備していましたが、
今や画面をポチポチすれば簡単にサーバが出来ちゃう時代。素晴らしい時代。

しかし！やるからには徹底的に簡単にさせたい、ということで
同じようなサーバを簡単に作ってみよう！というのが今回の趣旨です。

# 概要
AWSでいっぱいサーバ作ります！そして、作ったサーバを0にもできます！
構築ツールとしては [terraform](https://www.terraform.io/) を用います。

# 環境
* AWS
* Terraform v0.12.16

# 準備
事前に下記を準備ください。

* Terraform のインストール
* AWS アカウントの準備
  * AMIアカウントを発行いただき、アクセスキーなどを入手ください。
* EC2に設定するSSH鍵の秘密鍵と公開鍵のセット

# Let's try!!
それでは実践！
なお、インスタンスが一瞬にして大量に作成できてしまうので、
費用には十分お気を付けください。

## Terraform の初期設定
Terraform で AWS を操作するための初期設定を行います。

### provider の設定
```hcl:provider.tf
provider "aws" {}
```
今回、AWSのクレデンシャルは環境変数で設定します。
環境変数として下記を設定してください。

* AWS_ACCESS_KEY_ID
* AWS_SECRET_ACCESS_KEY
* AWS_DEFAULT_REGION

上記の設定が終われば、Terraform の初期化及び設定の確認を行います。

```shell
# Terraform の初期化
$ terraform init

# 認証情報の設定確認
$ terraform plan
※ エラー無く発行できればOK!!
```

### 設定ファイルの準備
今回はとりあえず EC2 を起動させるための最低限の設定を記載します。
また、新人教育前提ということで秘密鍵も同じものを使いまわすようにします。

```hcl:terraform.tfvars
public_key = <公開鍵>
instance_number = <作成するEC2の数>
```

```hcl:ec2.tf
# 定数の読み込み
variable "public_key" {}
variable "instance_number" {}

# キーペアの作成
resource "aws_key_pair" "aws-key-pair" {
  key_name   = "example-aws-key-pair"
  public_key = var.public_key
}

# EC2 の作成
resource "aws_instance" "ec2" {
  count         = var.instance_number
  ami           = "ami-0930de172e13fa059" # お好きなAMIを選択してください。
  instance_type = "t2.micro" # 起動したいインスタンスタイプを選択してください。
  disable_api_termination = false
  monitoring             = true
  root_block_device {
    delete_on_termination = true
    volume_size           = 20
    volume_type           = "standard"
  }

  credit_specification {
    cpu_credits = "standard"
  }
  key_name = aws_key_pair.aws-key-pair.key_name
  tags = {
    "Name" = "instance-${count.index}"
  }
}

# ElasticIP の作成
resource "aws_eip" "eip" {
  count = var.instance_name
  instance = aws_instance.ec2[count.index].id
  vpc = true
  tags = {
    "Name" = "instance-${count.index}-eip"
  }
}


# IPアドレスの出力
output "instance_ip" {
  value = join(", ", aws_eip.eip.*.public_ip)
}
```

### 設定の反映
下記コマンドを発行して、設定を反映させます。
Terraform では一般的に テスト実行 -> 実行 の流れになります。

```shell
# Dry-Run
$ terraform plan

# Done!!
$ terraform apply
～中略～
Outputs:

instance_ip = XXX.XXX.XXX.XXX, YYY.YYY.YYY.YYY # 作成したインスタンスのIPアドレス
```

これでインスタンスが生成されました！！
instance_number の数字を変えれば、自由に作成するインスタンス数を変更できます。
「2」に設定すれば2つ作成され、同じ設定で実行すれば2つの状態が維持されます。
「2」から「100」に変えれば、追加で98個作成されて合計で100の状態になります。
「0」を設定すれば、作成されたインスタンスが全て削除されます。

なので、当日新人が休み！とか新人追加で！とか研修キャンセルで！という
急な予定の変更にも柔軟に対応することができます。（インフラはね）

# まとめ
他の記事で秘密鍵の数に合わせて作成するインスタンス数を変更する、というのはありましたが、
研修用途で特に深く考えず、なるべく簡単に作成したかったのでインスタンス数を定数として渡すようにしました。
今回は研修用途であまり深い設定はしていません。（VPCとかセキュリティグループとか）
本番環境で作るのであれば、オートスケーリングなどを利用するのがベターかと思います！
研修用とかちょっとしたイベント用などにご利用いただければ幸いです。

それでは皆様、素敵な研修ライフを。そして、素敵な2020年を。
Rails devise + google_oauth2 でログイン後のリダイレクト先を指定

# applictaion_controller.rbではリダイレクト処理したくない

理由は特にない。気分の問題。

# omniauth_callbacks_controller.rbに書く

```rb:app/controllers/chichinpuipui/omniauth_callbacks_controller.rb
  def google_oauth2
    ...
    ...
  end

  protected

  #ログイン後のリダイレクト先
  def after_sign_in_path_for(resource)
    itaino_itaino_tondeke_path
  end
```

google_oauth2メソッドより上にprotected書くとエラーになるので注意。
Linux OSのバージョンを確認する方法

# カーネルのバージョンを調べる

```
$ cat /proc/version
Linux version 5.0.0-37-generic
```

# Debian

```
$ cat /etc/debian_version
10.2
```

# Ubuntu

```
$ cat /etc/lsb-release
DISTRIB_ID=Ubuntu
DISTRIB_RELEASE=18.04
DISTRIB_CODENATE=bionic
DISTRIB_DESCRIPTION="Ubuntu 18.04.3 LTS"
```

# Cent0S

```
$ cat /etc/redhad-release
CentOS Linux release 7.7
```

私のMacの仮想マシンは3つのLinuxしか入っていないので、今回はここまで。
他のLinuxを入れたときに更新します。
ＡＤＯ接続を実験するために使う、大規模データベース（ＣＳＶ）

ＶＢＡでＡＤＯ接続をするコーディングの試行錯誤をしています。
それで、接続後に複雑な検索条件を実行して、エラーが出ないか試してみたくなりました。
本職のプログラマーではないので、サンプルをネットで拾うしかなくて、困った困った。
一生懸命探しましたが、英語のサイトでは結構サンプルデータが提供されているようです。
アクセスのデータも、大学の講義用に公開されているのもありました。
ですが、百五十万行まで、データ量別にＣＳＶファイルが公開されているのは、ここだけだな。

http://eforexcel.com/wp/downloads-18-sample-csv-files-data-sets-for-testing-sales/

エクセルのワークシートの行数の上限を超えたデータというのは、なかなかに魅力的。
試しに、このＣＳＶファイルをエクセルに読み込んでみたら、最終行までは読み込んだのを確認した。
まあ、これを使ってＡＤＯ接続で検索結果をワークシートに出力します。
かなり、高速で検索出力してくれるのが分かった。
もう、ＶＢＡのコマンド、Find、FindNextを使って検索するのが馬鹿らしくなった。
そんな雑感を初投稿です。
意外と勘違いしている午前と午後

時刻表記をちょっと調べてみました。

24時制 | 日本（法律） |      欧米
:----- | :----------- | :---------
 00:00 | 午前 0時 0分 | 12:00 a.m.
 00:59 | 午前 0時59分 | 12:59 a.m.
 01:00 | 午前 1時 0分 | 01:00 a.m.
 11:59 | 午前11時59分 | 11:59 a.m.
 12:00 | 午前12時 0分 | 12:00 p.m.
 12:59 | 午後 0時59分 | 12:59 p.m.
 13:00 | 午後 1時 0分 | 01:00 p.m.
 23:59 | 午後11時59分 | 11:59 p.m.
 00:00 | 午後12時 0分 | 12:00 a.m.

- 00:00（24時制）は正子（真夜中）。12:00（24時制）は正牛（お昼）。
- 24時制は時刻を連続で一意に表現できる！
- 日本の法律では、午前 0時 0分と午後12時 0分が同じ時刻。
- 日本の法律では、午後 0時は存在しない。しかし、『記者ハンドブック』第10版共同通信社では、12:01-12:59（24時制）を午後0時としている。
- 日本の法律のhourは、0から12。
- 欧米のhourは、1から12（昔、0を知らなかったから）。ただしa.m.内やp.m.内で数字が連続でない。
- 正午は、日本では午前、欧米ではp.m.。
- 他に日本時計協会やドイツ式などは、別の表記。
- 参考 https://ja.wikipedia.org/wiki/午前と午後
linux ファイルの中身をクリップボードにコピーする

## 環境
Red Hat 6.10
大体のLinux環境なら動くはず

## 手順　(2020/01/21現在)

##### 1.ファイルを開く
`vi [ファイル名]`

##### 2.ポインタをファイルの先頭に移動する
`gg`

##### 3.visual(行)モードにする
`shift + v`

##### 4.ポインタを最終行まで選択する
`shift + G(大文字)`

##### 5.クリップボードにコピーする
`y`

## 理由

[xclip]・[dbcopy]などが使用できない環境で開発していて、
新たに`yum install`できない時に使用できる。

## 参考サイト
https://programming-jissen.com/how-to-select-all-in-vim/
https://linuxfan.info/xclip
WebMockを使って外部API接続をスタブ化する

# 概要
APIはJavaで実装して、Javaから返ってきたjsonをRailsで受け取ってRails側でそのjsonデータを表示するという流れにしたく、Railsの実装をしている時のテストや、いちいちJavaを起動させなくていいようにスタブ化したのが目的です。

[Rails開発でWebMockを使ってAPIアクセスをスタブ化する](://dev.classmethod.jp/server-side/rails-development-with-webmock/)からのコードを引っ張ってきただけなので、リンク先の解説みた方が断然わかりやすいです。

# 実際のコード
```ruby:api_stub.rb
module ApiStub
  require 'webmock'

  WebMock.enable!
  # アプリケーションコードに`call_get_api`という名称の外部API呼び出し実装を含むメソッドがあることして、ここで同名のメソッドを作成してstub登録します。
  def call_get_api
    WebMock.stub_request(:any, "http://www.example.com/").to_return(
        body: File.read("#{Rails.root}/test/fixtures/stub_api_response.json"),
        status: 200,
        headers: { 'Content-Type' =>  'application/json' })
    super # アプリケーションコードの実装を呼び出す
  end
end
```


```ruby:api_module.rb
module ApiModule
  require_relative 'api_stub'
  prepend ApiStub if ENV["APIMODE"] == "mock" && Rails.env.development?

  def call_get_api
    # ここに本来の外部API呼び出しの実装が入る
  end
end
```

```ruby:api_client.rb
class ApiClient
  require_relative 'api_module'
  include ApiModule
end
```

```ruby:web_controller.rb
class WebController < ApplicationController

  require './lib/externals/api_client'
  require 'net/http'

  def fetch
    client = ApiClient.new
    client.call_get_api
    res = Net::HTTP.get("www.example.com", "/")
    @result = JSON.parse(res)
  end
end
```

# 脱線　スタブとモックの違い
スタブは**受信メッセージのテスト**のために使うためのもの。
モックは**送信メッセージのテスト**のために使うもの。


# 参照
[Rails開発でWebMockを使ってAPIアクセスをスタブ化する](://dev.classmethod.jp/server-side/rails-development-with-webmock/)
[Ruby on RailsでWebMockを利用する](https://techblog.altplus.co.jp/entry/2016/12/15/000000)
Githubについて

GitHubを使う場面があったので、調べたことを忘れないようにメモ

#GitHubとは
ソフトウェア開発プロジェクトのためのソースコード管理サービス
ソースコードをみんなで管理しやすくしてくれるやつ

#大事な単語
####リポジトリ
ファイルやディレクトリの変更履歴を管理するもの（2種類）。
リモートリポジトリ　：　サーバーにあるイメージ
ローカルリポジトリ　：　文字通り自分のPCにあるイメージ

基本的には、以下の流れでgithubを使っていく
ローカルでファイルに修正をかける。
ローカルリポジトリに追加。修正内容のコメントを入れる。
リモートリポジトリに追加する。


####branch、merge
branchは変更履歴（リポジトリ）を分岐させる時に使用する。
どういうときにやるのか？
１つの大きなファイルに対して異なる変更が必要な時（バグの修正、新規機能の追加）
各自修正したbranchを１つのmasterリポジトリ？にまとめ直すのがmerge
*イメージ*
*リポジトリ > master_branch > {hoge1, hoge2, hoge3,,,}*

流れ
メインのbranchから、自分用のbranchを作成し作業を行う。
作業が終わり次第、メインのbranchにmerge


#基本コマンドと作業の流れ
`git checkout -b hoge1`
自分用のブランチ作成と移動
-bをつけることで、作成と移動ができる

`git add test.html`
まず、ローカルリポジトリにファイルを追加
※複数追加ある場合はこのタイミングで追加

`git commit -m "テスト用アップ"`
リポジトリに対して変更の内容を記述

`git push origi hoge1`
ローカルリポジトリをリモートリポジトリ（branch）にあげる。

実際には、この後masterファイルにmergeする

#参考
>https://techacademy.jp/magazine/6235
「36851 スキャナーから応答がありません」を直す

環境
- Windows10 64bit 1809
- スキャナー　RICOH imagio MP C4001

症状

Adobe Acrobat Pro DC をアンインストールして、Adobe Acrobat Standard 2017　をインストールしたら、ネットワークスキャナーからスキャンできなくなった。


Adobe Acrobat Standard 2017　において、RICOH imagio MP C4001/C5001 を選び、「スキャン」とすると、

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/139524/fe5e637d-e922-48ef-220e-25a2f75e2ceb.png)

36851: スキャナーから応答がありません

と出る。試しにWindowsファイアウォールを解除してみたら動くようになった。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/139524/cbd192d2-46d0-4934-39da-0611b9eb27ea.png)


そこで再びファイアウォールを有効にし、コントロールパネルの「ネットワークとインターネット」-「Windows ファイアウォール」-「ファイアウォールによるアプリケーションの許可」を開く。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/139524/8592f0e1-8453-931e-7ce9-706eb96138b4.png)
「設定の変更」-Adobe Acrobat 2017　のプライベートネットワークにチェックをつけて「OK」としたらOK。
コーディング用フォント

【2019年版】プログラミングが捗るコーディングに適したフォント集
http://note.kurodigi.com/2019-programing-font/?unapproved=18871&moderation-hash=164e4c7f6612b733806d866d05a25d9e#comment-18871

コメント

>1とlの違いもあるとよいかもしれない。
0123456789もぜひ表記していただけると。
一度、自分でも作ってみます。


読み間違えやすい文字

O と 0

1 と l

9 と g

rn  と m

どうやって資料を作るとよいか思案中。


# 文書履歴(document history)
ver. 0.01 初稿 20200121
ver. 0.04 URL追記　20230302

### 最後までおよみいただきありがとうございました。

いいね　💚、フォローをお願いします。

####  Thank you very much for reading to the last sentence.

Please press the like icon 💚　and follow me for your happy life.
LINEとWebアプリのユーザー連携やってみた

### 概要
以前LINEMessagingApiを使って簡単なBOTを作成したので、今回はLINEアカウントとWebアプリケーション側のユーザーを連携してみる

前回の記事
https://qiita.com/johnny1204/items/62a5df0217b9f0bc0dc6

### ドキュメント
https://developers.line.biz/ja/docs/messaging-api/linking-accounts/

ドキュメントが公開されているので、こちらに書かれた通りに実装していきます。

### 連携トークンを要求する
ユーザーがBOTを友達登録した際のフォローイベントを感知して
`https://api.line.me/v2/bot/user/{userId}/linkToken`
にリクエストする。

``` PHP
$signature = $this->request->headers->get(HTTPHeader::LINE_SIGNATURE);
$events = $bot->parseEventRequest($request->getContent(), $signature);
foreach ($events as $event) {
    if($event instanceof FollowEvent) {
        //連携トークンを要求する
    }
}
```

### Webアプリケーション側のログインページへ飛ばす
TemplateメッセージのURIアクションを使って、メッセージ内のリンククリックでWebアプリ側のログインページに飛ぶようにします。
その際連携トークンも一緒に送ります。

`https://×××.××××.×××××/login?linkToken={token}`

### Webアプリケーション側でログインさせてtokenと関連づける
ログインIDが特定できたら、ランダム値を発行してLINE側で発行されたtokenと紐づけておきます。
なおランダム値の要件ついては、

```
予測が難しく一度しか使用できない文字列であること。セキュリティ上問題があるため、自社サービスのユーザーIDなどの予測可能な値は使わないでください。

長さは10文字以上255文字以下であること
```
と公式ドキュメントに書かれております。

### LINE側に戻す
下記エンドポイントにLINE側で発行されたtokenとWebアプリケーション側で発行したランダム値を送付
`https://access.line.me/dialog/bot/accountLink?linkToken={token}&nonce={nonce}`

### LINE側で連携完了のメッセージを返す
アカウントリンクイベントを感知して、それっぽいメッセージを返す

``` PHP
$signature = $this->request->headers->get(HTTPHeader::LINE_SIGNATURE);
$events = $bot->parseEventRequest($request->getContent(), $signature);
foreach ($events as $event) {
    if($event instanceof AccountLinkEvent) {
        return $bot->replyMessage($bot->getReplyToken(), new TextMessageBuilder('アカウント連携を行いました。'));
    }
}
```
githubでremoteに接続しようとしたのに繋がらない時


remote接続したはずなのに、下のようなエラーが出ちゃったとき
（〇〇.gitと繋がっているはずなのに、△△.gitと繋がっちゃってない？）

```
〜〜〜$ git remote add origin https://github.com/ユーザー名/〇〇.git
〜〜〜$ git push origin master

To https://github.com/ユーザー名/〇〇.git
 ! [rejected]        master -> master (fetch first)
error: failed to push some refs to 'https://github.com/ユーザー名/△△.git'
hint: Updates were rejected because the remote contains work that you do
hint: not have locally. This is usually caused by another repository pushing
hint: to the same ref. You may want to first integrate the remote changes
hint: (e.g., 'git pull ...') before pushing again.
hint: See the 'Note about fast-forwards' in 'git push --help' for details.
```





まず、

```
git remote -v
```
でちゃんと接続できているかを確認する。（多分繋がっていないはず）

```
git remote set-url origin {new url}
```

new urlの所にhttps://github.com/ユーザー名/〇〇.gitを入れて実行すれば良い。




[参考サイト](https://qiita.com/minoringo/items/917e325892733e0d606e)
pyenvでcondaを入れてActivateできない問題の解決法

# 参考

[こちらがとても参考になりました!](https://amzn.to/2zBKOFm)


#はじめに（結論)
結論から言うとpyenvよりまえにcondaを読み込むように環境パスを設定すればいい。

```:rcファイルに追記
# -------------------------------------------------------------------------
# pyenv
# -------------------------------------------------------------------------
export PYENV_ROOT="$HOME/.pyenv"
export PATH="$PYENV_ROOT/bin:$PATH"
if command -v pyenv 1>/dev/null 2>&1; then
  eval "$(pyenv init -)"
fi

# -------------------------------------------------------------------------
# conda
# -------------------------------------------------------------------------
export PATH="$PYENV_ROOT/versions/コンダのバージョン/bin:$PATH"            
```

`pyenv global`を変更しても`.pyenv/versions/conda/bin`にあるpythonがpyenvより先に呼び出されるせいで変更がで適用されない

# あらすじ
pyenvでcondaをいれて

```
pyenv install condaバージョン
```

pyenvでcondaをグローバルにするために

```
pyenv global condaバージョン
```

condaで環境つくり

```
conda -n 環境名
```

つくった仮想環境をアクティベートしたい
baseからつくった環境に切り替えたい

```:現在のアクティブな環境を確認
conda env list

```
```
# conda environments:
#
base              *  /home/username/.pyenv/versions/anaconda3-2019.10
create_new_env       /home/username/.pyenv/versions/anaconda3-2019.10/envs/create_new_env
```

切り替えようとする

```
conda activate 環境名
```

こんなエラーがでる

```
Usage: pyenv which <command>
```

pyenvにもactivateコマンドがあるので使い方が違うよ！と怒られる

そこでpyenvよりも先にcondaが読み込まれるようにする

```:rcファイルに追記
export PATH="$PYENV_ROOT/versions/anaconda3-バージョン/bin:$PATH"              
```

PATHを確認する

```
echo $PATH
```

```
/home/username/.pyenv/versions/anaconda3-2019.10/bin:/home/username/.pyenv/shims:/home/username/.pyenv/bin
```

このようになっていればOK

もう一度環境切り替えコマンドを打てば上手くいく

```:好きなコマンドで切り替える
conda activate 環境名
source activate 環境名
```

# やはりconda
UIAlertController の title と message のパターン

毎回 title と message のどっちを設定するとどうなるかを忘れるので表にしてみました

style = actionSheet のときに `title あり/message = nil` と `title = nil/message あり` のパターンで後者の方がフォントが太くなるあたりが見どころです

## UIAlertController.Style.alert

| | not empty message | empty message | nil message |
|:-:|:-:|:-:|:-:|
| not empty title |![alertTextText](https://raw.githubusercontent.com/funnything/AlertPattern/master/outputs/alertTextText.png)|![alertTextEmpty](https://raw.githubusercontent.com/funnything/AlertPattern/master/outputs/alertTextEmpty.png)|![alertTextNil](https://raw.githubusercontent.com/funnything/AlertPattern/master/outputs/alertTextNil.png)|
| empty title |![alertEmptyText](https://raw.githubusercontent.com/funnything/AlertPattern/master/outputs/alertEmptyText.png)|![alertEmptyEmpty](https://raw.githubusercontent.com/funnything/AlertPattern/master/outputs/alertEmptyEmpty.png)|![alertEmptyNil](https://raw.githubusercontent.com/funnything/AlertPattern/master/outputs/alertEmptyNil.png)|
| nil title |![alertNilText](https://raw.githubusercontent.com/funnything/AlertPattern/master/outputs/alertNilText.png)|![alertNilEmpty](https://raw.githubusercontent.com/funnything/AlertPattern/master/outputs/alertNilEmpty.png)|![alertNilNil](https://raw.githubusercontent.com/funnything/AlertPattern/master/outputs/alertNilNil.png)|

## UIAlertController.Style.actionSheet

| | not empty message | empty message | nil message |
|:-:|:-:|:-:|:-:|
| not empty title |![actionSheetTextText](https://raw.githubusercontent.com/funnything/AlertPattern/master/outputs/actionSheetTextText.png)|![actionSheetTextEmpty](https://raw.githubusercontent.com/funnything/AlertPattern/master/outputs/actionSheetTextEmpty.png)|![actionSheetTextNil](https://raw.githubusercontent.com/funnything/AlertPattern/master/outputs/actionSheetTextNil.png)|
| empty title |![actionSheetEmptyText](https://raw.githubusercontent.com/funnything/AlertPattern/master/outputs/actionSheetEmptyText.png)|![actionSheetEmptyEmpty](https://raw.githubusercontent.com/funnything/AlertPattern/master/outputs/actionSheetEmptyEmpty.png)|![actionSheetEmptyNil](https://raw.githubusercontent.com/funnything/AlertPattern/master/outputs/actionSheetEmptyNil.png)|
| nil title |![actionSheetNilText](https://raw.githubusercontent.com/funnything/AlertPattern/master/outputs/actionSheetNilText.png)|![actionSheetNilEmpty](https://raw.githubusercontent.com/funnything/AlertPattern/master/outputs/actionSheetNilEmpty.png)|![actionSheetNilNil](https://raw.githubusercontent.com/funnything/AlertPattern/master/outputs/actionSheetNilNil.png)|

## リポジトリ

https://github.com/funnything/AlertPattern
sEasyEditerNET.exeを使って、データを暗号化する(パスワードマネージャの代替)

sEasyEditerNET.exeを使って、データを暗号化する事ができるようにした

# はじめに

ver5.2.5.0 から sEasyEditerNET.exe(sWebTool) で、データを暗号化する機能を実装した

データとして、「URL」と「id」と「パスワード」をまとめたテキストファイルを暗号化する事で、疑似的なパスワードマネージャになるだろう。

[配布元にも、説明欄は設けた](http://rocketeer.dip.jp/sanaki/free/free140.htm#cipher)

# データを暗号化する

![sEasyEditor-aes001.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/182822/2eb27ae9-f138-8070-b03a-73eb4b09fbda.png)

「暗号」→「EnCrypt」で、データを暗号化できる。

![sEasyEditor-aes002.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/182822/0710bbf2-db01-d2d2-3352-65a998d5a21d.png)

暗号の鍵(パスワード)を入れる

![sEasyEditor-aes003.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/182822/75e7dea1-ae51-34c8-9a77-a0beaeda7c94.png)

こうなるので、ファイル保存メニューで、ファイルに保存すればいい

ポイントは、「改行コード」が「None」になります。

# データを復号する

ファイルを D&D して、「暗号」→「DeCrypt」で復号される

ポイントは、暗号ファイルはバイナリなので、「改行コード」を「None」にしてから読み込まないと、改行コードに該当するバイト(0x0dと0x0aと0x0d0a)が改変されて(統一するために置換されたりするので)、適切に復号できなくなるのに注意。

# 暗号文の書式(ver1)

[配布元の説明](http://rocketeer.dip.jp/sanaki/free/free140.htm#cipher)の通りだけが、

- AES246
- PKCS7
- CBC
- 鍵は、PBKDF2 して AESに投入

![sEasyEditor-aes004.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/182822/f1f1336b-859c-6f6d-b56e-d69c2100d7d4.png)

# インデックスへ戻る

[sEasyEditerNET.exe の画面説明へ戻る](https://qiita.com/tomoki0sanaki/items/c2f48713a886a8889b87#geoip2-1)

[sWebTool Manual index](https://qiita.com/tomoki0sanaki/items/b8f571ae296a32f7b434)
CommonLispをREPLで書くための環境をWindows10上に構築した。

これの続きな

https://qiita.com/MachiaWorx/items/41cebc115a8558e59361

### 何があった

いや、前の記事絡みでコード書けるのがコマンドプロンプト経由しかなかったんですよ・・・
あとWindowsSybsystem for Linux(WSL)試したはいいけど、デバイス使おうとするとWindows側のアプリケーション呼ばなきゃいけなくなってこれはソースコードを大幅改修しないとダメじゃね？となってしまったので、結局Windows上でEmacs使うことになりました。

ただLinux上で完結するのであればWSLはとっても有用だと思うので、「デバイスとの絡みが存在する」ケースのみWindows側でソースコード書く、という形に落ち着きそうです。

### 環境

毎度のことですが、
* Windows10 Home 1903
* オーディオIF RME Babyface

### 何したのか

1. Roswellのインストール
2. Emacsのインストール
3. Roswell経由でSBCLをインストール
4. Roswell経由でSLIMEをインストール
5. Emacsの設定ファイル書き込み
6. Emacs経由でSLIME起動

### 手順詳細

#### 1.Roswellのインストール

https://github.com/roswell/roswell
落としてきて好きな場所に設置する。

#### 2.Emacsのインストール

https://www.gnu.org/software/emacs/
Windows版のZipファイル落として好きな場所に展開。
日本語パスが無い場所に設置するほうがいいかもしれない。

#### 3.Roswell経由でSBCLをインストール

コマンド：

```
ros setup
```

デフォルトの処理系を変更するのもOKだと思うけど自分はまったくやってません。

#### 4.Roswell経由でSLIMEをインストール

コマンド：

```
ros install slime
```

これでroswellのフォルダにslimeが展開される。
コマンドの出力結果の最後にパスが表示されるのでこれを控えておく。

```
To use, add this to your ~/.emacs:
  (load (expand-file-name "C:/Users/[ユーザ名]/.roswell/helper.el"))
```

どうもユーザのプロファイルフォルダ内「.roswell」ってフォルダにRoswellの各種データが展開されるみたいです。

#### 5.Emacsの設定ファイル書き込み

事前に一度Emacsを起動して終了してください。
そうすると専用のフォルダが作成されますので。

で、設定ファイルを書き込みたいところですが・・・
ここでつまずく人が割と多いのでは、と思いました。
というのは、

**EmacsのLinux版とWindows版では、設定ファイル名が違うから**

です。

Linux版Emacsで言うところの「.emacs.el」は、
Windows版で言うところの「C:\Users\[ユーザ名]\AppData\Roaming\.emacs.d\init.el」と同様です。

参考
https://nekonenene.hatenablog.com/entry/2015/04/09/082338
https://qiita.com/tadsan/items/a2018379ffaadf07a418

そもそも場所がわからん、という問題もありましたがこれで解決。

このinit.elに、4.で出力されたソースコードの記述を追加します。

#### 6.Emacs経由でSLIME起動

Emacsでは、ショートカットは以下の形式で記載されます。

* M-x = Alt+Mキー
* C-c = Ctrl+Cキー
* 単語 = その文字を入力

Emacs上で、下記のコマンドを入力するとSLIMEが起動します。
これでEmacs上でREPLが使えるようになります。すげえ便利。

```
M-x slime
```

ソースコードの解釈は、下記コマンドで行います。

```
C-c C-c
```

### 終わりに

Emacsの操作方法を覚えるのに時間がかかりそうですが、使えるとかなりプログラムが書きやすくなります。
実際コマンドラインで使ってたときの苦労が嘘のようだ・・・

ということで他に同じような環境を構築している人の参考になれば幸い。