OmniAICreator/Qiita-1.07M huggingface dataset:
【Python】画像の比率を維持して長辺を指定した長さに

コマンドで変更後の長辺の長さと画像を格納したディレクトリを指定します。
ファイル拡張子チェックは割愛。
python2.7で動作確認してますが、print関数だけ直せば3でも動くでしょう。

## コード

```Python:resize_max_side.py
#!/usr/bin/python
# -*- coding: UTF-8 -*-

"""feature detection."""

import sys
import os
import cv2

def resize(image, max_side_size):
    ori_height, ori_width = image.shape[:2]
    modi_height = max_side_size
    modi_width = max_side_size

    if ori_height > ori_width:
        modi_width = ori_width * modi_height / ori_height
    else:
        modi_height = ori_height * modi_width / ori_width
    size = (modi_height, modi_width)
    print str(size)
    resized_image = cv2.resize(image, size)
    return resized_image


if __name__ == '__main__':
    args = sys.argv

    dir_path = args[1]
    max_side_size = int(args[2])

    file_names = os.listdir(dir_path)

    for file_name in file_names:
        file_path = dir_path + file_name
        image = cv2.imread(file_path)
        resized_image = resize(image, max_side_size)
        cv2.imwrite(file_path, resized_image)
```

## 実行

```
# python resize_max_side.py images/ 100
```
記事を投稿しよう

Qiitaは「プログラミングに関する知識を記録・共有するためのサービス」です。
プログラミングに関する記事を投稿しましょう。
通常のブログとは違い、完結に。

記事投稿のテンプレート

# タイトルをつけよう
「このキーワード」で検索されるであろうタイトルをつける
例えば　VOTTの使い方を知りたい人が検索するであろうキーワードは
[VOTT　使い方](http://bit.ly/2G9aZ67) です。

# 自己紹介
不要です。記事を読む方はプログラミングコードやツールの使い方が知りたいのであって、個人のバックグラウンドに興味はありません。
しかし、エンジニアの採用などを目的にしている方や人脈構築を目的にされる方もいるためプロフィールでは自己紹介や連絡先を載せておきましょう。仕事につながるかもしれません。

# 実行環境
環境の違いによっては再現性のない場合もあります。
OS、ライブラリのversion、必要なツールなどを記載し記事を読んだ方が環境の違いを理解できるようにしてあげましょう。

# 引用、参照には敬意を
引用記事、参照記事があったらlinkをはりましょう。
ちなみにこの記事は[こちら](https://help.qiita.com/ja/articles/qiita-article-guideline)を参考にしています。

# 著作権、ライセンス、秘密保持契約などには気を付けよう

# 説明は見やすく簡潔に
- マークダウン記法を使おう。
   - コードと説明の部分はわけましょう。

下記のように’’’a=1’’’書くとコードブロックを作成できます。

```
a=1
```

・説明の部分でも太字にしたり色分けしたりして見やすくしましょう。

# 告知や紹介など、見たい人だけ見ればよいものは最後に書く
キカガクのもくもく会に参加しています。
これから学んだ事を情報発信します！
登録お願いします！
とあるVue Routingのインデックス

##参考
https://router.vuejs.org/ja/guide/essentials/navigation.html
[Vue Router の雰囲気を掴むためにやったこと] (https://webman-japan.com/memo/my-vue-router-learning-methods/)
[Vue.js + axios + Vue Routerで作る！シンプルなSPAの作り方](https://public-constructor.com/how-to-create-spa-with-vue/)
CloudWatch Logs Insightsで、存在するはずのLogGroupへのリクエストで Log group 'XXX' does not exist for account ID 'ZZZ' と返ってくる

# tl;dr

[公式ドキュメント](https://docs.aws.amazon.com/ja_jp/AmazonCloudWatch/latest/logs/AnalyzingLogData.html)の記述の通り、2018年11月５日以降にLogEventが発生したLogGroupしか検出できないようです。

抜粋：  
> CloudWatch Logs Insights では、2018 年 11 月 5 日以降に CloudWatch Logs に送信されたログデータを検索できます。

# なんでこんな仕様なんだろう...？
完全に推測ですが、LogEventの作成時にDBの索引化の処理が走っているのではないでしょうか？
で、それが開始したのが2018年 11月 5日なのではないかと。
たしかに、もう２度と見られないログにまでindexを作成するのは、AWSからしたらコストが嵩んでたまったものじゃないと思われます。
フィナンシェのBlockchainアーキテクチャ変遷と今後

こんにちは、Takです。[前回の勉強会](https://qiita.com/tak1827/items/460533ee917b4911b7cc)はLibraについて解説、議論しました。
本番リリースを前にメンバーも増えたことなので、今回はフィナンシェのBlockchainアーキテクチャ変遷を紹介しました。

# 初期設計（Closed β）
- オークション、マーケットプレイスのロジックは全てBlockchain（Ethereum）上に実装
- 一般的なDapps同様、ユーザがMetamask等のウォレットを使ってBlockchainと交信

### 課題
- Etherでの入出金、ERC20トークンの売買が可能なことから、一般向けにリリースするには仮想通貨交換業の免許が必要。取得のために何千万、何億円とかけて体制を構築する必要がある。取引所が本業ではないので、そのための投資が割に合わない
- Metamaskのようなウェットの扱いに慣れていないユーザにとっては、大変使いづらくユーザビリティが悪い
- Etherを所持していないユーザは取引所のアカウント作成から始めなければならず、使用開始のハードルが著しく高い

# 一般公開（Open β）
- 円で入出金を行い、ERC20トークンをプラットフォーム外へ持ち出させない仕様に変更。これにより仮想通貨交換業の免許が不要となる
- Blockchainとの交信をサーバーサイドで実施する仕様に変更。ガス代も運営が支払う。これによりMetamaskの使用や、取引所のアカウント作成が不要となる

詳しい仕組みについては[ブロックチェーンで人をカード化して売買できるサービスを作ったので解説する](https://qiita.com/ku_suke/items/20742efd5227889d1f01)を参照。

### 課題
- 将来的に1日に10万トランザクション処理する必要があるが、Ethereumのスピードが早くなっていない場合は、我々のサービスでメインネットを占有してしまう
- Ethereum価格の上昇に伴いガス代が上昇。ユーザに課しているトランザクション手数料を超えガス代赤字となった


# FiNANCiE Lightningの導入（Open β）
- オークション、マーケットプレイスのロジックをOff-Chainし、実行結果をデータベースに格納する仕様に変更。これによりスケーラビリティのボトルネックとガス代赤字が解消された。そもそもユーザ目線でEthereumの使用は秘匿されており、この変更による悪影響はない。むしろ、トランザクション手数料が無料となり、トランザクションファイナリティの待ち時間がゼロとなったことで、ユーザビリティが著しく向上した
- Off-Chainでの実行結果を一定時間おきにIPFSへアップロードし、IPFSハッシュをEthereumに書き込む仕様に変更。プラットフォームのIntegrityのためTraceabilityとImmutabilityを確保した格好

<img width="731" alt="Screen Shot 2019-07-11 at 19.05.05.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/48954/6cc81545-7983-21f6-0d59-656a7ae545fb.png">

# 今後
- 我々が目指すのは"Decentralized"なプラットフォーム。On-Chainで全て処理する状態に再移行する
- 使用するチェーンについてはEthereum3.0が本命。しかし、暫定的にCosmosやPolkadotで独自チェーンを開発することや、EOSやLibraを利用することを検討

# 最後に
フィナンシェではエンジニアを募集してます。本番運用している、ゲーム関連以外のBlockchainを使ったコンシューマー向けサービスは少ないです。実践的な経験が積め、知見が溜まりますよ。

ご興味のある方は是非、[採用フォーム](https://docs.google.com/forms/d/e/1FAIpQLScIWx8Vu3NkOFk0Zc7Qho-eAdyhSQM5CblJgbhLeM7yKCDzGQ/viewform)か[Wantedly](https://www.wantedly.com/companies/company_8586948/projects)からお声がけください。

*勉強会記事一覧*
- [フィナンシェでブロックチェーン勉強会、始めました。](https://qiita.com/tak1827/items/c4db3cdba5f05db1375b)
- [Libraについての勉強会](https://qiita.com/tak1827/items/460533ee917b4911b7cc)
- [フィナンシェのBlockchainアーキテクチャ変遷と今後](https://qiita.com/tak1827/items/cb6d2aa4524bdaacd99f)
FireTVのリモート停止

Vimに関してだけ使おうと思ってたんですけど、手持ちのRaspberry Piのイメージが吹っ飛んで消失する度にひどい目にあうので、この際備忘録的に残しておくやつです。簡単に…Raspbianのcronにこれを引っ掛けておくと、寝落ちしても勝手に動画再生が止まります。

## TL;DR

```backfire.sh
#!/bin/sh
adb connect my.fireTV > /dev/null 2>&1
sleep 3s
adb shell input keyevent 223
adb kill-server
```

## 備忘録としての解説

`adb connect`のあと少し待ってあげないと、`$ADB_VENDOR_KEYS` がカラのままなので `adb shell` が失敗してひどく混乱します。あとはキーイベント223 (`KEYCODE_SLEEP`)を送って終わりです。

多くのシェルからのFireTV遠隔操作の解説で使われる `adb shell input keievent 3` (キーイベント3は `KEYEVENT_HOME`) は、ホームに戻る際にCECコマンドを出力する設定の場合は勝手にテレビがfireTVに切り替わり、我が家では不満アリです。電源も切りたいのであれば、"cec-utils"をインストールして 、定番の`echo "standby 0" | cec-client -s` を足しておくのがスジかなと思います。
CDN経由のHTTPリクエスト(非キャッシュ)の速度検証


#はじめに
キャッシュできるコンテンツは、CDN上にキャッシュを配置する事でオリジンへのアクセスが減り、CDN事業社のネットワークを使用する事でユーザーに近い位置からキャッシュを配信できるので、結果としてユーザーに短時間でコンテンツを提供できる事が知られています。

一方でキャッシュできない(するのに手間がかかる) ようなリクエストに関してもCDNのネットワークを介す事で高速化できるという話があります。この記事では実際にAkamai社のCDNを使用してキャッシュしないコンテンツのリクエストがどの程度高速化できるかを実験してみました。


#実験1 (オリジン@東京-クライアント@大阪)

###測定条件
オリジン： nginx (AWS東京リージョンEC2)
クライアント: f1-micro（vCPU x 1、メモリ 0.6 GB）(GCP大阪）
CDN : Akamai 
- HTTPS Standard TLS
- キャッシュ無し(no-store)
- SureRoute(Akamaiのルート最適化機能) ON
- GETで以下のJSONデータを取得。シェル内でループで回して100回連続で取得。
{ "sub": "1234567890", "name": "John Doe", "iat": 1516239022 }
- シェルを動かしている間 vmstat 1 で CPU使用率を確認したが idle 95-98%くらいでCPUネックでシェルの動作に影響は与えてないように見える。

構成図は以下のような感じです。CDNは Akamaiを使用しました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/99425/b806b9bb-cd04-0f58-fb1b-28b9d2ddaa28.png)
図にも書いている通り、SureRoute という機能を有効にしています。SureRouteは、標準のインターネットのルート(BGPルート）とは違うパスをAkamaiが定期的に測定して、もし別のルートが速い場合は、そちらのルートを使用する機能です。また、「Persistent Connection」は、Edger ServerとOrigin間のTCPコネクションをある程度貼りっぱなしにして、同じドメインへのリクエストに対して再利用してあげる機能です。

測定結果は・・・
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/99425/a4ef07f7-a82b-abae-9f08-4602a2bfea30.png)
殆ど変わりませんでした。


#実験2 (オリジン@東京-クライアント@イギリス)
###測定条件
クライアントのインスタンスが、GCPのイギリスに移動しただけで他は同じです。
構成概要は以下の通りです。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/99425/2c26051e-e481-d044-e304-9f9ea8158160.png)

結果は以下の通りでした。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/99425/f716b4d1-7f88-f5c8-fdba-fb7fe7aa65c7.png)
かなり速くなっています。
1回1回のリクエストでは、数十msec？程度しか速くなってないのですが、流石に100リクエストを繰り返すと明確な差になるようです。

#### オリジン側のTCPセッションを観察

Akamai Edge Server と Origin の間のHTTPセッションは、HTTPの「Keep Alive」を使用して維持され、別のクライアントから来たセッションにそのまま使い回されます。
これにより、TCPやTLSハンドシェイクにかかる時間を節約しています。

今回は HTTPS の接続でテストしたで、netstat で 443 のポートを使うセッションの数がどのように推移するのかオリジン側で観察してみました。

横軸にテスト経過時間、縦軸にHTTPSセッション数をプロットしたのが以下の図です。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/99425/93dd7827-ba19-6597-7739-d4f8d0ffef4f.png)
オレンジ色がイギリスのGCPインスタンスからオリジンに直接アクセスした時のセッション数ですが、最大でオリジンのセッション数が80程度まで増加しています。100回リクエストを繰り返していてそれぞれのリクエストはすぐに終了しますが、リクエストが終わった後も TIME_WAITの残骸が暫く残るのでこのような形になっています。

一方でCDN経由のアクセスの場合は、オリジン側のHTTPS セッション数があまり伸びず、既存のコネクションを上手く使い回している事が見て取れます。


#考察
AkamaiのSureRoute と Persistent Connection を使用した場合、Latencyが大きく、かつリクエスト数が多い場合は、キャッシュを使用しない場合でもクライアントから見てかなりの時間節約になる事があるようです。
時間があれば、SourRoute を OFF にしてみたり、どの要素が Latency の短縮に効果を及ぼしているのか観察してみたいです。。。

また、オリジン側から見た場合、セッション数がかなり節約されており、オリジンの負荷軽減という意味でも CDNの導入は約に立ちそうです。
Google AIY 簡単人工知能体験

##Google AIY Voice Kit V2

Voice Kitは、Googleが世界中の人々により手軽に、簡単にAIを利用できるようにと開発したキットです。

本キットは、安価で小型なコンピューター「Raspberry Pi」で、 Google HomeやAmazon Echoのような音声認識技術とAI技術を利用したスマートスピーカーを自作するためのキットです。既製品ではないので、ユーザーが組み立て、セットアップなどを行う必要がありますが、作りながら、楽しみながら、より深くAIデバイスが理解できます。はんだ付けなどの必要が無く、小学校低学年ほどのお子さまでも自作いただけます。
![微信截图_20190315144558.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/448511/fb4c82f3-7445-60e5-c3bb-c36ea9c88a1c.png)

代理店：https://store.gravitylink.com

#### 特徴

iPhoneのSiri（シリ）や、AndroidのGoogleアシスタントなど、最近のスマートフォンは人工知能（AI）を利用した対話型音声操作が可能です。また、Google Home（ホーム）やAmazon Echo（エコー）などの人工知能搭載スピーカー（AIスピーカー、スマートスピーカー）が続々と登場してきています。そんな、最先端技術を利用したスマート スピーカーをあなたの生活にも！Raspberry Piで手軽に実現！

###### 自然な会話 

日本語で話しかければ、スマート スピーカーがAI技術を利用してより人間的な応答をしてくれます。「明日の天気は？」と尋ねれば、スマート スピーカーは、現在地などを考慮して、インターネットで情報を収集し、音声で教えてくれます。

###### 音声で操作 

ユーザーとの会話の中からシステムがユーザーの意志を読み取り、スマート スピーカーを制御します。「暑いなぁ」と語りかければ、Raspberry Piに接続された赤外線送信機から、エアコンを操作し、設定温度などを下げます。Raspberry Piを使用しているからこそ、アイデア次第で、家庭内の様々な物が音声で操作できるようになります。

##### 無限の可能性 

本キットが初めから持っている機能以外にも、Google Assistant SDK（Google製 自然言語ユーザーインターフェース ソフトウェア開発キット） とTensorFlow（Googleが提供する機械学習ライブラリ）を利用して、機能拡張、カスタマイズが行えます。あなたのRaspberry Piプロジェクトに、より手軽に、最先端AI技術を追加することができます。

スマート スピーカーはユーザーとの会話を通じてユーザーの意図を認識し、アクションを起こします。

「明日の天気は？」と尋ねれば、AIスピーカーが現在地をもとにインターネットで天気情報を検索。 

そして、検索した結果を音声で教えてくれます。「晴れですよ。でも13時頃から雨ですって」な～んて。

「暑いなぁ」と語りかければ、Raspberry Piに拡張した赤外線送信機から、エアコンを操作し、 エアコンをつけてくれたり、設定温度を下げてくれたり。至れり尽くせりですね。

# Google AIY Vision Kit V1.1

人工知能を利用した人やモノを認識する最先端スマート カメラをあなたの生活にも！ 

![visionLeft.7fa9b.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/448511/8490f6d0-65fb-d35a-b383-1d90b952ed99.png)

代理店：https://store.gravitylink.com

スマート カメラは撮影した画像から写ったモノや人を認識し、アクションを起こせます。

あなたのご自宅のインターホンと設置すれば？ 

不在時の訪問者を認識し、メールで「宅配業者の人が来たよ～」なんてことも。

標準では次のモデルが用意されていて、すぐにスマート カメラのおもしろさを試せます。

1000種類のモノを認識するモデル

顔を検出し、「悲しみ」や「笑い」など表情を評価するモデル

人、犬、猫を識別するモデル
Auth0のSPA用SDKでユーザー情報が取れない時の対処法

###Auth0のSPA用SDKつかってみた
Auth０とReactのWebアプリケーションを連携させようとauth0-spa-jsを使用してみました。
公式のチュートリアル通りにやってみたけどうまくユーザー情報が取れない・・・

たぶんこのSDK自体がすごく最近できたものみたいなので（２０１９年７月現在）、もしかしたらチュートリアルも抜けがあったのかも


###文脈
公式のReact:Loginというチュートリアルを元にしてます。

###これでなおった
auth0-jsという多分昔からあるSDKのチュートリアルの方と比べてみたら
configの設定で
audienceという部分が抜けていました。
なので

```auth0-config.json
{
    "audience": "https://<DomainName>/userinfo"
}
```

と入れ、index.jsのレンダー部分を

```index.js
ReactDOM.render(
    <Auth0Provider
    domain={config.domain}
    client_id={config.clientId}
    audience={config.audience}
    redirect_uri={window.location.origin}
    onRedirectCallback={onRedirectCallback}
    >
    <App />
  </Auth0Provider>,
document.getElementById('root'));
```
このようにaudienceを追加したら治りました


###まとめ
最初で手こずったけどAuth0なかなか良さそう
AWSを使ってみる②

# インスタンス作成まで
AWSの勉強レポートです。
早速やっていきましょう。

# AMIの選択
EC2を使用を推したら出てきました。
とりあえずリージョンは東京に変更します。
AMIを選択していきましょう。

![aws_dlna_000003.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/391995/7e0be4da-39cf-fb18-4a97-4f0f9f437c0c.jpeg)
**わぁいたくさぁん！**

![aws_dlna_000005.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/391995/48d3ea92-76fa-6b0a-7029-53b0e9847967.jpeg)
よく聞くAmazon Linux AMIは今回は使わず、CentOS7の無料枠を使います。

# インスタンスの詳細設定
![aws_dlna_000008.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/391995/c7249354-6b40-97db-ceb2-002cddf2ef37.jpeg)

早速知らない言葉がいくつか出てきました。
一個ずつ調べていきます。一言メモを残しますが、間違っている可能性大なので気付き次第、後日修正します。

1. Auto Scaling グループ：インスタンスの負荷によってインスタンス数を自動的に増減してくれる機能
2. VPC：仮想ネットワークのこと。VPCって単語AWS以外でも使うんかな？使わなそう
3. プレイスメントグループ：同じAZにあるインスタンスを論理的にグループ化して通信をよくする。クラスタとかレプリケーションするときに使いそう。
4. Amazon CloudWatch：AWSのサービスを監視できるらしい。
5. テナンシー：多分テナントのこと。ベアメタルクラウドみたいに専用物理も用意できる。
6. Amazon Elastic Inference：EC2とかのインスタンスにGPUをつけて高速化を図る。
7. T2/T3 無制限：CPUクレジットの枯渇を心配する必要がなくなる。

**というわけで**
さっくりと設定してきました。
- VPC&Subnet：わかりやすいよう新規作成しました。
- PlacementGroup：インスタンスを増やすつもりはありませんが、念のため新規作成・追加しました。Spreadを選ぶとインスタンスを個別のハードウェアに分けてくれるんですって。
- 削除保護の有効化：当然有効

# ストレージの追加
![aws_dlna_000009.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/391995/925150d4-0eb2-5422-5f06-a31953dbfccc.jpeg)
無料枠だと30GBまでのブロックストレージが使える模様。
30GB全部使っちゃいましょう。
折角なのでHDD暗号化もかけましょう。
EC2インスタンスの削除と同時にEBSを削除できるように合わせて削除もチェックしちゃいましょう。

# タグの追加
タグはとりあえず名前だけでつけましょう。

# セキュリティグループの設定
OpenStackと同じ考えていいのかな？
とりあえずさっくり作りましょう。
![aws_dlna_000012.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/391995/5f39367f-f4b1-48a9-00d5-3496be085a42.jpeg)

とここで**ソース**のプルダウンメニューの「マイIP」を選択すれば自分のグローバルIPを設定してくれました。
すごーくありがたいですね。

# インスタンス作成の確認
![aws_dlna_000013.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/391995/d310f759-2427-5666-cca3-a1fd8e1570e5.jpeg)

無事無料枠に収め、インスタンスの作成を終えました。
キーペアを設定し、次回は起動から初期設定
[AWSを使ってみる③へ](https://qiita.com/tktk0601/items/71eebadd76edc62864cb)
AWSを使ってみる①

# 今日から始めるAWS学習
今更ながらAWSを勉強してきます。
それのレポートを兼ねて書いていきます。

# 動機と勉強方法と目標
- 動機：AWSの知識が必要だ！
- 方法：とりあえず使ってみる
- 目標：LAMP環境作ってアクセスできるところまで確認

# 使うもの
- Linuxの知識（CentOS7)
- AWSアカウント
- クラウドの知識
- やる気

# AWSに関する知識
- 5年ぐらい前にインスタンスを一個つくったっきり

次回から詳細書いていきます。
[AWSを使ってみる②](https://qiita.com/tktk0601/items/3d425ea175eea69ab8e5)
SiteGuard WP Plugin 導入後、新規ユーザーでログインができない

SiteGuard WP Plugin 導入後、新規ユーザーでログインができない事象が発生したため、経緯を残します。

■経緯
1.SiteGuard WP Plugin 導入後、新規にユーザーを登録したところ、ID、パスワードがあっているにもかかわらずログインできない状態となった。
　（別のアカウントログインし、管理画面でパスワードを変更しても、ログインできず）
2.調査したところ、「SiteGuard WP Plugin」の画像認証で不具合があることが判明
3.該当サイトでは、「SiteGuard WP Plugin」の画像認証は使っていない。
4.念の為、該当サイトの検証環境で新規ユーザーを作成してみたところ、同じくログインできない状態となった。
5.検証環境は「SiteGuard WP Plugin」で画像認証を使っている。
6.試しに上記のサイトでの解決方法を検証環境でためしてみたが、解決されず。
　検証環境で「SiteGuard WP Plugin」の画像認証をOFFにしても、改善されなかった。

■解決
画像認証ではなく、ブラウザーのキャッシュによるものだった。

1.ブラウザーのキャッシュをクリアする
2.新規ユーザーを作成、もしくは、管理画面でパスワードを変更する
3.再度キャッシュをクリアし、新規ユーザーのID、パスワードでログイン。ログインできた。
Sublime Text 童貞卒業のために(Mac) Part.2 Package Control〜日本語化

# はじめに
こんにちは。ぷるぷえです。
今回は、「Package Control」のインストール → メニューの日本語化まで進めます。
フル日本語化は、別途記事にして投稿します。

# 環境
- MacOS Mojave
- Sublime Text 3 (3.2.1)

# アウトライン
1. そのまま使うなんて勿体無い
2. 下準備
3. 日本語化パッケージを入れてみる

# 1. そのまま使うなんて勿体無い
タイトルの通りです。
テキストエディタは、目的や好みに沿ってカスタマイズすることで真の力を発揮します。
Sublime Text などのテキストエディタは、便利な「**パッケージ**」が豊富にあります。
上級者なんかだと、効率化のために自作する人もいるくらいです。
それでは、少しカスタマイズしてみましょう。

# 2. 下準備
カスタマイズ前の準備をします。
「**パッケージ**」を簡単にインストール・管理できる「**Package Control**」を入れます。
使ってみればわかります。

1. 「**Package Control**」のサイトにアクセス
https://packagecontrol.io/installation
2. 下図、赤枠内のPythonコードをコピー(Command + C)
![スクリーンショット 2019-07-11 17.24.43.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/242292/e98de1d1-adf2-37aa-7f0f-f4b49481f566.png)

3. メニューバーから「View → Show Console」を開く
![スクリーンショット 2019-07-11 17.16.23.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/242292/c3fb02db-36bc-edb5-f9fc-fcb38170c6bb.png)

4. 下図赤枠にペースト（Command + V）して、Enterキー押下
Enterキーを押下すると、なにやらダウンロードなんかが始まります。
![スクリーンショット 2019-07-11 17.28.26.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/242292/64043878-f046-c731-fa21-29b90bfe3a74.png)

5. ダウンロード終了後、escキーで離脱。「**Package Control**」ファイルを確認
メニューバーから「Sublime Text → Preference → Brows Packages」をクリックすると、Packages/から格納されたパッケージが確認できます。
![スクリーンショット 2019-07-11 17.34.48.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/242292/682080c9-5899-30fc-ec19-94cd0f497392.png)
![スクリーンショット 2019-07-11 17.38.36.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/242292/a0a425af-54cf-afc5-9b2f-863d6c55b963.png)
以上で、「Package Control.sublime-settings」ファイル格納done!!

# 3. 日本語化パッケージを入れてみる
パッケージを入れるためのパッケージを入れました。
それでは、便利なパッケージをインストールしてみましょう。

1. 「Command + Shift + P」でコマンドパレットを開き、「install」と入力。
「Install Package」を選択。
![スクリーンショット 2019-07-11 17.45.09.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/242292/7f3c8111-eb9c-2df1-33d5-2a6c1d6afe62.png)

2. こんな画面になっていればおけ。
ここから公開されているパッケージを検索してインストールしていきます。
![スクリーンショット 2019-07-11 17.47.48.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/242292/a92ffe17-44fa-0a1b-1681-f24259a897f6.png)

3. 日本語化パッケージ「**Japanize**」をインストール
コマンドパレットで「Japanize」を検索し、インストールします。
![スクリーンショット 2019-07-11 17.53.01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/242292/9c8aa34f-5f96-5c73-6a5f-ca7dc15772e2.png)

上のメニューバーが日本語になりました。
![スクリーンショット 2019-07-11 18.09.04.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/242292/9a403b1e-e0db-34d1-afc9-5e3205da346d.png)


以上で、メニューの日本語化までできました。

次回は、Sublime Text 3 を Markdown エディタにしていきます。
お疲れ様でした。
Node.jsとJXAでMacのアプリが起動中かどうか調べる

AppleScriptでもいいですが、JXAだとワンライナーで完結していい感じです。

```js:isAppRunning.js
const promisify = require("util").promisify;
const exec = require("child_process").exec;
const execp = promisify(exec);

const appName = "Slack";

(async () => {
  const { stdout } = await execp(
    `osascript -l JavaScript -e "Application('${appName}').running()"`
  );
  console.log({ stdout });
})();
```

注意点としては、返り値がBooleanっぽいけどStringだと言うことです。
上の書き方だと `{stdout: 'true\n'}`のような感じになります。
返り値を ```return stdout === "true\n"``` にして、```Promise<boolean>```として扱うのがいいかもですね。

他にもいい方法があったらぜひ教えて下さい。
調べてもあんまり見つからないんですよね。

たぶんSwiftが使えればもっとつおくなれる。
PythonのNaNに関する注意事項

# 概要
これでハマったのでメモ

# 現象
あるリストの中の値の最大値、最小値を取得する時に発生

```
> import numpy as np
> max([1, 2, np.nan])
2
```

これは至極当然

```
> max([np.nan, 1, 2])
nan
```

！？

というわけで、先頭が異なるだけで結果が異なりますので注意
Laravelでaxiosのリクエストを受け取る際、$request->ajax()がfalseになる時の対応

## TL;DR
headerに```X-Requested-With: XMLHttpRequest```を付けよう

## 背景
Laravel 5.4
@nuxtjs/axios 5.4.1

axiosでGETリクエストをした際、サーバー側で以下のような処理があり、JSONを返してほしいのにHTMLが返ってきて？となった

```
if ($request->ajax()) {
    // JSONを返す処理
} else {
    // HTMLを返す処理
}
```

よくよく調べてみたら、↓の記事にもあるようにヘッダーの```X-Requested-With```で判断しているらしい
https://qiita.com/harunbu/items/8b746e589b7689ce0eb7

```
axios.get("http://hoge/getContents", {
    headers: { "X-Requested-With": "XMLHttpRequest" },
    data: {}
})
```
で無事解決
CSSをレスポンシブ対応にする（基礎）

##メディアクエリの作成

```css:sample.css
/*PCサイズでは赤に*/
h1 {
  color: red;
}

/*タブレットサイズでは青に*/
@media (max-width: 1000px) {
  h1 {
    color: blue;
  }
}

/*スマホサイズでは緑に*/
@media (max-width: 670px) {
  h1 {
    color: green;
  }
}
```
```html:index.html
<!--viewportを設定することで、メディアクエリを有効化-->
<head>
  <!--下記をheadタグに追加-->
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
```

##レイアウト崩れの対処（box-sizing）
```css:sample.css
.item {
  width: 25%;
  float: left;
  /*25%に15pxのpaddingが含まれず、レイアウトが崩れる*/
  padding: 0 15px;
}

/*下記を指定することで、paddingやボーダーも含めて25%になる*/
* {
  box-sizing: border-box;
}
```

##レイアウト崩れの対処（clear）
```html:sample.html
<!--childがfloatされてる場合、parentの高さが0になる-->
<div class="parent">
 <div class="child"></div> 
 <div class="clear"></div>
</div>
```
```css:sample.css
/*parentの高さをchildに合わせるため、clearを指定*/
.clear {
  clear: both;
}
```

##その他ポイント
・pxではなく%の指定に変える。
・フォントやボタンのサイズ、余白を見やすさに応じて変更。
・非常に大きい画面を想定し、max-widthを設定。
　（例）`max-width: 1170px; width: 100%;`
・ヘッダ部などをテキストからアイコンに変えるなど、見やすくする。
Laravelで独自バリデーションでのエラーメッセージがおかしい時

## 環境
Laravel Framework 5.6.26
 
## 状況
まず、独自のValidatorとなる部分を作る

```php:PersonValidator.php
	public function validateAgeSizeLimit($attribute,$value,$parameters){//ageSizeLimitという名前でルールを定義
		return $value <= 100;
	}
```

```php:PersonRequest.php
    public function rules()
    {
        return [
            'age'=>'ageSizeLimit', //先ほど作った独自のルールを指定
        ];
    }

    public function messages()
    {
        return [
        'age.ageSizeLimit'=>'年齢は100歳までの値で入力してください',
        ];
    }
```

上記のバリデーションならLaravelがあらかじめ用意してる『max:100』だけでも可能です。
この独自ルールを作る際、「validate」の後の最初の部分を小文字にしたものを使えるということは知っていた。
例) 「validateHello」なら、「hello」という名前でルールが使える。

なので、上記の「PersonValidator.java」での「validateAgeSizeLimit」
という名前なら「ageSizeLimit」という名前で使えると思って使ってみたら、
バリデーションエラーメッセージに「validation.age_size_limit」
となり、本当は「年齢は100歳までの値で入力してください」と表示したかったのだが、、、

<img width="266" alt="スクリーンショット 2019-07-11 17.44.44.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/179803/31a4f800-ff15-d93f-f8dc-95b326bf45f3.png">


## 解決方法
ん？関数名がスネークケースになったものが表示されているな？
もしかしてキャメルケースではなくスネークケースにしなきゃいけないってことなのか？と名推理が働きました。

```php:PersonRequest.php
    public function messages()
    {
        return [
        'age.age_size_limit'=>'年齢は100歳までの値で入力してください'
        ];
    }
```

<img width="352" alt="スクリーンショット 2019-07-11 17.45.19.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/179803/5524f596-355b-59af-badc-eb1809e5ea5b.png">

直った！！
正しい書き方をさりげなく出力してくれていたんですね。。。

##結論
オリジナルバリデータを作る際、ルール名となる関数名を使う場合は、
rules関数ではキャメルケースでよくて、messages関数ではスネークケースにする。
JavaScriptを触ってみた Part.2 オブジェクト指向

# はじめに
ちゃんとがっつり開発のエンジニア歴2ヶ月目が学んだことをまとめる備忘録。
最近はまた毎日新しく学ぶことがたくさんで、楽しい気持ちとちょっと情報がたくさんすぎて追いつかないぞ！！！ってなっています。そんな自分の外付けHDDみたいな感じで書いていこうと思います！


↓ちなみにこれまでの記事はこちら
- [第15弾](https://qiita.com/icchy_sh33p/items/da6118dce1aa134d66e1)
- [第16弾](https://qiita.com/icchy_sh33p/items/6c6cf70f43b318a526c8)
- [第17弾](https://qiita.com/icchy_sh33p/items/c58213d9b0c1d6bbacd5)

今日はふたつも記事をあげましたよ(.・v・)ノ


# オブジェクト（Object）の原義
- Object・・・物体、対象、目的（from [weblio英和辞典](https://ejje.weblio.jp/content/object)）

# オブジェクト指向とは
- 開発における考え方。
- 作成するアプリケーションなどを**ものとして捉えて**考える開発手法。

## Javaにおけるオブジェクト指向
- 基本の考え方は[上記](https://qiita.com/icchy_sh33p/items/dc00f27d8cb6cc2f4385#%E3%82%AA%E3%83%96%E3%82%B8%E3%82%A7%E3%82%AF%E3%83%88%E6%8C%87%E5%90%91%E3%81%A8%E3%81%AF)と同じ。
- クラスとその中に書かれているコードをもとにインスタンス化して作成
→つまり、**設計図からものを作っていく**というイメージ。
- 存在するのは、**クラス**と**インスタンス**のふたつ。

### クラス
- Javaにおける **『設計図』** としての役割をもつ。
- クラスの中で実際の設計を行なっていくので、以下のようなものがクラスの中に存在する。
    - **メソッド**・・・設計図の中でも作るものの **『振る舞い』** を記載したもの
    - **コンストラクタ**・・・オブジェクト作成時に同時に作られる処理

### インスタンス
- 実物。実際に作られているものという認識。
- クラスの**インスタンス化**
・・・クラスを実物化して、そのクラスの中で使えるようにしたもの。インスタンス化した結果できたのが**オブジェクト**
＝クラスは**オブジェクトの設計図！**

## JavaScriptにおけるオブジェクト指向
- 基本の考え方は[上記](https://qiita.com/icchy_sh33p/items/dc00f27d8cb6cc2f4385#%E3%82%AA%E3%83%96%E3%82%B8%E3%82%A7%E3%82%AF%E3%83%88%E6%8C%87%E5%90%91%E3%81%A8%E3%81%AF)と同じ。
- JavaScriptの場合は、**クラスが存在しない**のが大きな特徴のひとつ
- クラスの代わりに**プロトタイプオブジェクト**が存在する
    - **プロトタイプオブジェクト**
    ・・・設計図としてのオブジェクト（オブジェクトを毎回書かなくても済むように作成）
- JavaScriptにおける**オブジェクト**
・・・実体、実物（Javaにおける**インスタンスに近いもの**）。
- 同じオブジェクトを何度も作るのが大変／機能を追加したい

→もととなるオブジェクトを利用してもっと簡単に対応できるように作られたのが**プロトタイプオブジェクト**
→つまり、もともとあるものから**設計図を使ってより作りやすさを求めていく**というイメージ。

# まとめ
- JavaでもJavaScriptでもおおもととなるオブジェクト指向の考え方については一緒
    - 開発する対象を **『もの』として見る** ことで設計図と実体が存在する
- ただ、オブジェクト指向の中でアプローチの仕方が反対
    - Javaは設計図をもとに**ものを組み立てていって完成させる**というイメージ
    - JavaScriptは、作られた実体をもとに、**さらに設計図や実体を作成していき、それらを使って最終的なものを完成**させるというイメージ

# あとがき
オブジェクト指向って大事だよって話はPythonを触っていたときから、今JavaやJavaScriptを学んでいる間もちょこちょこ注意はあったけど、どこまで自分って理解しているんだろう・・・というか、そもそもちゃんとわかっているのかなぁと思ってしっかり一度まとめてみてもいいかも、と思って今回はオブジェクト指向についてにしました！

オブジェクトのイメージは正直あまり理解しきれていなかったり、このコトバ、知ってはいるけど意味なんだっけ・・・ってわからないことがあったりしましたが、まとめるにあたって改めて調査したり、参考書を読んで落とし込んでなんとか今理解できているレベルまではかけたかなぁと思います。

アウトプットすることで時間がかかることもありますが、自分の頭の情報を整理して補完することができるので、改めてこうやって人を意識してまとめるって大事なんだなぁと再認識しました！！！

またまとめようと思います！！
ではでは
Bashの起動が遅い時の雑な調査法

ある時、ふと気がつくと

**ターミナルを起動した時、プロンプトが表示されるまで、５秒ぐらいかかる**

ようになっていました。

`~/.bashrc` に何か重い処理があるせいだと思いますが、具体的にどの処理なのかは見当がつきません。

# 調べ方

`-x` オプションをつけて新しいBashを起動しましょう。

```shell
$ /bin/bash -x
```

すると、`/etc/profile` `.bash_profile` `.bashrc` などの読み込み処理が、出力されます。

```
+ source /etc/profile
++ '[' -x /usr/libexec/path_helper ']'
+++ /usr/libexec/path_helper -s
++ eval 'PATH="/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin:/usr/local/munki:/opt/X11/bin:/Users/foo-bar/.quarry/bin:/Users/foo-bar/.rbenv/shims:/Users/foo-bar/Documents/pungi/apps/ansible/bin:/Users/foo-bar/Documents/pungi/apps/httpie/bin:/Users/foo-bar/.pyenv/shims:/Users/foo-bar/.pyenv/bin:/usr/local/heroku/bin:/Users/foo-bar/dotfiles/bin:/Users/foo-bar/bin:/Users/foo-bar/.cabal/bin:/Users/foo-bar/.local/bin:/Users/foo-bar/node_modules/bin:/Applications/Visual' Studio 'Code.app/Contents/Resources/app/bin/:/usr/local/share/git-core/contrib/diff-highlight:/usr/share/doc/git/contrib/diff-highlight:/Users/foo-bar/.git-hooker/bin:/usr/local/go/bin:/Users/foo-bar/gocode/bin:/Users/foo-bar/node_modules/.bin:/Users/foo-bar/instantclient_11_2/:/usr/local/Cellar/terminal-notifier/2.0.0/bin/:/Users/foo-bar/xsvutils/bin:/Users/foo-bar/.gem/ruby/2.3.0/bin:/Users/foo-bar/.rbenv/bin:/Applications/MacVim.app/Contents/MacOS:/usr/local/haskell/ghc-7.8.3-x86_64/bin/:~/Documents/m3kit/bin";' export 'PATH;'
+++ PATH='/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin:/usr/local/munki:/opt/X11/bin:/Users/foo-bar/.quarry/bin:/Users/foo-bar/.rbenv/shims:/Users/foo-bar/Documents/pungi/apps/ansible/bin:/Users/foo-bar/Documents/pungi/apps/httpie/bin:/Users/foo-bar/.pyenv/shims:/Users/foo-bar/.pyenv/bin:/usr/local/heroku/bin:/Users/foo-bar/dotfiles/bin:/Users/foo-bar/bin:/Users/foo-bar/.cabal/bin:/Users/foo-bar/.local/bin:/Users/foo-bar/node_modules/bin:/Applications/Visual Studio Code.app/Contents/Resources/app/bin/:/usr/local/share/git-core/contrib/diff-highlight:/usr/share/doc/git/contrib/diff-highlight:/Users/foo-bar/.git-hooker/bin:/usr/local/go/bin:/Users/foo-bar/gocode/bin:/Users/foo-bar/node_modules/.bin:/Users/foo-bar/instantclient_11_2/:/usr/local/Cellar/terminal-notifier/2.0.0/bin/:/Users/foo-bar/xsvutils/bin:/Users/foo-bar/.gem/ruby/2.3.0/bin:/Users/foo-bar/.rbenv/bin:/Applications/MacVim.app/Contents/MacOS:/usr/local/haskell/ghc-7.8.3-x86_64/bin/:~/Documents/m3kit/bin'
（以下、すごい量のログが出てくる）
```

途中で時間がかかっているコマンドがあるかもしれません。それを潰しましょう！！

私の場合は `brew --prefix` を何度も実行しているのが原因でした。
RSeleniumが変なエラー吐いて落ちた！ <- docker内の dev/shm の容量不足が原因だった件

# 鼻歌まじりにWEBクロールしていて、突如の悪魔の囁き...

```
Selenium message:unknown error: session deleted because of page crash from unknown error: 
cannot determine loading status
```
げ、なんだよこれ。

変な書き方してたかな...とまずは自分を疑いコードを見直すも、
どこもおかしい所は無い。

【追記 2019/7/11】
#まずは解決策
```
docker run -it --shm-size=1024m ...
```
/dev/shm の容量が足りないこと、dockerのデフォルトが64MBであることが原因なので、
docker runの時に指定してあげるとどのホストOSでも動くと思います。(Macで確認)

Linux hostであれば下記の解決策、
"-v /dev/shm:/dev/shm" コンテナ内からホスト側の/dev/shm にマウントしてしまうのが一番メモリのムダが無いです。


以下は以前のバージョンです：

...えー...
てわけでエラーメッセージでググります：

これだ！
SO先生偉い！

##unknown error: session deleted because of page crash from unknown error: cannot determine loading status from tab crashed with ChromeDriver Selenium

https://stackoverflow.com/questions/53902507/unknown-error-session-deleted-because-of-page-crash-from-unknown-error-cannot


原因としては
「dockerコンテナ内で起動すると、/dev/shm が凄く小さいので溢れて落ちることがある」
のだそうで。

ここでDebanjanBさんより示されている対策は3つ：

#ホストの /dev/shm を使う - docker run に以下を追加
```
-v /dev/shm:/dev/shm
```

#/dev/shm を大きくしてリマウント： コンテナ内から
```
sudo mount -t tmpfs -o rw,nosuid,nodev,noexec,relatime,size=512M tmpfs /dev/shm
```


#chrome_optionsに以下のどちらかを追加：
```
# sandboxを無効に (あれ？すでにやってるけど)
chrome_options.add_argument('--no-sandbox')   

# shm を無効に (遅くなるとのこと)
chrome_options.add_argument('--disable-dev-shm-usage')
```

自分は -v /dev/shm:/dev/shm を足して起動する方法で解決しました！
(Linuxホストじゃないと使えないかも？)

逆に二番目はエラーで実行出来ませんでした。
3番めは試していません。


もし同じエラーで困った方が居たら参考になれば幸いです。
CakePHP3のマイグレーションのロールバックで失敗する

# はじめに
- 外部キーありのカラムを追加するマイグレーションを作成して、ロールバックを行ったところ、エラーが発生しました

# TL;DR
- ロールバックの際に追加したカラムを削除する前に、外部キーを削除することで、ロールバックができるようになりました

# 環境
PHP 7.2
CakePHP 3.5

# マイグレーションファイル

- downメソッドにて、「dropForeignKey」を行った後に「removeColumn」を行うことで、ロールバックができました
    - dropForeignKey : 外部キーを削除します
    - removeColumn : カラムを削除します


```AddTestIdToHoges.php
<?php
use Migrations\AbstractMigration;

class AddTestIdToHoges extends AbstractMigration
{
    /**
     * Up Method.
     *
     * @return void
     */
    public function up()
    {
        $table = $this->table('hoges');
        $table->addColumn('test_id', 'integer', [
            'comment' => 'テストID',
            'limit' => 11,
            'null' => false,
        ])->addForeignKey('test_id', 'tests', 'id');
        $table->update();
    }

    /**
     * Down Method.
     *
     * @return void
     */
    public function down()
    {
        $table = $this->table('hoges');
        $table->dropForeignKey('test_id');
        $table->removeColumn('test_id');
        $table->update();
    }
}
```
JavaScript タップして画像を切り替える


##はじめに

[未来電子テクノロジー](https://www.miraidenshi-tech.jp/intern-content/program/)でインターンをしている坂口です。
プログラミングを始めて2週間目。今週は初めてHTMLとCSSを自分で書いて、Github上でホームページを作成しました。
その際に、タップすると画像がどんどん切り替わってループするJavaScriptを実装したのですが、そのコードが、JavaScriptの仕組みを一切分かっていない初心者にも使いやすいものだったので、シェアします。


##コードがこちら

```html
<img id="mypic" onclick="slideshow()" src="img1" width="" height="">
    <script>
      var pics_src = new Array ("img1", "img2", "img3");
      var num = 0;

      function slideshow(){
           if (num == 2) {
               num = 0;
           }
           else {
               num ++;
           }
           document.getElementById("mypic").src=pics_src[num];
       }
    </script>
```

このうち自分で入力しなければいけない部分は、img1~3と、width、height、そしてnum == ?（上のコードでは2） の部分です。

まず、img1~3にはその通りに、1番目に表示したい画像、2番目に表示したい画像の順番で、その画像のURLやファイル名を入力します。（※img1を入力するのは二ヵ所あります）
このコードでは3枚しか画像を表示しないことになっていますが、4枚目、5枚目の画像を表示したければ、その都度同様に""に入れて画像を追加していってください。

一行目のwidthとheightでは、表示させる画像の幅と高さを設定します。
1枚ごとに幅と高さを設定することはできないので、同じ縦横比の画像を使うことが好ましいですね。
（もっとJavaScriptに詳しければ、1枚ごとに幅とかを変えるようなコードを書くこともできるのでしょうか…初心者坂口にとっては未知の世界です）

そして、最後に大事な部分なのですが、if (num == ?)の?の部分を入力します。
上のコードでは、全部で3枚の画像が切り替わるようになっているので、3-1で2となっています。
つまり、表示させる画像の総数-1の値を?に入力してください。
全部で4枚なら?には3を、全部で5枚なら?には4を、といった具合です。

ちなみに、なぜ総数-1になるのかと言うと、このコードには一枚目の画像を0と設定するようになっていて、0,1,2と進んでいって2になったら0に戻る！という指示がされるようになっているらしいのです。
だから、この?には0から数えていって、どの数字になったら0に戻るか、を入力しなければならない、ということです。
（1から数えたら、?には画像の枚数をそのまま入力すればいいだけなので、よっぽど分かりやすいのに…と初心者的には考えてしまいますが）

##まとめ

今回は、JavaScriptにまったく触れたことがない人を想定して、ものすごくかみ砕いて説明してみました。
（なぜなら、自分が初心者の身で、ネット上のみなさんのコードの解説を理解するのにとてつもなく苦労したので）
同じようなプログラミング初心者の方に少しでも参考になれば幸いです。

また、私自身プログラミング初心者であるため、内容に誤りがあるかもしれません。
もし、誤りがあれば修正するのでどんどん指摘してください。よろしくお願いいたします。
Ubuntu18.04でChrome Remote Desktop HostをWeb版からインストールした時のメモ

友人に頼まれて、Ubuntu18.04にWeb版移行後のChrome Remote Desktopのホストをツッコんだときのメモ

#環境
 - Ubuntu 18.04 / デスクトップ環境はKDE Plasma
  - Xubuntuインストール後にKDEをインストールとかいう誰得環境
 - Google Chromeは**導入済**


#大まかな設定

まずは、[**Web版 chromeリモート デスクトップ**](https://remotedesktop.google.com)で、ダウンロードボタンから**Hostのダウンロード**と**Chrome拡張機能の追加**を行います。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/278932/0cff084d-47d0-06a7-07ae-d37c96c5b8ae.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/278932/08ac0a71-156a-90f2-c7f1-d35cff7ed50e.png)


Ubuntu 18.04でアクセスしていた場合、`chrome-remote-desktop_current_amd64.deb`がダウンロードされますので、画面を気にせず`dpkg`なり`gdebi`なりでインストールします。

その後は、こちらの記事

- [**外出先から自宅のUbuntu18.04に接続する(Chromeリモートデスクトップ)**](http://xvideos.hatenablog.com/entry/chrome-remote-desktop-ubuntu1804)

を参考に設定します。後述する理由により、

- **3. グループへの追加**
- **4. Chromeリモートデスクトップの修正**

のみを参考にします。

4.の設定を行うことで、画面に表示されているXセッションをリモートすることができるようになるようです。
逆に言うとデフォルトのままだと別のXセッションが立ち上がって、接続されたディスプレイに映る画面とリモート先に映る画面が別になってしまう...らしい。

#だめだった......

**導入時(2019/07)**には、Chromeアプリが[**Webストア**](https://chrome.google.com/webstore)から導入できなくなっていたので、記事通りに設定ができません。
かつ、記事通りに設定ファイルを変更しても、このままでは、`このデバイス`から有効化ができませんでした。

でも、`リモートサポート`からアクセスコードを発行すれば、**接続できる**というよくわからない状態になってました。
？？？？

#詰んだ

悩んでも埒が明かないので公式ヘルプを確認したところ、
>[**Linux**](https://support.google.com/chrome/answer/1649523#linux-crd) で Chrome リモート デスクトップを使用する方法をご覧ください。

のリンクが仕事しなくなっていたので、ここで**詰みました。** あぼーん

#ふと思い出した
[**参考記事の参考情報**](http://xvideos.hatenablog.com/entry/chrome-remote-desktop-ubuntu1804#参考情報)に

>[**Google Chrome ヘルプ**](https://support.google.com/chrome/answer/1649523)を見るとホーム ディレクトリに`.chrome-remote-desktop-session`というファイルを作らないといけない。と書いてありますが今回の手順をとった場合は**_必要ありません_**。

とありました。
以前16.04に導入した時に参考にした記事では、`.chrome-remote-desktop-session`ファイルを作成し、中にセッション設定のコードを記載するようでした。

もしかしてと思い、ダメ元でこのファイル(とりあえず**中身は空**)をホームディレクトリに作成してみたところ、**有効化できてしまった......**（本当に空でいいのかはわかりません）

もしかしてこのファイルの存在如何でも見てるのかな？と思ったり

あとは、画面に表示される通りにPinを設定すれば、Googleアカウントに**紐付ける**ことができるようになります。（丸投げ）


#最後に
####今回やったことまとめ
1. `chrome-remote-desktop_current_amd64.deb`を**インストール**する
2. 参考記事通りに、カレントユーザを`chrome-remote-desktop`グループに追加して**再起動**
3. 参考記事通りに、`/opt/google/chrome-remote-desktop/chrome-remote-desktop`を**変更**
4. ユーザのホームディレクトリに`.chrome-remote-desktop-session`ファイルを**作成** (とりあえず空)

以上になります。

設定後にAndroidから接続してみたところ、ホスト上の音声は転送されないようです。（残念）
それ以外は、Windowsホストなどに接続した場合と同じように操作できました。

記事を書き終わったに、`.chrome-remote-desktop-session`についてちゃんと書いてある[**記事**](https://qiita.com/k_ikasumipowder/items/c173fb92cf12c75b2375)を見つけて、この記事の存在価値を疑いたくなりました。
やっぱりちゃんと記述したほうがいいのかなとも思いつつ、初心者の足掻き兼備忘録ということでひとつ。

#参考・引用

- [**外出先から自宅のUbuntu18.04に接続する(Chromeリモートデスクトップ)**](http://xvideos.hatenablog.com/entry/chrome-remote-desktop-ubuntu1804)　xterm256color様

参考先の記事をわかり易く翻訳されていて大変助かりました。この場を借りて感謝申し上げます。

- [**UbuntuでChromeリモートデスクトップ**](https://qiita.com/fxst24/items/dd4fe65e1e9720fff378)　fxst24様
- [**Ubuntu へ Chrome Remote Desktop を使ってMacからリモート接続**](https://qiita.com/k_ikasumipowder/items/c173fb92cf12c75b2375)　k_ikasumipowder様

- [**Google Chrome ヘルプ**](https://support.google.com/chrome/answer/1649523)
Java圧縮PDFドキュメント

この文はJavaでPDF文書を圧縮する方法を以下の二つの面から紹介します。
•文書の内容を圧縮する
•ドキュメントの画像を圧縮する

文書の内容を圧縮する:

```Java
import com.spire.pdf.*;

public class CompressPDF {
    public static void main(String[] args) {
        String inputFile = "Sample.pdf";
        String outputFile = "output/CompressPDFcontent.pdf";

        PdfDocument document = new PdfDocument();
        document.loadFromFile(inputFile);

        document.getFileInfo().setIncrementalUpdate(false);
        document.setCompressionLevel(PdfCompressionLevel.Best);

        document.saveToFile(outputFile, FileFormat.PDF);
        document.close();
        }
    }
```
![Compress PDF content.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/278784/57a07deb-8a9e-04ff-fa14-e9e26e37baf3.png)

ドキュメントの画像を圧縮する

まず、元のPDF文書の画像を抽出し、画質を低下させることで、画像を小さくし、縮小された画像を元のドキュメントの画像に置き換えることで、PDF文書のサイズを低減します.

```Java
import com.spire.pdf.*;
import com.spire.pdf.exporting.PdfImageInfo;
import com.spire.pdf.graphics.PdfBitmap;

public class CompressPDF {

    public static void main(String[] args) {

        String inputFile = "Sample.pdf";
        String outputFile = "output/CompressPDFImage.pdf";

        PdfDocument document = new PdfDocument();
        document.loadFromFile(inputFile);

        document.getFileInfo().setIncrementalUpdate(false);

        for (int i = 0; i < document.getPages().getCount(); i++) {

            PdfPageBase page = document.getPages().get(i);
            PdfImageInfo[] images = page.getImagesInfo();
            if (images != null && images.length > 0)
                for (int j = 0; j < images.length; j++) {
                    PdfImageInfo image = images[j];
                    PdfBitmap bp = new PdfBitmap(image.getImage());
                    bp.setQuality(20);
                    page.replaceImage(j, bp);

                }
        }
        document.saveToFile(outputFile, FileFormat.PDF);
        document.close();
    }
}
```
![Compress PDF image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/278784/1a51b42e-e583-19af-1730-b2e5ed10a562.png)
swiper-isearch-region

swiper-isearch をregion選択状態からも使えるようにするための設定です。

PS: 
[ballforest](https://qiita.com/ballforest)さんから、`swiper-thing-at-point/swiper-iserch-thing-at-point` という関数を教えてもらったので修正しました。

## 設定
```emacs-lisp
(bind-key "C-s" 'swiper-isearch-region)
(bind-key "M-s" 'swiper-isearch-thing-at-point)
(bind-key "M-S" 'swiper-thing-at-point)

(defun swiper-isearch-region ()
  "If region isn't selected, `swiper-isearch'.
If region is selected, `swiper-isearch-thing-at-point'."
  (interactive)
  (if (not (use-region-p))
      (swiper-isearch))
  (swiper-isearch-thing-at-point))

```
tiptapのコードブロックの下に空行を挿入する方法

- Vue: ^2.6.10
- tiptap: ^1.23.1

[tiptap](https://github.com/scrumpy/tiptap)を使っていて、困ったことがありました。
tiptapを使えば、ハイライト付きのコードブロックが簡単に実装できます。
しかし、挿入されたコードブロックからカーソルを外すには、command+Z(macだと)するか、コードブロック以外の要素をクリックするかしかないみたいでした。
これだと、エディト領域の一番下にコードブロックが作られた場合に不便です。
コードブロックが挿入されたら、その下に空行を挿入することで、上記の問題を解決したので、共有します。

```editor.vue
<template>
  <div class="editor" style="width: 100%;">
    <editor-menu-bar :editor="editor" v-slot="{ commands, isActive }">
      <div class="menubar">

        <button
          class="menubar__button"
          :class="{ 'is-active-button': isActive.code_block() }"
          @click="startCodeBlock(commands, isActive)">
          <font-awesome-icon icon="code" />
        </button>

      </div>
    </editor-menu-bar>

    <editor-content class="editor__content" :editor="editor" />
  </div>
</template>

<script>
import { Editor, EditorContent, EditorMenuBar } from 'tiptap'
import { safeInsert, findBlockNodes } from 'prosemirror-utils'
import python from 'highlight.js/lib/languages/python'
import {
  CodeBlock,
  CodeBlockHighlight
} from 'tiptap-extensions'
export default {
  components: {
    EditorContent,
    EditorMenuBar,
  },
  data() {
    return {
      editor: new Editor({
        extensions: [
          new CodeBlock(),
          new CodeBlockHighlight({
            languages: { python }
          })
        ],
        content: ``,
      }),
    }
  },
  beforeDestroy() {
    this.editor.destroy()
  },
  methods: {
    startCodeBlock(commands, isActive) {
      commands.code_block()
      if (isActive.code_block()) {
        this.insertEmptyLineBelowCodeBlock()
      }
    },
    insertEmptyLineBelowCodeBlock() {
      const { schema, state, view } = this.editor
      const selection = state.tr.selection
      const anchorPos = selection.$anchor.pos
      const blockNodes = findBlockNodes(view.state.doc)
      for (const { node, pos } of blockNodes) {
        // コードブロックの場所より下に何らかのnodeがある時は空行を挿入する必要がないので、return
        if (anchorPos < pos) {
          return
        }
      }
      // <p>をコードブロックの下にinsertする(https://github.com/atlassian/prosemirror-utilsのsafeInsertを利用)
      const p = schema.nodes.paragraph.create()
      view.dispatch(safeInsert(p, anchorPos)(state.tr))
      // 選択カーソルをコードブロック内に戻す
      view.dispatch(view.state.tr.setSelection(selection))
    }
  }
}
</script>
<style>
.ProseMirror pre {
  white-space: pre-wrap;
  width: 100%;
}
.editor__content pre {
  padding: .7rem 1rem;
  border-radius: 5px;
  background: #000;
  color: #fff;
  font-size: .8rem;
  overflow-x: auto;
}
.editor__content * {
    caret-color: currentColor;
}
.is-active-button {
  background-color: antiquewhite
}
</style>
【FileMaker】続・和暦で入力して西暦で表示する　元号マスタ編

[前回](https://qiita.com/tyuma/items/3eb26371565803f30cc4)は単純に値一覧で管理している元号を元にカスタム関数を使って和暦を西暦に変換しました。
今回は、もう少しシステムのマスタ管理をする人とシステム開発者が楽ができるような設計です。

# 動き
動きは前回と変わりません。
和暦を選択し、和暦で年月日を入力すると、、、
<img width="542" alt="qiitawareki1.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/60538/4eb13798-72a5-273d-dafe-98778deab41c.png">

和暦・西暦で展開します。
<img width="598" alt="qiitawareki2.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/60538/9e60b694-f4cc-43a2-386c-3d3427277708.png">

# 実装

## 概要
元号マスタを管理し、実際に使うテーブルの和暦とリレーションシップをとります。

## 元号マスタ
元号マスタとして管理するのは、以下の通りです。
ここでのポイントは、表示順を持つことです。
値一覧で表示順でソートをして表示します。
表示順も表示されてしまいますが、表示順を隠す方法は今回の記事とは関係ありませんので割愛します。
<img width="415" alt="qiitawareki3.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/60538/6d231c1a-ba7d-f9d3-e7e1-5c3b2d8a0fcd.png">

データは単純に元号に関するデータのみです。
<img width="398" alt="qiitawareki4.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/60538/daaf9e46-bef2-b796-92db-cd365ce95619.png">

## 元号マスタとのリレーションシップ
前回作成したテーブルのデータ構造を壊したくないので、新たにフィールドを追加しました。
役割としては、前回のものとほぼ同じです。
違う箇所は、今回の和暦フィールドは数字として持ち、これを元号マスタの表示順と紐付けるところです。
<img width="421" alt="qiitawareki5.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/60538/78752945-f6aa-8cc4-05e3-e3aee5b71a1d.png">

リレーションシップを表示順にすると、表示順が違ってしまったらどうする、、、との声もありそうですが、今回は元号という順番が入れ替わらないものですのでこのままで。
<img width="379" alt="qiitawareki6.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/60538/64d0e9d9-3f42-73ed-34eb-81da5a9b02a1.png">

## 値一覧の設定
値一覧は、ソート順を表示順にすることを忘れずに設定します。
<img width="718" alt="qiitawareki7.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/60538/ede876a0-6181-6c19-f8c3-c2576ce3b3ce.png">

## レイアウト上の設定とスクリプト
レイアウトに配置したフィールドも前回と特に変わりません。
違うのは、フィールド名と指定するスクリプトです。
<img width="632" alt="qiitawareki9.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/60538/76ddc2b7-5aff-8c20-1218-6094786c6ed4.png">
<img width="634" alt="qiitawareki10.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/60538/f0da2609-7e09-00f1-cca4-eca21d178002.png">

スクリプトトリガで設定するスクリプトは、単純にフィールド設定のみとなります。
元号マスタとリレーションシップをとっているため、元号の略称を引っ張ってこれます。
<img width="911" alt="qiitawareki11.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/60538/cc52353a-4d61-a52e-845e-86ed4921290e.png">

# マスタ化するかどうかの判断について
マスタ化するとなると、メンテナンスするテーブルやデータが増えることになりますので、できればそういうのが無いように実装したいと思う気持ちがあるかもしれません。
確かにそうですが、マスタ化しないことでメンテナンスするスクリプトや関数が増えることの方がリスクが大きいと思います。
スクリプトを１箇所変更するだけで、全てに影響がないかどうかを確認する必要があるからです。
マスタ化していたら、マスタのデータ増減で正しく計算ができているかどうかの確認も必要ありません。（厳密にはあるけれど。。。）
マスタ化で気をつけるところは、不要な元号が入り込まないようにするだけです。
ただ、現場の状況やシステムの大小でマスタ化をしなくてもいい場合もありますので、適宜実装を考慮してください。
Smarty で指定日時からの数日前・数日後などを表示

今更 Smarty ネタですが。

「現在日時」から○日後とか○日前とかの情報は多数あるのですが
「**指定日時**」からの○日後に関する情報がなかったのでメモ。

`$target_date = '2019-05-01'`

```:2019年5月1日の10日後
{(($target_date|strtotime)+24*60*60*10)|date_format:'%Y-%m-%d'}
```

```:2019年5月1日の10日前

{(($target_date|strtotime)-24*60*60*10)|date_format:'%Y-%m-%d'}
```

```:2019年5月1日の1年後

{(($target_date|strtotime)-24*60*60*365)|date_format:'%Y-%m-%d'}
```

DATE型の$target_dateを一度Unixタイムに変換してから、時間を加（減）算します。
その後、date_format で再度DATE型に変換しています。

ちなみにおなじみの現在日時からの比較は以下

```:現在日時から比較して明日
{($smarty.now+24*60*60)|date_format:'%Y-%m-%d'}
```

### 参考記事

[Smartyで数日前/数日後を計算](http://php.o0o0.jp/article/smarty-date)
firebaseのデータベースを使うときにUncaught TypeError: firebase.database is not a functionと吐かれた時の解決法


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

今回は、firebaseでホームページを作るときに、firebase.database();でエラーを吐かれた時の解決策のメモです。

#Uncaught TypeError: firebase.database is not a function
databaseに問い合わせのデータを格納しようとjsを書いていたら、コンソールに見出しのエラーを吐かれました。
色々なサイトを参考に初期設定から立ち上げいていたのですが、このエラーに関する情報がなかなか無くて詰んでしまいました。
その時の解決法です。
firebaseで最初に

``` html

<!-- The core Firebase JS SDK is always required and must be listed first -->
<script src="https://www.gstatic.com/firebasejs/6.2.4/firebase-app.js"></script>

<!-- TODO: Add SDKs for Firebase products that you want to use
     https://firebase.google.com/docs/web/setup#config-web-app -->

<script>
  // Your web app's Firebase configuration
  var firebaseConfig = {
    apiKey: "***",
    authDomain: "***",
    databaseURL: "***",
    projectId: "***",
    storageBucket: "",
    messagingSenderId: "***",
    appId: "***"
  };
  // Initialize Firebase
  firebase.initializeApp(firebaseConfig);
  </script>

```
このコードをindex.htmlに書き込むと思います。
この部分に少しコードを加えると解決できました。

``` html

<!-- The core Firebase JS SDK is always required and must be listed first -->
<script src="https://www.gstatic.com/firebasejs/6.2.4/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/6.2.4/firebase-auth.js"></script>  
<script src="https://www.gstatic.com/firebasejs/6.2.4/firebase-database.js"></script>
```

このように下の2行を追加すると解決しました。
auth.jsやdatabase.jsが読み込めていなかったのかもしれません。
参考にしたサイトは
https://stackoverflow.com/questions/38248723/firebase-database-is-not-a-function
こちらです。
ローカルのプログラムやコマンドを k8s クラスタ内で実行する方法

## はじめに
- 以下の様なモチベーションから、同僚に聞いた方法をまとめました
    - k8s クラスタ上の Pod に対して、自作のプログラムでリクエストを投げたい
    - kubectl port-forward でもできるけど、いろんな Pod に投げたいので、何個も port-forward するのはだるい

## 想定
- GKE 上のクラスタで一時的にプログラムを動かしたい（クラスタ上のイメージには使えるものがない）
- GCR HostName: asia.gcr.io
- GCP ProjectName: gcp-project-hoge

## Docker イメージを作る
- Dockerfile

```Dockerfile
# 動かしたいプログラムのバイナリと以下のDockerfile を同じ場所に置く
FROM ubuntu:latest

COPY ./app .
```

- build docker image

```sh
# sample-image-name は適当
$ docker build . -t asia.gcr.io/gcp-project-hoge/sample-image-name
```

## GCR に push する
```sh
$ docker push asia.gcr.io/gcp-project-hoge/sample-image-name:latest
```

## k8s クラスタにデプロイ
```sh
# sample-pod は適当な pod 名
# デプロイしたい k8s の context に切り替えておくこと 
# 実行後、Docker コンテナにログインした状態になり(-it)、 exit すると Pod は削除される（--rm）
$ kubectl run sample-pod --restart=Never -it --rm --image asia.gcr.io/gcp-project-hoge/sample-image-name:latest
```
LINEのスタンプを作りました．

# はじめに
**LINEのスタンプ**を作ったのでご覧ください．

# シンプルスタイル
[アルテミア]
(https://ja.wikipedia.org/wiki/%E3%82%A2%E3%83%AB%E3%83%86%E3%83%9F%E3%82%A2)を飼って早2か月半
新しい世代がどんどん生まれています．
詳しくは，リンク先のウィキペディアで見てください．

使い時：
このせいぶつを飼い始めたらつかおう
![simple.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/427131/2bc68440-c024-c3a8-96f0-2d932745976b.jpeg)
# 挨拶
アルテミアは喋らない(ダイヤモンドは砕けない風)
ので，何も文字は入れませんでした．

使い時：
おはよう，こんにちは，こんばんは，おやすみ
いろいろなときにつかおう
![Hi.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/427131/e2840fae-30c7-ffc8-8f7c-e3a3846b326a.jpeg)
# 普段通り
普段通り元気に過ごしているの意

使い時：
げんきであるときにつかおう
![reversed.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/427131/fa3e0e64-c9c4-956c-13b4-7d010c2971ea.jpeg)
# 虚無
アルテミアを育ててずっと思っていた．
「こやつらは何を考えて生きているのか」
を具現化したもの．
実際，**虚無**だと思う．

同じ研究室の人たちからは，**虚無の獣(?)**と呼ばれ，親しまれている(嘘)．

使い時：
．．．のいみでつかおう
![nothingness.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/427131/abf83aa0-bc5f-ca1e-d81d-8b82e13457eb.jpeg)
# 快適～
実は，こいつらは塩分がないと生きていけない．
適切な塩分濃度は，約3%であるといわれている．

使い時：
うれしいときに使おう
![comfortable.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/427131/19a03039-dcdf-a052-fdbf-d59941f56405.jpeg)
# 死
この方たちは，すぐに死んでしまいます！
自然淘汰の波に従順です．

使い時：
社会につかれたときにつかおう
![dead.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/427131/11993702-b24c-894c-94f5-59d05e3adc79.jpeg)
# 餌が欲しい！
ガチャガチャで手に入れたときに，塩分に加えて，謎の餌が入っていた！
それをプラスチックスプーンで与えていた時の図．

使い時：
ごはんがほしいときにつかおう
![feeded.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/427131/466baa86-5786-7180-88dd-ee0ebc1dcf29.jpeg)
# 生存競争
上述したように，すぐ死んでしまうので，このスタンプを作りました．
ある程度自然淘汰されたら，強い個体が残るので，あとは水が蒸発した後に足したり，餌を定期的に与えよう．
じつは，筆者は餌が雨に濡れて団子状になったので，まとめて水槽(約3ℓ)にドボンしたよ．
餌が半永久的に残って，自動で餌を与えてくれる．

使い時：
なにかのたたかいに勝ったら使おう
![struggle_for_existence.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/427131/4b649eb4-df3f-f377-a3c4-903618c40ecc.jpeg)

# さいごに
みてくれてありがとう！
元の位置に戻るのと定義へ飛ぶショートカット【VB6】

# 元の位置に戻る

デバッグ中に「あっ！進みすぎた！！」が多すぎて

元の場所に戻りたい・・・
なんかショートカットないんかよ・・・

と思い続けてたら
私の永遠の指導員が、ぱぱっと解決してくれました。

↓　ショートカット　↓
**Ctrl　+　Shift　+　F2**

はぁ、べんり。。。

# 定義へ飛ぶ

デバッグ中に「なにこの関数なにもの？？」が多すぎて

定義みたい・・・
なんかショートカットないんかよ・・・

と思い続けてたら
私の永遠の指導員が、ぱぱっと解決してくれました。

↓　ショートカット　↓
**Shiｆt　+　F2**

はぁ、べんりべんり。。。


# まとめ

意外にショートカットありました。
VB6も便利だった意外に。
pip install --upgrade pipを実行したら、pipが使えなくなった

# はじめに

- 以下のように表示され、pipが使用できなくなりました

```
$ pip
pyenv: pip: command not found

The `pip' command exists in these Python versions:
  anaconda3-5.1.0
```

# TL;DR
pipを再インストールしました

# Pythonのバージョン

```
$ python 
Python 3.6.3 |Anaconda custom (64-bit)| (default, Oct  6 2017, 12:04:38) 
[GCC 4.2.1 Compatible Clang 4.0.1 (tags/RELEASE_401/final)] on darwin
Type "help", "copyright", "credits" or "license" for more information.
```

# 再インストールまでの流れ

- pipモジュールをインストールしましたが、Permission deniedとなり、失敗しました

```
$ python -m pip install -U pip

Collecting pip
  Using cached https://files.pythonhosted.org/packages/5c/e0/be401c003291b56efc55aeba6a80ab790d3d4cece2778288d65323009420/pip-19.1.1-py2.py3-none-any.whl
Installing collected packages: pip
  Found existing installation: pip 18.1
    Uninstalling pip-18.1:
Could not install packages due to an EnvironmentError: [Errno 13] Permission denied: '/Users/hoge/.pyenv/versions/anaconda3-5.0.1/lib/python3.6/site-packages/pip-18.1.dist-info/INSTALLER'
Consider using the `--user` option or check the permissions.

You are using pip version 18.1, however version 19.1.1 is available.
You should consider upgrading via the 'pip install --upgrade pip' command.
```

- 調べてみると、pipをインストールできるスクリプトがあるとわかったので、一旦、pip周りをきれいにします

```
$ sudo python -m pip uninstall pip
The directory '/Users/hoge/Library/Caches/pip/http' or its parent directory is not owned by the current user and the cache has been disabled. Please check the permissions and owner of that directory. If executing pip with sudo, you may want sudo's -H flag.
Uninstalling pip-18.1:
  Would remove:
    /Users/hoge/.pyenv/versions/anaconda3-5.0.1/lib/python3.6/site-packages/pip-18.1.dist-info/*
    /Users/hoge/.pyenv/versions/anaconda3-5.0.1/lib/python3.6/site-packages/pip/*
Proceed (y/n)? y
  Successfully uninstalled pip-18.1
```

- きれいになったので、pipをインストールするためのスクリプトをダウンロードします

```
$ wget https://bootstrap.pypa.io/get-pip.py
```

- ダウンロードしたスクリプトを実行します

```
$ python get-pip.py 
Collecting pip
  Using cached https://files.pythonhosted.org/packages/5c/e0/be401c003291b56efc55aeba6a80ab790d3d4cece2778288d65323009420/pip-19.1.1-py2.py3-none-any.whl
```

- 無事にpipコマンドが使用できるようになりました

```
$ pip -V
pip 19.1.1 from /Users/hoge/.pyenv/versions/anaconda3-5.0.1/lib/python3.6/site-packages/pip (python 3.6)
```

# 参考URL
- [pipコマンドが壊れた件](https://qiita.com/n_kats_/items/b8f770491e7489549cc8)