OmniAICreator/Qiita-1.07M huggingface dataset:
git commit時のEmojiPrefixの導入

新macを導入時に忘れてしまっていたので備忘録

# はじめに
チームで共通言語のひとつとしてPR見るときに便利なので導入する。
そもそも `EmojiPrefixってなんなんだ`って方は下記を御覧ください。

- [Emojiで楽しく綺麗なコミットを手に入れる](https://goodpatch.com/blog/beautiful-commits-with-emojis/)
- [Gitのコミットに絵文字を使おう！](https://qiita.com/syu_chan_1005/items/e1a18896107d8cedfc45)

## 1.pecoを入れる

```
brew install peco

//そもそもbrewってなにって方は
//https://brew.sh/index_ja
```

## 2.導入したいプロジェクトにテンプレートファイルを配置する
```
vim targetProject/.git/hooks/prepare-commit-msg
```
中身は下記をコピペ、必要に応じて加筆・修正してください。

```
#!/bin/sh

out=$1

function message() {
  mv $out $out.tmp
  cat <<EOS > $out
$1
EOS
  cat $out.tmp >> $out
}

str=$(cat <<-EOS
🐛 :bug: fix bugs
👍 :+1: improve function
✨ :sparkles: add new function
♻️ :recycle: refactoring
🚿 :shower: delete unused function
💚 :green_heart: improve tests / CI
👕 :shirt: fix Lint error / fix code style
🚀 :rocket: improve performance
🆙 :up: update package information or libraries
EOS
)
type=$(echo "$str" | peco | awk 'match($0, /(:.*:)/) {print substr($0, RSTART, RLENGTH)}')
message "$type"
```

## 3.テンプレートファイルに権限付与
```
chmod +x targetProject/.git/hooks/prepare-commit-msg
```

## おわりに
あとはそのプロジェクトにおいて`git commit`時に自動でprefix選択できるようになるので幸せ。
チームで一つのテンプレートを共有するとなおよし。
LambdaをCodePipelineでデプロイするときにdevDependenciesを外して軽くする

# ハマったこと
+ Lambda@Edgeでそこそこ複雑な認証処理を書こうとした
+ なので真面目にmocha,power-assert,sinonを使ってユニットテスト
+ 当然、CodeBuildでビルドするときにもnpm testを実行
+ そのままデプロイ
+ **Lambda@Edgeのサイズ制限（圧縮して1MB)に引っかかった**

# 原因
mocha,power-assert,sinonのセットは結構サイズがでかい。node_modulesのサイズがエライことに。

# 方向性
CodeBuild内でのnpm testはやりたい。

とはいえ、デプロイするときはmocha,power-assert,sinon(≒devDependenciesの中身)は含めたくない。

**テストした後、消してもう一回dependenciesだけインストールすればいいんじゃね？**

# やってみた
## package.json
```json
{
  "name": "oidc-inspection",
  "version": "0.0.1",
  "description": "OIDC Inspection",
  "main": "src/index.js",
  "scripts": {
    "test": "mocha"
  },
  "author": "tetsuya.zama",
  "license": "ISC",
  "devDependencies": {
    "mocha": "^5.2.0",
    "power-assert": "^1.6.1",
    "sinon": "^6.3.5"
  },
  "dependencies": {
    "cookie": "^0.3.1",
    "node-jose": "^1.0.0"
  }
}
```
## template.yaml
```yaml
AWSTemplateFormatVersion: '2010-09-09'
Transform: 'AWS::Serverless-2016-10-31'
Description: Inspection about integration between CloudFront and Cognito
Resources:
  oidcInspection:
    Type: 'AWS::Serverless::Function'
    Properties:
      Handler: src/index.handler
      Runtime: nodejs6.10
      Role: !GetAtt oidcInspectionRole.Arn
      Description: ''
      MemorySize: 128
      Timeout: 5
      AutoPublishAlias: live
  oidcInspectionRole:
      Type: "AWS::IAM::Role"
      Properties:
          Path: "/"
          ManagedPolicyArns:
              - "arn:aws:iam::aws:policy/service-role/AWSLambdaBasicExecutionRole"
          AssumeRolePolicyDocument:
            Version: "2012-10-17"
            Statement:
              -
                Sid: "AllowLambdaServiceToAssumeRole"
                Effect: "Allow"
                Action: 
                  - "sts:AssumeRole"
                Principal:
                  Service: 
                    - "lambda.amazonaws.com"
                    - "edgelambda.amazonaws.com"
```

## buildspec.yml
```yaml
version: 0.2 #versionが0.1だと各Commandが別のシェルで実行されてしまうので成立しないっぽい

phases:
    pre_build:
        commands:
            - npm install #テストの為に１回全部インストール
            - npm test #テスト実行
    build:
        commands:
            - rm -rf node_modules #テストが終わったので1回node_modulesを消す
            - rm -rf test #ついでにtestディレクトリも消しておく
            - npm install --production #--productionをつけるとdevDependenciesはインストールされない
            # あとは普通にpackageして、artifactsに渡せばOK
            - aws cloudformation package --template-file template.yaml --s3-bucket oidc-inspaction-sam-lambda --output-template-file outputSamTemplate.yaml

artifacts:
    files:
        - template.yaml
        - outputSamTemplate.yaml
```

# 結果
もともと圧縮して4MBだったものが0.8MBに削減。無事にLambda@Edgeとしてデプロイすることができた。

誰かもっとスマートな方法があったら教えてください。。。
[Unity]ImageAnchorのサンプルが動かなかった人へ[ARKit]

## はじめに
ARKit 1.5で追加されたImageAnchor。
画像を認識してその座標を取得できる便利なもの（※詳しくは[こちら](https://qiita.com/k-boy/items/d935b76fed67e11b9fb2#imagetracking)の記事を参照ください）なのですが、

僕の環境のUnityARKitPluginのサンプルではどうもうまく動きませんでした。(2018.10.22現在)

## Deployment Targetを12.0に設定したら動いた！！
<img width="678" alt="スクリーンショット 2018-10-22 19.43.03.png" src="https://qiita-image-store.s3.amazonaws.com/0/243926/0c145131-9d19-f5e8-0cb8-f2d62d3f309d.png">


フォーラムでそう言ってた（小並感）
https://forum.unity.com/threads/arkit-2-0-beta-support.534639/#post-3522275

要するにこういうことらしい。

ARWorldTrackingConfigurationで画像認識を使うと固まる問題
https://qiita.com/k-boy/items/7ce8263392dfa7acaca4

XCodeのバージョンが上がるまで我慢するしかないね😢


## ImageAnchorの実装方法

#### 1. ARReferenceImageを作成
<img width="500" alt="スクリーンショット 2018-10-22 19.06.44.png" src="https://qiita-image-store.s3.amazonaws.com/0/243926/c3693293-aeca-63ed-aa45-e2024af3678d.png">

#### 2. パラメータを設定して・・・
Physical Sizeは1で1メートルなので0.1(10cm)を設定。

<img width="375" alt="スクリーンショット 2018-10-22 19.10.55.png" src="https://qiita-image-store.s3.amazonaws.com/0/243926/8ab60f48-629f-4cb6-d92e-47124e6ae259.png">

#### 3. ARReferenceImagesを作成
<img width="500" alt="スクリーンショット 2018-10-22 19.06.55.png" src="https://qiita-image-store.s3.amazonaws.com/0/243926/8b756176-a274-1b4a-47b2-28b47362aa21.png">

#### 4. 認識したい数だけReferenceImageを設定しましょう
<img width="372" alt="スクリーンショット 2018-10-22 19.19.45.png" src="https://qiita-image-store.s3.amazonaws.com/0/243926/dac20c40-b96c-f3e3-2c17-aa17b25dc55f.png">

#### 5. Unity AR Camera ManagerにReferenceImagesを設定
<img width="374" alt="スクリーンショット 2018-10-22 19.21.11.png" src="https://qiita-image-store.s3.amazonaws.com/0/243926/405d183c-6eff-7b88-7aa0-fd23c7910aad.png">

#### 6. Sampleのスクリプトから「Generate Image Anchor」を設定
<img width="378" alt="スクリーンショット 2018-10-22 19.24.31.png" src="https://qiita-image-store.s3.amazonaws.com/0/243926/c42e3fde-72e5-64f8-b3a4-1d27c5a9b15c.png">

※ 僕の環境だと、認識精度が低く、すぐにオブジェクトが消滅してしまうので以下のようにコードを変更しました

```
	void UpdateImageAnchor(ARImageAnchor arImageAnchor)
	{
		Debug.LogFormat("image anchor updated[{0}] : tracked => {1}", arImageAnchor.identifier, arImageAnchor.isTracked);
		if (arImageAnchor.referenceImageName == referenceImage.imageName) {
            if (arImageAnchor.isTracked)
            {
                if (!imageAnchorGO.activeSelf)
                {
                    imageAnchorGO.SetActive(true);
                }
                imageAnchorGO.transform.position = UnityARMatrixOps.GetPosition(arImageAnchor.transform);
                imageAnchorGO.transform.rotation = UnityARMatrixOps.GetRotation(arImageAnchor.transform);
            }
            else if (imageAnchorGO.activeSelf)
            {
                // imageAnchorGO.SetActive(false);　// <= コメントアウト
            }
        }

	}

	void RemoveImageAnchor(ARImageAnchor arImageAnchor)
	{
		Debug.LogFormat("image anchor removed[{0}] : tracked => {1}", arImageAnchor.identifier, arImageAnchor.isTracked);
		if (imageAnchorGO) {
			// GameObject.Destroy (imageAnchorGO); // <= コメントアウト
		}
	}
```


## 楽しいARライフを！

Twitterフォローしてね！！
https://twitter.com/mutun__
Gitのオブジェクトについて

数年前に[Pro Git](https://progit-ja.github.io/)を読んだ時のまとめが一部下書きに残っていたので、供養として投稿


# 何のメモか?
.git/objects配下のファイル間の関係についてのメモ

# オブジェクトについて
UNIXはあらゆるものがファイルオブジェクトなのだが、Gitでもそれを踏襲している


commitによっていくつかのオブジェクト、もといファイルが生成される
具体的にはcommitオブジェクト、treeオブジェクト、blobオブジェクトができる(厳密には異なるが)

blobオブジェクトは「ファイル」
treeオブジェクトは「ディレクトリ構造」にあたる

これらオブジェクトの実体は、.git/objects配下に存在するファイルである

# オブジェクトファイルの正体
.git/objects配下のファイルをテキストエディタで開いてみると、16進数40文字で命名されたファイルが存在する
中身はファイルの内容と不可分のハッシュ値だ

blobにはディレクトリ名と「ファイル」の中身をzlibで圧縮したものが書き込まれている
blobの名前は「ファイル」の中身のハッシュ値(SHA-1)なので、blobの名前と中身は不可分なものになる(天文学的な確率を除く)

blobは元の「ファイル」の名前やパーミッションなどのメタ情報を持たない
そういうものはtreeオブジェクトが保持している
treeには、blobのメタ情報と参照、子treeの参照が記述されている

では、rootとなるtreeの所有者やパーミッションなどの情報は誰が持っているのか
　
実は、commitオブジェクトが保持している
commitオブジェクトには、rootなtreeへの参照、親commitオブジェクトへの参照、コミット履歴のメッセージ、タイムスタンプなどが記述されている


このような構造で何が起きるかというと
blobオブジェクトに変更が加わると、ファイル名のハッシュ値が変わる。そのため、そのblobのハッシュ値を参照するtreeに変更が加わる

すると、treeのファイル名のハッシュ値も変わる。そして、そのtreeの親treeにも変化が加えられていき、rootなtreeまで変更される

そして、rootなtreeのメタ情報を持つcommitにも変更が加えられ、終いにはrootなcommitオブジェクトにも変更が波及するわけだ

# 感想
blobオブジェクトに変更が加わると、それが回り回ってcommitオブジェクトにまで波及する点が非常によく出来ている
「データを集める技術」より（自分用のメモ）

# 概要
「データを集める技術」を読んで参考になったことをまとめておく。自分用。
スクレイピングとかについて書かれていた。

# メモの内容
## Excel上からネット上のデータを集める
- WEBSERVICE関数　→　文字数が32,767文字以上だとエラーになる
- FILTERXML関数

## Google Apps Scriptでスクレイピング
1. URLを指定
2. UrlfetchApp.fetch(url)でソースのデータを取得
3. response.getContent Text ("UTF-8")
4. content.match(/<title>(.*?)<¥/title>/)　※タイトルの場合

## スクレイピングサービス
- import.io

## Slack
アプリをインストールできる（Apps&integrations）
（ex. RSSのアプリ）

## myThings
モバイル用のアプリ。Twitterの特定のツイートが合った場合に通知を受けることができる。

## スプレッドシート
Importfeed関数（RSSフィードを取得する）

## Google Apps ScriptのFetchAppクラス
クローリングの際のユーザーエージェントを変えられる。
また、GASの実行時間の上限は5分
Xml Serviceクラス…XMLを操作するクラス
- getElement By Attribute
- getElement By ClassName
- getElement By Id
- getElement By TagName

## GASのライブラリ
Parser…取得したい場所の始まりと終わりのテキストを指定し、その間のコンテンツを抜き出す
メールアドレスがいっぱい欲しい時

## はじめに
・登録系のテストで複数メールアドレスが必要な時
・Twitterなどのサービスで複数アカウントをつくりたい時

上記のようなシーンで便利な小技。※Gmailをつかうよ!

## Gmailのエイリアス機能を使う

hogekorplus@gmail.comというアドレスがあったとします。
@の前に```+任意の文字列```を追加する事で**新しいメールアドレスを作成する事**ができます。

例えば、
hogekorplus+1@gmail.com
といった感じです。

何個、メールアドレスのエイリアスを追加したとしても、
hogekorplus@gmail.comのアカウントでまとめて、受信できるので便利です。

## ちなみに
個人的にアカウントのIDとパスワードの管理は[Google Keep](https://keep.google.com/ "Google Keep")を使っています。

こんな感じで、

![スクリーンショット 2018-10-22 19.00.42.png](https://qiita-image-store.s3.amazonaws.com/0/295800/af6af089-9872-51c2-b645-57dddafbb173.png)


付箋のようにしてみれるので重宝しております。
無料のサービスでスマホ、PC間の共有もラクラクです。

では!
読書メーターからカーリルへの移動用bookmarkletを作成

## 概要
- 読みたい本を読書メーターに溜めている
- カーリルで近くの図書館にあるか確認したい
- スクレイピングはハードルが高いが、なんとかしたい

## 解決方法
- bookmarkletで読書メーターからカーリルへのショートカットを作成しよう

## アプローチ
- カーリルの詳細ページはISBNコードで管理されている
- AmazonのURL内にISBNコードが埋め込まれている
- 読書メーター側にはAamzonへのリンクがある

## bookmarkletの作成
```
javascript:window.open('https://calil.jp/book/'+$('.image__cover').attr('href').replace('https://www.amazon.co.jp/dp/product/','').slice(0,10));
```

## 使い方
- ブラウザ毎に若干異なるが、なんでもいいのでまずはブックマークする
- ブックマークのURLを編集して上記のコードを貼り付ける
- 読書メーターの詳細ページ内でブックマークを呼び出す
- 該当の書籍のカーリルのページが出てくる
- iPhone・スマホの場合も同様
[日記アプリ] コメント投稿機能の追加時の問題

#編集・削除・更新時にエラーになる
コメントの登録後に編集・削除・更新をするとエラーが出てしまう。

##_form.html.erbを修正した
###エラー時の記述

```_form.html.erb
<%= form_with model: @comment, url: diary_comments_path(@diary, comment.id), local: true do |form| %>
	<div class="field">
		<%= form.label :name %>
		<%= form.text_field :name %>
	</div>

	<div class="field">
		<%= form.label :content %>
		<%= form.text_area :content %>
	</div>

	<div class="actions">
		<%= form.submit %>
	</div>
<% end %>
  ```

###修正後
参考：[[Rails 5.1] ‘form_with’ APIドキュメント完全翻訳](https://techracho.bpsinc.jp/hachi8833/2017_05_01/39502)
>ルーティングが正しく設定されているdocumentにcommentを追加したい場合は次のようにする。

```_form.html.erb
<%= form_with(model: [ @document, Comment.new ]) do |form| %>
  ...
<% end %>
```

日記アプリでいうと```@document```は```@diary```、```Comment.new```はインスタンス変数にしてるので```@comment```に変え、次のように修正。

```_form.html.erb
<%= form_with model: [@diary, @comment], local: true do |form| %>
	<div class="field">
		<%= form.label :name %>
		<%= form.text_field :name %>
	</div>

	<div class="field">
		<%= form.label :content %>
		<%= form.text_area :content %>
	</div>

	<div class="actions">
		<%= form.submit %>
	</div>
<% end %>
```
SpringBootTestでapplication.propertiesの値をどうにかして使いたかった話

## 概要
テスト対象のクラスで、application.propertiesの値を `@Value` でインジェクションさせたフィールドを使ったメソッドを対象としたものがあったのですが、ちょっと苦戦したので残しておこうと思いました。

## 環境

* jdk1.8
* SpringBoot 1.5.13

## どんな実装？
```java:Hoge.java
@Repository
public class Hoge {
    @Value("${hoge.threshold}")
    private int threshold;

    /* 略 */
    public void extract(Object params) {
        if (judge(params.getValue())) {
            /* 処理 */
        }
    }

    private boolean judge(int value) {
        if (value > threshold) {
            return true;
        } else {
            return false;
        }
    }
}
```

```application.properties
hoge.threshold=100
```

```java:HogeTests.java
@RunWith(SpringRunner.class)
@SpringBootTest
public class HogeTests {

    @AutoWired
    Hoge hoge;

    @Test
    public void testJudge() throws NoSuchMethodException, SecurityException, IllegalAccessException, IllegalArgumentException, InvocationTargetException {
        Method method = Hoge.class.getDeclaredMethod("judgeQueryDriver", String.class);
        method.setAccessible(true);

        assertThat(method.invoke(hoge, 101)).isEqualTo(true);
        assertThat(method.invoke(hoge, 100)).isEqualTo(false);
    }
}
```

## どんなことが起こるか

稼働しているときは問題なくvalueインジェクションが効いているのですが、テストを実行すると、インジェクションが効かず失敗してしまいます...🤔

## やってみたこと

次のことをやりましたが、反映されませんでした。:thinking:

* `src/test/resources` を作成し(こういったテストケースの前例がなかったので新規に作る形になりました)、同じ内容のapplication.propertiesを配置
* `@SpringBootTest` の後ろに `(properties = {"hoge.threshold=100"})` を追加
* `@PropertySource` または `@TestPropertySource` でsrc/test/resourceに追加したapplication.propertiesを指定する
* `@Before` がついたメソッドをHogeTestsに実装し、そのなかで `ReflectionTestUtils.setField` を実行


## 解決

* `judge()` のアクセシビリティをpublicに変更して試してみると、なんと正常に読み込みました。
 * ただ、テストのためにpublicに変更するべき・・・？
* そもそもの実装設計の話として、こういった判定実装って同じクラスに実装せずにUtil的なクラスに実装してしまうのがいいのかもしれないですね。
JavaScriptの関数　レベル☆

#記事の概要
**基本の基本である関数を誰でも体に叩き込めるようにするため簡潔にしました。**

* アロー関数
* 関数を作る
* 文字列などを結合する方法
* 引数が複数あるとき




#アロー関数

**従来の関数の書き方**

```js
//従来の関数の書き方

const calc = function(number){
//処理
}

//アロー関数

const calc = number =>  //処理
 
```

* 引数が１つの時は(　)を省略して書くことができる。
* 引数が複数ある時はコンマ区切りで書く。
* **引数がない時は(　)を省略することができない。**




#関数を作る
```js

//変数定義     　引数を定義　　
const sayHello = name => {
  
  //処理を書く
  console.log ( name )
  
}

//関数呼び出し　 関数実行時にこの引数を与える

sayHello("やまだてつと")
``````````````````````````````````
**出力**

```
やまだてつと
```

##文字列,変数,式を結合する

```js
const name = "阪神"

const tigers = `${name}${"監督"}${3+3}`;

console.log(tigers)

```
**出力**

```
阪神監督6
```
##引数が複数ある時

```js
const sayTetsuto = (name,number) =>{

console.log(`${name}${number}`);
}

sayTetsuto('やまてつ',1)
```
**出力**

```

やまてつ１
```
React Nativeの赤いエラー画面が心臓に悪いので色を変える

ReactNativeの赤いエラー画面、心臓に悪いですよね。
こんなIssueが報告されるほどです。

Serious problem related to our health!!! Need to change the colour of error screen!
https://github.com/facebook/react-native/issues/11048

<img width="200" alt="スクリーンショット 2018-10-22 18.46.39.png" src="https://qiita-image-store.s3.amazonaws.com/0/63855/df5d104d-9ba7-35ad-ac7b-775cbc974c8b.png">

以下の手順で赤いエラー画面の色を変えることができました。

- Xcodeでプロジェクトを開く
- self.backgroundColorで検索する
- RCTRedBox.mを開き、    
    
``` objectivec
self.backgroundColor = [UIColor colorWithRed:0.8 green:0 blue:0 alpha:1];
```

を探す。(0.53.3の場合は52行目にありました。)


![スクリーンショット 2018-10-22 18.47.43.png](https://qiita-image-store.s3.amazonaws.com/0/63855/f4d4d406-c856-811e-c226-a341f39492a9.png)


- 好きな色を登録する。

``` objectivec
[UIColor colorWithRed:(0/255.0) green:(71/255.0) blue:(143/255.0) alpha:1.0];
```

Objective-CはRGBの指定を 0.0-1.0 で指定します。上の例は #00478F 相当です。

<img width="504" alt="スクリーンショット 2018-10-22 18.39.18.png" src="https://qiita-image-store.s3.amazonaws.com/0/63855/c80a65d8-d89f-f495-819f-4e72497e523a.png">


以上です。それでは心臓に良いReactNativeライフを！！


参考 iPhoneアプリ開発虎の巻 UIColor
https://iphone-tora.sakura.ne.jp/uicolor.html
Qiitaで草を生やせるGitHubならぬ「QiitaHub」を作った物語【個人開発】


２週間ぐらい前から一人で開発していたQiitaHubを本日リリースしました！



#  リリースしたサービス

[QiitaHub -Qiitaのコミット数をgithubのようなグラフで見れるサービス](https://qiitahub.work/)



# どんなサービスなのか

自分の qiita id を検索するとqiitaの記事の投稿を１contributionとしたgithubのような contributions graph を見ることができます。芝生が生えているところにマウスオーバーすると何月何日に何コミットしたか確認することができます。






### トップ画面






### グラフ画面







# なぜ作ったのか

皆さん、コードたくさん書いてリモートにプッシュした後、githubのcontributions graphで草が生えているのみるとテンション上がりませんか？笑　　
自分は草が生えることでコードをかくモチベが上がったので、qiitaにも　contributions graph　があればアウトプットを加速できるのではと思い作成しました。



#こだわった点

- design

![Screen Shot 2018-10-19 at 23.29.02.png](https://qiita-image-store.s3.amazonaws.com/0/236412/3512e69c-9224-6fa3-43e9-5b0cddf79934.png)


今回初めて[sketch](https://www.sketchapp.com)を使ってデザインを設計しました。

今までmacのkeynoteで大まかなデザインだけ設計していましたが、やはりデザインはいけてるほうがいいのは間違い無いと思ったのでこだわって見ました。とにかく、[pinterest](https://www.pinterest.jp/)と[dribble](https://dribbble.com/)でかっこいいデザインを見まくりました笑 sketchは1日あれば簡単な操作は習得できました。 

トップ画面のグラデーションとtwitter cardのデザインでかなりどのようにするか迷いました。とりあえず上の写真のように８つぐらいデザインを作成してみて後はもっともクールだ！と直感で思ったのを選びました！


#  使用技術


- react.js

- QiitaAPI

- Netlify

- IntelliJ

- git

以前ブックレコメンダーというサービスを開発した時はnext.jsで開発しましたが今回はcreate-react-appを使用しました。個人的に簡単にreact.jsのアプリの雛形が作成されてとても便利でした。

　デプロイにnetlifyを使いましたが、デプロイが２０秒ぐらいで完了して、感動しました。また、デプロイした後はgit push するだけで自動でデプロイしてくれるのでめちゃくちゃありがたかったです。　railsでherokuを以前使ったことがあったのですがnetlifyもherokuに似ているなと思いました。



#使用したライブラリ
- [semantic-UI-react](https://react.semantic-ui.com/)

いい感じのcomponentを用意してくれています。buttonなどはこちらのを使用しました。レスポンシブにも対応しているので使いやすいです。毎回、[material-ui](https://material-ui.com/)と迷うのですが今回はマテリアルデザインを取り入れる方針ではなかったのでsemantic-uiの方を使いました。

- [query-String](https://github.com/sindresorhus/query-string)

検索文字のクエリを渡す時にこちらのライブラリを使用しました。

- [react-calendar-heatmap](https://github.com/patientslikeme/react-calendar-heatmap)

![Screen Shot 2018-10-20 at 0.04.15.png](https://qiita-image-store.s3.amazonaws.com/0/236412/256ec53b-57e7-a0f6-f4d9-097dd2f82bf0.png)


簡単にgithubのような草がはえるライブラリを作成することができます。

- [react-router](https://github.com/ReactTraining/react-router)

言わずと知れたルーティング用ライブラリ。

#振り返ってみて
最初大まかにkeynoteにプロトタイプ書いて１週間ぐらいで一通り完成させました。

ただその時はQiitaのデザインに完璧に揃えようとしていたのですが全く同じだと面白くないなと思い、そこからデザインをブラッシュアップしていきました。

最後の2日ぐらいはchromeの検証でのiphoneでは動くのに実機のiphoneではエラーが起きるというバグ対処に時間をさきました。

デザインを意識して作ったのは今回が初めてですがsketchを使えばグラデーションなども簡単にデザインできてしまい興奮しました。いざsketchでpinterestのデザインのトレースなどをしてみるとデザインへの敷居がグッと低くなったのでおすすめです。

これからもただ単に動くだけではなくてみているだけで使いたくなるようなデザインを心がけて作っていこうと思います！

# 最後に


ぜひQiitaHubで草を生やすことをモチベーションにしてQiitaを一度も投稿してみたことがない方もこの機会に投稿してみてはいかがでしょうか！！！

（フォームの画像を押すとQiitaHubに飛びます）
[![Screen Shot 2018-10-19 at 23.48.43.png](https://qiita-image-store.s3.amazonaws.com/0/236412/8576eb8c-76ee-845a-f1d8-77582e8f9c06.png)]( https://qiitahub.work/)
vim用syntaxファイルつくる [WIP]


まぁさっき`usr_404.txt`読み終わったレベル(かつメモ書き程度)なので間違い等あればご指摘お願いします...

# 英語読めるなら

これ読むと全てわかる

```vim:in vim
:h usr_44.txt
```

# 日本語読めるなら

翻訳してくださっているこれを読むと良いのでは(自分はこっち読んでないからわからないがvim-jpなので大丈夫だと思う)

[usr_44 - Vim日本語ドキュメント](https://vim-jp.org/vimdoc-ja/usr_44.html)

# 基本

syntaxを設定する上で、3つのタイプがある。
つまり

|:-:|:-:|
| keyword | 単語。前後に余計な文字がついていると識別されない |
| match   | パターンマッチしたものを指す。前後に余計なのついてても判別される |
| region  | matchと似ている(?)が、開始と終了のパターンを渡し、その間を指す |

# 細かいとこ

記事分けたほうが検索しやすい気がしたので分けます(今思いついた)
aws-google-auth (CLIによるSAML認証ツール)を用いたAWSコンソールへのログインができるまで

##環境

・OS:MacOS
・Python:3.6

##はじめに
G Suiteアカウントをフェデレーション（シングルサインオンまたはSSO）プロバイダとして使用してAWS一時認証情報を取得、ログインが可能になりユーザのキー管理は以前よりは手間が減りました。さらに今回はこの作業をCLIでSSOログインできるようにしたいと思います。

#準備
+ python3.6が動く環境
+ Homebrewのインストール(xcodeがインストールされていることが前提)
+ pipのインストール(pythonのバージョンに注意)
+ pipコマンドでawscliをインストール



```bash
# pip install awscli
```

##実行

+ ~/.aws/configに以下を追記(durationで一時認証から再認証までの間隔を設定)

```
[profile sts]
region = xx-xxxxxx-x
google_config.ask_role = False
google_config.keyring = False
google_config.duration = 43200
google_config.google_idp_id = xxxxx(google idp)
google_config.role_arn = xxxxx
google_config.google_sp_id = xxxxx(google sp)
google_config.u2f_disabled = False
google_config.google_username = xxxxx
```
+ pipコマンドでaws-google-authをインストール

```bash
# pip install aws-google-auth
```
+ aws-google-authコマンド(https://github.com/cevoaustralia/aws-google-auth)


```bash
$ aws-google-auth
```

このコマンドのあとパスワードを求められるので、入力してログイン完了です。
Box Driveで権限の無いフォルダへのアップロードエラー(自動リトライされる)をキャンセルする方法

[Box Drive](https://www.box.com/ja-jp/drive) は [ファイル共有サービスBox](https://www.box.com/ja-jp/home) 用のデスクトップアプリケーションです。

# 発生したエラー内容

Boxで、ある時間違えて権限の無いフォルダにファイルをアップロードしようとしてしまい、エラー通知のポップアップが定期的に出てくるようになりました: Upload Failed (error code : 07)

![image.png](https://qiita-image-store.s3.amazonaws.com/0/172826/900ffe4e-5ffc-aada-4679-6e1699bf374e.png)
![image.png](https://qiita-image-store.s3.amazonaws.com/0/172826/5aa0430e-bc6b-d7e7-fb2b-7cb4c9490e76.png)

警告をクリックするとダイアログが出てくるのですが、ここにはリトライボタンしか付いておらず、キャンセルすることができません。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/172826/91d2134a-50e7-5f01-d8bd-79b5d20d46e7.png)

[Boxエラー一覧](https://community.box.com/t5/Box-Drive-Troubleshooting/Box-Drive-Error-Notifications/ta-p/32094#toc-hId-1724973987) を見ても「アップロード先に書き込み権限を付与せよ」としか書いていません。間違ったアップロード先で、繰り返しエラーが出るのが気になるのでキャンセルしたいのです。

# エラーを止める方法

ダイアログではなく、Windowsエクスプローラーで対応することができました。

- Windowsエクスプローラから、<font color="blue">C:\Users\\\<ユーザ名>\Box</font> 以下の対象フォルダを開く
- エラーになったファイルが <font color="red"><b>！</b></font> 付きで表示されているので、ローカルディスクに移動する(あるいは不要であれば削除)

![image.png](https://qiita-image-store.s3.amazonaws.com/0/172826/5b81a1b5-67c0-3eb1-3db5-44481179cc00.png)

以上でエラーが出なくなりました。

![ccc.png](https://qiita-image-store.s3.amazonaws.com/0/172826/21f3619a-3680-e1b7-7150-f555aa2a8470.png)

気づけば何でもないのですが、ダイアログの方にもキャンセルボタン付けて欲しいですね。
Nuxt.jsのプロジェクトにstylelintを導入する方法

Nuxt.jsのプロジェクトに、[stylelint](https://stylelint.io/)を導入する方法を紹介します。

## create-nuxt-appを使用する場合
プロジェクトの作成に[create-nuxt-app](https://github.com/nuxt/create-nuxt-app)を使用する場合、リントツールのオプションでStyleLintを選択するだけで導入することができます。

## create-nuxt-appを使用しない場合
Nuxt.jsの[スターターテンプレート](https://github.com/nuxt-community/starter-template)や、スクラッチからプロジェクトを作っている場合は、自分でstylelintのモジュールを追加する必要があります。

### パッケージをインストール
[stylelint](https://www.npmjs.com/package/stylelint)と[@nuxtjs/stylelint-module](https://www.npmjs.com/package/@nuxtjs/stylelint-module)をインストールします。

```sh
$ npm i -D stylelint @nuxtjs/stylelint-module
```

また、stylelintは初期状態では何もルールがないので、[stylelint-config-standard](https://www.npmjs.com/package/stylelint-config-standard)というルールセットもインストールします（他のルールセットでも構いません）。

```sh
$ npm i -D stylelint-config-standard
```

### 設定ファイルを作成
`.stylelintrc.json`ファイルを作成します。

```json:.stylelintrc.json
{
  "extends": "stylelint-config-standard"
}
```

自分でルールを定義することもできますが、ここではstylelint-config-standardのルールを継承しています。

### プロジェクトにモジュールを追加
`nuxt.config.js`ファイルの`buildModules `（Nuxt.jsのバージョンが`2.9.0`未満の場合は`modules`）に、`@nuxtjs/stylelint-module`を追加します。

例：

```js:nuxt.config.js
export default {
  buildModules: [
    '@nuxtjs/stylelint-module'
  ]
}
```

### Sass（SCSS記法）を使う場合
Sass（SCSS記法）を使う場合は、追加の設定が必要になります。

#### パッケージをインストール
[stylelint-scss](https://www.npmjs.com/package/stylelint-scss)をインストールします。

```sh
$ npm i -D stylelint-scss
```

#### 設定ファイルを更新
`.stylelintrc.json`ファイルの`plugins`に、`stylelint-scss`を追加します。

```json:.stylelintrc.json
{
  "extends": "stylelint-config-standard",
  "plugins": [
    "stylelint-scss"
  ]
}
```

## 参考リンク
* [nuxt-community/stylelint-module: Stylelint module for Nuxt.js](https://github.com/nuxt-community/stylelint-module)
MySQL便利な小技

# 備忘録
使っていて便利だと思ったSQL文を忘れないために

---
## 特定のカラムを探す

```sql:
SELECT
  *
FROM
  information_schema.columns 
WHERE
  column_name = '探したいカラム名' 
  and table_schema = 'カラムを探すDB名';
```

---
## テーブル名で検索

```sql:
--検索したいワードを含むテーブル
SHOW TABLES like '%検索したいワード%'; 

--検索したいワードで始まるテーブル
SHOW TABLES like '検索したいワード%'; 

--検索したいワードで終わるテーブル
SHOW TABLES like '%検索したいワード'; 
```

---
## テーブルにカラムを追加

```sql:
--テーブルの最後尾に追加
ALTER TABLE テーブル名 ADD 追加するカラムの情報;

--テーブルの先頭に追加
ALTER TABLE テーブル名 ADD 追加するカラムの情報 FIRST;

--指定したカラムの後ろに追加
ALTER TABLE テーブル名 ADD 追加するカラムの情報 AFTER カラム名;
```

---
## 指定範囲の更新

```sql:
UPDATE テーブル名 SET 更新する値 WHERE 範囲設定するカラム名 BETWEEN X AND Y;
--XとYは更新する範囲
```

---
## 複数カラムを一つにまとめる
 以下のような，果物の個数を記録するテーブルがあります。


| apple_num | peach_num | lemon_num | orange_num |
|:---------:|:---------:|:---------:|:----------:|
| 1         |   0       |    2      |    3       |
| 2         |   1       |    0      |    0       |
| 0         |   0       |    0      |    0       |
テーブル名 : fruit

このテーブルをまとめて名前と個数を一つのカラムにして表示するためにCONCATを使い結合します。
また0個の要素は表示しないようにCASE文を使用します。

```sql:
 --結合後のデータを格納するカラムを生成
 ALTER TABLE fruit ADD fruit_info varchar(100);

--果物の名前と数を結合する
UPDATE fruit 
SET 
 fruit_info = CONCAT(
  CASE apple_num
   WHEN 0 THEN ''
   ELSE CONCAT('りんご ', apple_num, '個 ') 
  END,
  CASE peach_num
   WHEN 0 THEN ''
   ELSE CONCAT('もも ', peach_num, '個 ') 
  END,
  CASE lemon_num
   WHEN 0 THEN ''
   ELSE CONCAT('れもん ', lemon_num, '個 ') 
  END,
  CASE orange_num
   WHEN 0 THEN ''
   ELSE CONCAT('おれんじ ', orange_num, '個')
  END
 );
```

このSQLを実行すると以下のようになります。

| apple_num | peach_num | lemon_num | orange_num |           fruit_info             |
|:---------:|:---------:|:---------:|:----------:|---------------------------------:|
| 1         |   0       |    2      |    3       | りんご 1個 れもん 2個 おれんじ 3個 |
| 2         |   1       |    0      |    0       | りんご 2個 もも1個                |
| 0         |   0       |    0      |    0       |                                  |
テーブル名 : fruit

改行コードやカンマを付けると見やすくなるかもしれません。

---

## 全角・半角区別せずに検索
データ検索をする際に全角・半角を区別せずに検索したい時が多々あります。
その際は，以下のようにすれば区別せずに検索できます。

```sql
 SELECT
  * 
FROM
  テーブル名 
WHERE
  vSinseiName collate utf8_unicode_ci like '%検索したいワード%'
```

`collate utf8_unicode_ci`によって大文字・小文字・全角・半角を区別せずに検索するようになります。

しかし，このコードはutf8のデータベースでしか使用できないのでそれ以外のデータベースは文字コードをutf8に変換する必要があります

```sql
 SELECT
  * 
FROM
  テーブル名 
WHERE
  vSinseiName convert(namae using utf8) collate utf8_unicode_ci like '%検索したいワード%'
```

`convert(namae using utf8)`によって文字コードをutf8に一時的に変換できます。

---
python の string.format が便利だからPHPでも使いたい

# python の string.format とは

Python3 には `sprintf` にあたる `string.format` メソッドが存在しますが、 C言語風とは違っていて、テンプレートぽく使えて便利です。

```python
context = {
    'name': '太郎',
    'point': 10,
}
print('[お知らせ] {name}から{point}ポイント送信されました'.format_map(context))
```

```text:実行結果
[お知らせ] 太郎から10ポイント送信されました
```

この方式だと、テンプレート文字列の中に `{point}` が複数回出てきた場合などにも `context` の定義を増やしたりしなくて良いので便利です。

python には　`string.Template` というクラスがあって、こいつも超簡易なテンプレートみたいな感じなんですが、帯に短し襷に長しみたいな感じで、ほとんどの使途を `string.format` メソッドで置き換え可能です。

そして、最近は PHP をやっているので、これを PHP でも使いたいなというお話です。

# PHP で Python の string.format 相当の処理

```php
<?php
  
$context = [
        '{name}' => '太郎',
        '{point}' => 10,
];
echo strtr('[お知らせ] {name}から{point}ポイント送信されました', $context) . PHP_EOL;
```

```text:実行結果
[お知らせ] 太郎から10ポイント送信されました
```

ただの `strtr` 関数の使い方の説明になってしまっているので、しょぼい話ですが、 Python の `string.format` の便利さから個人的に再発見したという感じで、便利やんと思ったので書きました。

# 補足

テンプレートとして、値を埋められない時に何も表示しないという振る舞いを一般的にきちんとしたテンプレートはするし、`printf` 的なフォーマットではプレースホルダの数が合わないとエラーになります。

個人的には何も表示しないというのは、間違いを見落としがちであまり好きではありませんが、一応同じ振る舞いには出来ます。Pythonも同じことです。

## プレースホルダを表示しない

```php
$context = [
        '{name}' => '太郎',
];
$doc = strtr('[お知らせ] {name}から{point}ポイント送信されました', $context) . PHP_EOL;
echo preg_replace('/{[^}]+}/', '', $doc);
```

```text:実行結果
[お知らせ] 太郎からポイント送信されました
```

## プレースホルダが一致しない場合は例外

```php
<?php
$context = [
    '{name}' => '太郎',
];
$doc = strtr('[お知らせ] {name}から{point}ポイント送信されました', $context) . PHP_EOL;
if (preg_match('/{[^}]+}/', $doc)) {
    throw new Exception('Format error: Too few parameters');
}
echo $doc;
```

```text:実行結果
PHP Fatal error:  Uncaught Exception: --
```
個人的な Neovim のインストール方法

自分が使っているインストール用のスクリプトを貼っときます.

## 追記

18/11/30: Ubuntu 18.04 の場合は `pip install pynvim` を追加.

## 環境

- Ubuntu 16.04
- Python3 を有効にする

## スクリプト

※ `~/opt/pyenv/bin` にはパスが通っている.

```bash
#!/bin/bash

version="$1" # 3系

sudo apt install -y libbz2-dev libreadline-dev libsqlite3-dev

if ! [ -d ~/opt/pyenv ]; then
  git clone https://github.com/pyenv/pyenv.git ~/opt/pyenv
fi

pyenv install ${version}
pyenv global ${version}

if ! which apt-add-repository > /dev/null; then
  sudo apt install -y software-properties-common
fi
sudo apt-add-repository -y ppa:neovim-ppa/unstable
sudo apt update
sudo apt install -y neovim
pip install neovim
```
配列の要素で作る順列 (Permutation) をC#で

いろいろ書き方はありますが、与えられた配列の要素を入れ替えていくやり方を紹介します。

```csharp
using System;

class Program
{
    static void Main(string[] args)
    {
        var str = "abcde";
        Permute(str.ToCharArray(), x => Console.WriteLine(new string(x)));
    }

    public static void Permute<T>(T[] array, Action<T[]> action)
    {
        Permute(array, 0, array.Length, action);
    }

    private static void Permute<T>(T[] array, int pos, int count, Action<T[]> action)
    {
        if (count == 0)
        {
            action(array);
            return;
        }
        for (var i = 0; i < count; i++)
        {
            Swap(array, pos, pos + i);
            Permute(array, pos + 1, count - 1, action);
            Swap(array, pos, pos + i);
        }
    }

    private static void Swap<T>(T[] array, int x, int y)
    {
        var temp = array[x];
        array[x] = array[y];
        array[y] = temp;
    }
}
```
【機械学習】モデルの評価方法とは



機械学習において汎化性能はとても大事。
その汎化にかかわる評価方法の一部をご紹介。

## 交差検証
モデルの汎化性能を評価する手段。２種紹介。

### ・k－分割交差検証
回帰によく用いられる。変数ｋに用いられる数字は５～１０が多い。
scikit-learnではmodel-selectionモジュールのcross_val_score関数としてある。
他の交差検証の分割手法も実装されている。


１、5分割の検証を行う際データを5つに分割する。

２、モデルを訓練する。１の最初の分割をテストセットとして用い、残りの2～5の分割を訓練セットとして用いる。

３、テストセットに用いる分割を1つずつずらして繰り返し、分割結果に対して精度を計算


### ・層化k分割交差検証
クラス分類に用いられる。基本はk－分割交差検証と似ている。
こちらもscikit-learnにあり。

クラス分類はデータが分割した際同じクラスのデータが固まってしまう可能性がある。その際１クラス内ずつで分割を行ってくれる。



## グリッドサーチ
お次がパラメータをチューニングしてモデルの汎化性能を向上する方法。
そこに最も用いられているものがグリッドサーチ。
その為にはモデルの需要なパラメータに対して最良の汎化性能を与える性能を見つける必要がある。

そこに最も用いられているものがグリッドサーチ。scikit-learnに実装されている。

すべてのパラメータのすべての組み合わせに対して試行してくれる便利機能。

#  注意点

交差検証に関して注意すべき点が１つ。
（グリッドサーチ時でも交差検証を用いる際がある！）

使用したテストデータは利用済みとなる。
つまり同じデータを使ってモデルの性能を評価すると過度に良い検証結果がでてしまう。


その危険を避ける手法の１つは、データをまず３分割にすること。

訓練セット、検証セット、テストセットである。

検証セットで最良のパラメータを選択、訓練データと検証データでモデルの再構築、テストデータで評価すればいい。


この点には気を付けなければならない。



# 参考文献

・Pythonではじめる機械学習ーscikit-learnで学ぶ特徴量エンジニアリングと機械学習の基礎
（著者　Andreas C.Muller、Sarah Guido 発行所　株式会社オライリー・ジャパン）
【新試験内容版】AWS認定試験（ソリューションアーキテクト）を受けてきた話

# 新試験内容のAWS SAA 受験してきた

## はじめに
2018/09/25にソリューションアーキテクトに合格したので自分のやったことを書いていきます。

## AWS SAA

どんな試験は内容などは公式にお任せします。
↓
[AWS認定ソリューションアーキテクト](https://aws.amazon.com/jp/certification/certified-solutions-architect-associate/)

この試験は今年の8月12日以降は新試験仕様に変更になったので、新試験を受けてきました。
まだあまり新試験での記事はないのかな（本人の個人的感想です）と思ったのでqiitaデビューのために書いて行こうと思います。

## 自身の受験時の状況

- 情報系大学卒の社会人二年目
  - ネットワーク系を勉強
- AWSでの開発経験約10ヶ月
  - AWSでの開発はおもにClooudformationで基盤構築の自動化
  - Lambdaを使ってサーバサイドプログラムの開発

- [Architecting on AWS](https://aws.amazon.com/jp/training/course-descriptions/architect/)
を受講
  - Architecting on AWSはAWSが公式で出しているトレーニングプログラムです。これは自分で受けるのは金銭的に無理があるので会社の受講枠にいれてもらい受けさせてもらいました。（感謝感謝）

- [AWS WEB問題集](https://aws.koiwaclub.com/)を約2周（プラチナプラン）
 - AWS WEB問題集はSAAの記事を書いている人ほとんどが載せている有名なやつですね。

## 主にやった勉強方法

私の場合、業務でAWSをさわっていたことと Architecting on AWSを受講していたので問題を解くことに時間を多く割きました。（とはいうものの実際は通勤時間と試験三日前に猛烈にWEB問題集を解いた）

あとは試験用というよりも業務で使用する際に困ったことを調べていたことくらい。なので試験のための勉強はほぼ講習とWEB問題集。

## 実際に受けた感想としてやっておきたいこと

* WEB問題集を解く
* WEB問題集の解説をしっかりと理解して覚える
* 実環境を触る
* 講習を受ける（これはそこまで大切ではないけど受けられるなら受けた方がいい）

上記は実際に受けた後にわからなかった問題を解くにはどうしたらよかったのかを振り返った結果です。
WEB問題集については解くのはもちろん、解説に書いていることまでもっと読んでおくべきたったと反省...

実環境を触る点については業務上使うものはわかるけど、試験範囲内の触っていないものについては設定画面をみるだけでも違ったのかなと感じました。僕の場合はプレイスメントグループとかAuto Scaling が実業務では使っていないけど試験ではそれなりに出てきて困ったところでした。

講習はやはりテストのためにあるものなので受けられると違います。でも受けた後もう一度講習のテキストを見直さなかったのはダメでした。

## 試験内容についての感想

試験について色々調べたり、周りで受けた人の感想を聞いたりするとWEB問題集をやっておけば大丈夫感がありました。
実際に会社の人たちが徐々に受けていてWEB問題集をガンガンやって合格！という人も多かったです。

が、新試験をうけてきた感想としては

###***WEB問題集だけではちょっと難しい!!***

です。

新試験でうけた感想は

* WEB問題集で見たことのあるような問題もあるが、見たことのある問題を複合した問題になっている
* 問題文が長く前提条件や今何について問われているのかをしっかり把握する必要がある
* サーバ管理やネットワークについての基本的な知識が必要
* AWSの最新情報は収集しておく必要あり
* 試験時間は長いが一問ごとに考える時間を結構取られるので集中力と体力の勝負！


という感じです。

WEB問題集の問題は旧試験寄りなのか問題文の長いものは少ない印象でした。

問題文が長いので、**今どんな構成で何が問題でどう解決するのがいいのか**を問題文から読み取る必要がある問題が多いです。
なのでサーバ管理やネットワークの知識があると問題の本質を捉えやすいと思います。

AWSの最近のサービスについても少し出題されていたのでここもWEB問題集では勉強できない点だと思います。
受験した際に出たのは[Amazon EFS](https://aws.amazon.com/jp/efs/features/)と[Amazon ECS](https://aws.amazon.com/jp/ecs/)でした。
ただし、この二つについては細かい内容を聞かれたわけではありません。
EFSやECSが何かをわかっていれば余裕な問題でした。
でもEFSと書いてあり、これがファイルシステムのサービスであることを知っていたから簡単でした。
ECSについても、選択肢に`Docker`と思いっきり書いてありました。
新情報系はアンテナさえ張っていれば楽勝だと思うので落とさないようにしたいです。

試験時間は長くなりましたが結構時間がかかるので集中力と体力勝負なところもありました。
実際に結構疲れました...

## まとめ

色々書きましたが、WEB問題集は問題の雰囲気や基本的な内容を勉強するには最適です。
ですが、これだけでは足りないのでサービスについての理解を深めたほうがいいでしょう。
デフォルトの設定の場合の挙動は要チェック！
範囲については公式を参考にして、追加で最新情報についてもアンテナを張っておくのがいいと思います。
範囲になくても調べておけば役に立つかもしれないので範囲を気にするよりもどんなサービスなのかを把握するほうが大切。


## おわりに

もう新試験しか受けられなくなったので今後受ける人に少しでも参考になるものがあれば幸いです。
ここまで読んでくださった方、ありがとうございました。
PHPでサービスアカウントを利用してCloud Firestoreにデータを追加してみる

## はじめに
`Firebase` とか `Firestore` とか単語だけは知ってるけど実際には使った事がない人がゼロからFirestoreにデータを突っ込むまでを記したものです
なにぶん右も左もわからぬ状態ですので、情報として正しくない可能性があるのでご注意下さい :angel_tone1:


## 慣れてしまえば簡単だがそうでない場合には長い長い前準備
大体は[公式](https://firebase.google.com/docs/firestore/quickstart?hl=ja)に書いてある通り

### 1. プロジェクト設定
1. [Firebaseコンソール](https://console.firebase.google.com/?hl=ja)で適当に新しいプロジェクトを作成
2. Databaseセクションでデータベースの作成 ⇒ テストモードで開始 ⇒ 有効にする
3. コレクションを追加 ⇒ コレクションIDに「users」 次へ ⇒ フィールドに「test」 保存

### 2. サービスアカウント設定
ここで作成されるJsonファイルはクレデンシャルな認証情報なので公開等は厳禁です

1. [サービスアカウント作成ページ](https://console.cloud.google.com/apis/credentials/serviceaccountkey?hl=ja)で適当に新しいサービスアカウントを作成
2. APIとサービスセクションの認証情報で認証情報を作成 ⇒ サービス アカウント キー ⇒ 新しいサービスアカウント ⇒ サービス アカウント名に「test」、役割を「オーナー」、Jsonチェックボックス  ⇒ 作成

### 3. 開発環境設定
1. 開発環境で環境変数の設定 <br> `export GOOGLE_APPLICATION_CREDENTIALS="さっきつくったJsonファイル"`
2. [gRPCのインストール](https://cloud.google.com/php/grpc?hl=ja)
3. composer を利用して `Cloud Firestore PHP` のライブラリを追加 <br> `composer require google/cloud-firestore`

### 4. 適当にコーディング
なんとなく Lumen を利用しています
ControllerやDataSourcesは任意ですので、適宜読み替えて下さい

``` Controller.php
namespace App\Http\Controllers;

use Laravel\Lumen\Routing\Controller as BaseController;
use App\DataSources\FireStore\FireStore;

class Controller extends BaseController
{
    private $fireStore;

    public function index()
    {
        $this->fireStore = app(FireStore::class);
        $this->fireStore->addData();
    }
}
```

``` Firestore.php
namespace App\DataSources\FireStore;

use App\DataSources\FireStore\FireStoreBase;

class FireStore extends FireStoreBase
{
    public function __construct()
    {
        parent::__construct("xxxxxxxxxxxx"); // Jsonに書いてあるproject_id
    }

    public function addData()
    {
        $docRef = $this->client->collection('users')->document('lovelace');
        $docRef->set([
            'first' => 'Ada',
            'last' => 'Lovelace',
            'born' => 1815
        ]);
        printf('Added data to the lovelace document in the users collection.' . PHP_EOL);   
    }
}
```

``` FireStoreBase.php
namespace App\DataSources\FireStore;

use Google\Cloud\Firestore\FirestoreClient;

abstract class FireStoreBase
{
    protected $client;

    public function __construct($projectId)
    {
        $this->client = new FirestoreClient([
            'projectId' => $projectId,
        ]);
    }
}
```

こんな感じで実行すると、FirebaseコンソールのDatabaseにデータが追加されます :tada: 

## 最後に
右も左もわからない状態から初めて、ようやくテストデータが追加出来ました。
自分自身、かなり苦戦してしまったので、これが誰かの役に立てればと思います。
ありがとうございました :boy:
シェルスクリプトから logger で syslog に記録しておくときの私的パターン

cron から実行されたシェルスクリプトで syslog に何かを記録するために ```logger``` を使うことがある。

```logger``` には ```-i``` オプションがあってこれで tag の隣に [PID] をつけられるのだけれど、これでつく PID は logger 自体の PID なので、シェルスクリプト内で 1 行ちょろりと実行する分にはあまり意味のない PID が記録されてしまう。

```bash:ダメな例
#!/bin/sh

logger -it "compress_syslog" -p local1.info 'compressing started'
## 時間のかかる処理とかいろいろ
logger -it "compress_syslog" -p local1.info 'compressing ended'

exit 0
```

```text:ダメな実行例
Oct 22 18:01:19 test4111 compress_syslog[20139]: compressing started
Oct 22 18:01:29 test4111 compress_syslog[20143]: compressing ended
```

ので、```-t``` オプションのタグ名のところに当該シェルの PID を表す ```[$$]``` をつけてあげると良い。
これで同じ PID のシェルスクリプトから出てきたログであることを syslog 上で認識できる。

```bash:私的loggerパターン

logger -t "{スクリプト名}[$$]" -p {facilityとpriority} '{ログメッセージ}'
```


```bash:使用例
#!/bin/sh

logger -t "compress_syslog[$$]" -p local1.info 'compressing started'
## 時間のかかる処理とかいろいろ
logger -t "compress_syslog[$$]" -p local1.info 'compressing ended'

exit 0
```


```text:実行結果例
Oct 22 18:01:48 test4111 compress_syslog[19848]: compressing started
Oct 22 18:02:03 test4111 compress_syslog[19848]: compressing ended
```
CakePHP3でのコンポーネントの使い方

# 環境
CakePHP 3.5

# コンポーネントとは
コントローラー間で共有されるロジックのこと。

参考：[コンポーネント](https://book.cakephp.org/3.0/ja/controllers/components.html)

# コンポーネントの使い方
## bakeコマンドでコンポーネントを作成
```
sh bin/cake bake component Hogehoge
```

## コンポーネントに処理を書く
```src/Controller/Component/HogehogeComponent.php
  public function hogehoge()
  {
    return 'hogehoge';
  }
```

## コントローラーからコンポーネントを呼ぶ
```src/Controller/HogehogeController.php

    /**
     * Initialize method
     *
     */
    public function initialize()
    {
        $this->loadComponent('Hogehoge');
    }

    /**
     * Index method
     *
     */
    public function index()
    {
        $this->Hogehoge->hogehoge();
    }
```
Sourcetreeのエラー画面が出続ける

この前Sourcetreeでログインのエラーが出続けることがあったので、その解消の備忘録

Sourcetreeでは同じアカウント名のgithubとbitbucketでリポジトリーを作るとエラーが発生しまし。

なので、どちらかのアカウント名を変更することで解消できます。
Eloquentでjoinしたテーブルをアップデートかけようとしたらambiguousエラーがでたので調べてみた

2つのテーブルのどちらにもupdated_atがあり、Eloquentで発行するSQLをみると
テーブルを明示的に指定できていないので下記のエラーがでている。
単純にSQLを書くと`テーブル名`.`updated_at`で解消できるが、 Eloquentを使用した際の対処法。

> Column 'updated_at' in field list is ambiguous 

versionとか

- Laravel 5.5.43
- MySQL 5.7.23

テーブルの作成

```default.sql
CREATE TABLE `users` (
  `id` int(10) unsigned NOT NULL AUTO_INCREMENT,
  `name` varchar(255) COLLATE utf8mb4_unicode_ci NOT NULL,
  `email` varchar(255) COLLATE utf8mb4_unicode_ci NOT NULL,
  `password` varchar(255) COLLATE utf8mb4_unicode_ci NOT NULL,
  `remember_token` varchar(100) COLLATE utf8mb4_unicode_ci DEFAULT NULL,
  `created_at` timestamp NULL DEFAULT NULL,
  `updated_at` timestamp NULL DEFAULT NULL,
  PRIMARY KEY (`id`),
  UNIQUE KEY `users_email_unique` (`email`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;

CREATE TABLE `posts` (
  `id` int(10) unsigned NOT NULL AUTO_INCREMENT,
  `user_id` int(10) unsigned NOT NULL,
  `title` varchar(255) COLLATE utf8mb4_unicode_ci NOT NULL,
  `body` varchar(255) COLLATE utf8mb4_unicode_ci NOT NULL,
  `created_at` timestamp NULL DEFAULT NULL,
  `updated_at` timestamp NULL DEFAULT NULL,
  PRIMARY KEY (`id`),
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;
```

### 1. 一時的に自動updated_atを外し手動で現在の時間をいれる
Eloquentはupdate()やsave()を使う際、updated_atに現在の時間をいれてくれますが、一時的にその機能を外す方法。

```PostController.php
    public function update(Request $request){
        $now = Carbon::now();
        $update_columns = [
            'posts.title' => 'おはようございます',
            'posts.body' => '本日も晴天なり',
            'posts.updated_at' => $now,
        ];

        $post = new Post();
        $post->timestamps = false;

        $post->join('users','users.id','=','posts.user_id')
            ->where('posts.id',$request->id)
            ->update($update_columns);
    }
```

### 2. Builder.phpのaddUpdatedAtColumn関数を書き換える

issuesを探していたら開発中の5.8で[該当のPR](https://github.com/laravel/framework/pull/26031) がマージされていたので
これと同じ様に修正する。もちろんこれは自己責任になるので注意。

```vendor/laravel/framework/src/Illuminate/Database/Eloquent/Builder.php
protected function addUpdatedAtColumn(array $values)
    {
        if (! $this->model->usesTimestamps()) {
            return $values;
        }

        // return Arr::add(
        //     $values, $this->model->getUpdatedAtColumn(),
        //     $this->model->freshTimestampString()
        $column = $this->qualifyColumn($this->model->getUpdatedAtColumn());
        return array_merge(
            [$column => $this->model->freshTimestampString()],
            $values
        );
    }
```

### 3. オブジェクトをインスタンス化してから更新する
私は結局これに落ち着いた。
注意点としてselect()などでカラムを指定しないとidなどの値が上書きされていたので、カラムの制御かエイリアスが必要あり。

```PostController.php
    public function update(Request $request){
        // 取得
        $post = new Post();
        $post->select('posts.*')
            ->join('users','users.id','=','posts.user_id')
            ->where('posts.id',$request->id)
            ->firstOrFail();
        // 更新
        $post->title = 'おはようございます';
        $post->body = '本日も晴天なり';
        $post->save();
    }
```
Alexaスキル開発において、呼び出し名の変更がテストに反映されない場合にやること

#はじめに
Alexaスキルの開発において、スキルの呼び出し名を変更することがあります。
変更した後、ビルドを行った後、以下の画面のように「テスト」します。

この時、新しく設定した呼び出し名では呼び出せず、依然として変更前の呼び出し名じゃないと呼び出せない、という場合があります。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/245438/80c4d508-76cd-cc1c-35cb-f32d17042726.png)

あれ、おかしいな、反映されるまでに時間がかかるのかな、と思うかもしれませんが、解決方法は簡単です。

- テストを無効にして、再度有効にする

これだけです。

呼び出し名を変更した後は、このテストを有効にするトグルスイッチを一度オフにして、再度オンにしてください。

新しい呼び出し名で呼び出すことができます。


#補足
インテントに対して変更を加えた後、ビルドし、テストを有効にするトグルスイッチのオン・オフを行わずにテストを行ってみました。
変更したとおりに動きました。
インテントについては変更後にトグルスイッチのオン・オフは不要のようです。
Railsのアプリケーションをherokuで公開してみる(sqlite3 & pg編)

開発環境
Mac OS Sierra
Rails 5.1.6
Ruby 2.3.1
homebrew 1.7.6

## この記事を読む方へ
この記事は特に、Railsのアプリケーションをherokuで初めて公開するという方を対象にした記事です。
**※また、herokuに登録している、そしてgithubにリモートリポジトリがある前提です**

## herokuで公開する手順

### Gemfileにある既存のsqlite3を削除し、sqlite3とpgのgemを追加する
```
group :development, :test do
  gem 'sqlite3'
end

group :production do
  gem 'pg', '0.20.0'
end

```

そして、bundle installする

```
$ bundle install
```


### config/database.ymlのproduction環境を以下の記述に書き換える

```
production:
  <<: *default
  adapter: postgresql
  database: db/production.postgresql

```

### herokuコマンドを使えるようにしよう

```
$ brew install heroku/brew/heroku
```

### herokuに公開鍵を登録する
```
$ heroku keys:add
```

### herokuにloginする
```
$ heroku login
```

ここで、herokuに登録してあるemail addressとpasswordを入力する。
**一度、ログインしたことある方はemailが入力済みであるかと思うので、enterを押して進んでも構いません**

### heroku上にアプリケーションを作成する
```
$ heroku apps:create アプリケーション名
```

### herokuのリモートリポジトリを確認
```
$ git remote -v
```

このように、表示される

```
heroku https://git.heroku.com/先ほど作成した時にherokuに設定したアプリケーション名.git (fetch)
heroku  https://git.heroku.com/先ほど作成した時にherokuに設定したアプリケーション名.git (push)
origin  git@github.com:yutakatahira/リモートリポジトリ名.git (fetch)
origin  git@github.com:yutakatahira/リモートリポジトリ名.git (push)
```

### herokuにDATABASE_URLが表示されるか確認する
```
$ heroku config
```
すると以下のように表示される

```
DATABASE_URL: postgres:// ....
````

ない場合は次のコマンドを実行する

### herokuにDBを追加する
```
$ heroku addons:create heroku-postgresql:hobby-dev
```

### DATABASE_URLがあるか、再度確認しましょう
```
$ heroku config | grep DATABASE_URL
```

### herokuへプッシュする
```
$ git push heroku master
```

### migration fileがあれば、実行する
```
$ heroku run rake db:migrate
```

### herokuにアップしたアプリケーションをweb上で確認する
```
$ heroku open
```

## その他
### homebrewにpostgresqlをインストールしていない方へ


```
$ brew install postgresql
```

###herokuのログを詳しく見れるようにする

```
group :production do
  gem 'rails_12factor'
end
 ```

そして、bundle installする

```
$ bundle install
```

###もし、エラーが出たら、下記のコマンドでログを確認してください

```
$ heroku logs
```


初投稿なので、指摘あればコメントください> <
CakePHP3のMigrationコマンドの使い方

# 環境
CakePHP 3.5

# マイグレーションコマンド
## 一括実行
```
sh bin/cake migrations migrate
```

## Migration IDを指定して実行
```
sh bin/cake migrations migrate -t 20180912030211
```

## ロールバック（一つ前に戻す）
```
sh bin/cake migrations rollback
```

## ロールバック（指定したMigration IDまで戻す）
### 現在の状態を確認する
```
sh bin/cake migrations status

Status  Migration ID    Migration Name
 up  20180912030211  CreateHoge0
 up  20180912031300  CreateHoge1
 up  20180912031354  CreateHoge2
```

### 「CreateHoge1」と「CreateHoge2」を取り消す
```
sh bin/cake migrations rollback -t 20180912031300
```

### 取り消した結果を表示する（donwとなっているので、取り消された）
```
sh bin/cake migrations status

Status  Migration ID    Migration Name
 up  20180912030211  CreateHoge0
 down  20180912031300  CreateHoge1
 down  20180912031354  CreateHoge2
```
Audiophile Linux インストール後設定

ISO からのインストールはすんなり終わるが, その後の設定で詰まったのでメモ。

## 参考文献

- [AP Linux v4 install instructions | AudioPhile Linux](https://www.ap-linux.com/documentation/ap-linux-v4-install-instructions/)
- [Enabling a specific mirror - Mirrors - ArchWiki](https://wiki.archlinux.org/index.php/mirrors#Enabling_a_specific_mirror)


## ミラーリスト編集

- 既存のファイルをバックアップして, 日本のサーバーのみ残す。

```bash
cd /etc/pacman.d; pwd
sudo cp -aiv mirrorlist mirrorlist.`date +%Y%m%d`
ls -l mirrorlist mirrorlist.`date +%Y%m%d`
```

```bash
sudo vi mirrorlist
cat mirrorlist
```

```conf:/etc/pacman.d/mirrorlist
##
## Arch Linux repository mirrorlist
## Filtered by mirror score from mirror status page
## Generated on 2017-04-15
##

## Japan
Server = http://ftp.jaist.ac.jp/pub/Linux/ArchLinux/$repo/os/$arch
Server = http://ftp.tsukuba.wide.ad.jp/Linux/archlinux/$repo/os/$arch
```


## 初期設定

- `pacman-key --init` 実行時は, 別コンソールで `ls -R /` や, GUI でマウスをぐりぐり動かすと時間を短縮できる。

```bash
sudo pacman-key --init
sudo pacman-key --populate archlinux
sudo pacman -Sy
sudo pacman -S archlinux-keyring --noconfirm
```


## OS アップデート

- 事前に `libxfont` と `ffmpeg2.8` を削除しないと, 後続のアップデートでエラーが発生する。

```bash
sudo pacman -Rc libxfont ffmpeg2.8 --noconfirm
sudo pacman -Suy --noconfirm
```


- ここでも, 一旦依存パッケージを削除しないと, OS 再起動後に X が起動しない。

```bash
sudo pacman -Rc xf86-video-ati xf86-video-intel xf86-video-nouveau xf86-video-vesa --noconfirm
sudo pacman -S terminus-font xorg-server glibc xf86-video-fbdev xf86-video-vesa --noconfirm
```


## mpd 初期化

- `pacman -Suy` を実行するとファイルが更新されるので, これを初期化する。

```bash
cd /etc/apl-files; pwd
sudo cp -aiv mpd.service /usr/lib/systemd/system/mpd.service
ls -l /usr/lib/systemd/system/mpd.service mpd.service
```


## マウントオプション修正

- 設定ファイルをバックアップ後, `relatime` を `noatime` に修正する。
   - SSD 利用時のオプションは公式サイトの文献を参照すること。

```bash
cd /etc; pwd
sudo cp -aiv fstab fstab.`date +%Y%m%d`
ls -l fstab fstab.`date +%Y%m%d`
```

```bash
sudo vi fstab
diff -u fstab.`date +%Y%m%d` fstab
```

```diff:/etc/fstab
--- fstab.20181022      2018-10-22 16:42:04.326666664 +0900
+++ fstab       2018-10-22 17:21:59.213333333 +0900
@@ -1,3 +1,2 @@
 # /dev/sda1
-UUID=dbfd8632-91ef-4ea6-ba8c-ff06244e9973      /               ext4            rw,relatime,data=ordered        0 1
-
+UUID=dbfd8632-91ef-4ea6-ba8c-ff06244e9973      /               ext4            rw,noatime,data=ordered 0 1
```


## OS 再起動

```bash
sudo systemctl reboot
```

どっとはらい。
文字列検索サイトを作りました。

こんにちは！

今日は、文字列検索サイトを作りました。

検索エンジンとしてないのはまだforeachの理解が完全にできていない事

それから、PDOに関する理解が深まっていないことが理由です。

完全に先に進んでおらず停滞しているものと思ってもらって結構でございます。

それでは、ソースコードです。

```
<!doctype html>
<head>
<title>
サンプルフォーム２
</title>
</head>
<body>
<form action="OCT22-1.php" method="POST">
<input type="text" name="index" placeholder="文字を入力してください">
<input type="submit" value="検索">
</form>
```
こうして、フロントエンドは作成しました。

そして、サーバーサイド側のソースコードです。

```PHP
<?php

$data = htmlspecialchars($_POST['index']);

$arr = array('ブラック企業','SES企業','ホワイト企業','働き方改革');

	foreach($arr as $val){
		if(strpos($val == 'ブラック企業',$data) === false){
			echo $data."という文字は含まれています";
						  }
				break;
		}
```
このようにしました。

検索画面ですべての文字を入力して

動かしてみましたが、想定した通り動きました。

これにさらに、スーパーグローバルのサーバーなどで画像表示も

させてみたら面白くなりそうな気がしませんか？

私自身のプログラミングスキルはまだまだ初心者の域を出ませんが

早く中級者の皆様と肩を並べられるように

１日も早く学習を進めていかねばと思っています。

以上です。

いつもブログを読んでいただきまして

誠にありがとうございます。
Angular使いの NativeScriptハンズオン

## NativeScriptとは？

NativeScriptは、
**クロスプラットフォームのネイティブなiOSとAndroidアプリをWebビューなしで構築する方法です**。
Angular、TypeScript等の、Webスキルとコードを再利用しながら、ネイティブなUIとパフォーマンスを実現することができます。

## NativeScript 初めの一歩

### NativeScript インストール

```shell
npm install -g nativescript
```

### NativeScript でAngularのテンプレートを使用

Angular Template を使用するには、 `--ng` オプションを追加する。

```shell
tns create ${app-name} --ng
```

### iOS用にエミュレーション
既にAngularのサンプル用のテンプレートができているので、今回はそちら表示させます。

```shell
tns run ios
```

### android用にエミュレーション
既にAngularのサンプル用のテンプレートができているので、今回はそちら表示させます。

```shell
tns run android
```

### 参考：

- [NativeScript](https://docs.nativescript.org/start/introduction)