OmniAICreator/Qiita-1.07M huggingface dataset:
AWS Lambda~AWS IoT間をSubscribeする

#前説
色々な記事を参照しましたが、あくまで自分の備忘録です。

#前回の記事
ハードウェア~AWS IoT間をMQTT通信してみました。
次にやろうと思うのは、AWS Lambda~AWS IoT間の通信です。
サーバーレスアーキテクチャには初挑戦です。

#AWS Lambda
結構玄人が好んでいるAWS Lambda。EC2のように仮想マシン内にサーバー構築しなくとも、　Lambda内にプログラムを記述するのみです。AWS初心者なのでロールやClientid,boto3などは初挑戦でした。

- JavaScript
- Python
- C#

以上の言語をサポートしています。

#目標
iOS -> AWS Lambda -> AWS IoT -> ESP32

#ロール作成
まず最初にロール作成をします。

AWS IAMにおいて、ロールを設定して、Lambdaのインスタンスに割り当てます。
そこでポリシーを　

- AWSIoTFullAccess

のようなAWSIoTにPushできるようなポリシーを追加して保存してやります。

<img width="1222" alt="スクリーンショット 2018-07-05 13.36.32.png" src="https://qiita-image-store.s3.amazonaws.com/0/253129/ec5de6a8-09ae-2c13-3474-46baa56a28a0.png">


#Lambdaインスタンス作成
Lambdaに戻ってインスタンスを作成します。

<img width="1292" alt="スクリーンショット 2018-07-05 13.36.49.png" src="https://qiita-image-store.s3.amazonaws.com/0/253129/3778fcad-8e37-572d-385f-96b95a25d38c.png">

「名前」は分かりやすいものならなんでも構いません。
「ランタイム」で言語やバージョンを選択できます。私はPython 3.6に設定しました。
「ロール」ではAWS IAMにて作成したロールを割り当てます。

これで作成！！

#Lambdaの詳細設定

<img width="1285" alt="スクリーンショット 2018-07-05 13.43.34.png" src="https://qiita-image-store.s3.amazonaws.com/0/253129/b09163a5-423a-d92a-7290-e766eb7a2b8f.png">

上記で作成したロールを割り当てたため、アクセスできるリソースのところにAWS IoTが追加されているのが確認できますねえ。

<img width="1267" alt="スクリーンショット 2018-07-05 13.42.34.png" src="https://qiita-image-store.s3.amazonaws.com/0/253129/12bc4b67-b118-7507-1496-0d8121c3ed34.png">

ではいよいよコードを書いていきます。
コードをインラインで編集してもいいのですが、zipファイルをアップロードした方が確実かと思われます。

[コード参照先](https://recipe.kc-cloud.jp/archives/10348)

参照先の方のコードを使わせていただきました。
気をつけていただきたい点は、ファイル名はlambda_function.pyとして保存するという点です。

メイン関数はlambda_handler(event, context)となっており、おそらく裏でこの関数を実行するよう担っているのだと思いますが、もう少し深く理解したいなあと思った。

```:Terminal
$ zip lambda_function.zip lambda_function.py
```

これでアップロードします。

#AWS IoTで確認
AWS IoTのテストにて
先ほどのプログラムで記述したトピック名を指定します。

<img width="872" alt="スクリーンショット 2018-07-05 13.53.14.png" src="https://qiita-image-store.s3.amazonaws.com/0/253129/e630bf3b-5c11-861a-1b87-1b12e6629d32.png">

きちんと　AWS IoTで受け取ることができてますね。

#次にやること
Lambdaデビューは果たしたので、次ももう少しいじる。
- 双方向通信を実装
- デバイスID-ESP32をきちんと指定できているのか
  - 指定した覚えがない
- Arduino側のプログラムを変えて、LED制御。
Git Hub② -ブランチの作成〜-

## 内容について
・Git Hub
・ターミナル
・vs code
を使って、ファイルの変更をする場合の流れを備忘録として残します。
今回は「ブランチの作成〜ローカルでの作業」について。
Git Hub①の続きです。

## 1. ブランチの作成
ターミナルを開き、ブランチを作成します。
初期状態では、`master`ブランチが存在しています。

**ブランチを確認するためのコマンド**

```
$ git branch
```

![スクリーンショット 2018-07-05 11.11.34.png](https://qiita-image-store.s3.amazonaws.com/0/225743/bc1651ef-47b7-ff43-e75f-f7374516efe6.png)

「*」がmasterについているのは、現在のブランチという意味である。

**ブランチを作成するコマンド**
今回は、`feature/test`というブランチを作成する。

```
$ git branch feature/test（作成するブランチ名）
```
`$ git branch`をして`master`と`feature/test`が表示されれば良い。

![スクリーンショット 2018-07-05 11.17.51.png](https://qiita-image-store.s3.amazonaws.com/0/225743/375e78bb-c62e-7d23-be88-0557f3155854.png)

この段階では、まだ`master`ブランチにいるので、`feature/test`ブランチで変更作業をしていく為に、チェックアウトして`feature/test`に移動する。

**チェックアウトするコマンド**

```
$ git checkout feature/test（ブランチ名）
```
![スクリーンショット 2018-07-05 11.25.15.png](https://qiita-image-store.s3.amazonaws.com/0/225743/d6ab063d-3730-5b1b-8542-e1aa90b33545.png)

`$ git branch`をして、ブランチを移行できたかを確認する。

![スクリーンショット 2018-07-05 11.28.39.png](https://qiita-image-store.s3.amazonaws.com/0/225743/feb1f4ba-9d59-23e0-b8bf-97bc6dacab70.png)

「*」が`feature/test`に付いているので、移動完了。
この状態でファイルの変更を行っていく。

---
※vs codeでファイル変更。
ちなみに、vs codeでは左下に作業しているブランチの名前が表示されているので、きちんと確認すること。
![スクリーンショット 2018-07-05 11.36.46.png](https://qiita-image-store.s3.amazonaws.com/0/225743/4a304579-9559-56c4-efee-23087577a241.png)

---

## 2. ファイル変更後の流れ
ファイルの変更が完了したら、下記の流れで変更を登録していく。

**変更したファイルを`add`する。**

```
$ git add .
```
**変更したファイルを指定する場合**

```
$ git add ファイル名
```

**変更したファイルをcommitする**

```
$ git commit -m "変更内容説明"
```

**変更したファイルをリモートに反映**
commitしたら、リモートに反映させる。

```
$ git push origin feature/test（ブランチ名）
```
続きはGit Hub③で。
Git Hub① -リポジトリの作成編-

## 内容について
・Git Hub
・ターミナル
・vs code
を使って、ファイルの変更をする場合の流れを備忘録として残します。
今回は「リポジトリの作成」について。

## 1. リポジトリの作成
Git Hub上でリポジトリを作成します。
※今回は「work」という名前で作成する。

![git1.png](https://qiita-image-store.s3.amazonaws.com/0/225743/9a24e7cb-6831-f153-8912-0ef5bc1f445a.png)

作成できたら、上記の画面になります。
ページはこのままで、ターミナルでの作業に移ります。
## 2. 作業をするディレクトリに移動
今回は、「work」というフォルダを新規作成し、作業をしていきます。

**移動するコマンド**

```
$ cd 【移動するディレクトリのパス】
```
※フォルダをターミナルにドラッグ&ドロップしても良い。

![git2.png](https://qiita-image-store.s3.amazonaws.com/0/225743/c51923ae-fca8-0fc2-a000-3ce6697fa86f.png)

完了したら、Git Hubに戻り、先ほどのページの赤枠の内容をターミナルに入力していく。

```
echo "# test2" >> README.md
git init
git add README.md
git commit -m "first commit"
git remote add origin https://github.com/mitsuyabu/work.git
git push -u origin master
```


入力後のGit Hubのページは下記の通り。

![スクリーンショット 2018-07-05 10.46.18.png](https://qiita-image-store.s3.amazonaws.com/0/225743/55a621d7-b3c4-1c5d-3af4-c816d9edbfaf.png)

以上、リポジトリの作成でした。
Git Hub②は「ブランチ作成編」。
直前のgit commitを削除するには

Githubに誤ったcommitをpushしてしまったので、
`git rebase`で戻したいcommitまでさかのぼり
禁じ手`git push -f`で強制pushで解決したので備忘録。

```
C:\Users\folder>git rebase -i [xxxxxxx]　#ハッシュ値でコミットを指定
C:\Users\folder>git push -f
Total 0 (delta 0), reused 0 (delta 0)
To github.com:MyRepository
 + [yyyyyyy]...[xxxxxxx] master -> master (forced update)

C:\Users\folder>
```
今回は直前のコミットが削除対象だったのでこれで解決しましたが、
`git push -f`がそもそも危険なやり方なんだろうなぁ…と。^^;

### 参考サイト
- [過去を改ざんして過去のコミットをなかったことにする方法](https://qiita.com/suin/items/94b0ca48fa34eb7ec048)
- [git rebase して git push -f すると何が起こるか](https://qiita.com/arc279/items/3b6e26ebf854166f3e0d)
- [[Git]コミットの取り消し、打ち消し、上書き](https://qiita.com/shuntaro_tamura/items/06281261d893acf049ed)
Local Storageとオブジェクトのまとめ

４月からプログラミングスクールにフルタイムで通い始めて早３ヶ月、この機会に色々と復習して記事にまとめていこうと思います。わかりにくい点、間違っている点などありましたらコメントでご指摘ください。

まずはLocal Storageとオブジェクトを使ってメモパッドアプリを作った時に学んだ事を復習しようと思います。

#### 完成品はこれ
http://eiciemm.sakura.ne.jp/memopad/

# 大まかな処理：
重要度の高い処理だけをピックアップして解説します。完全なコードは↑の完成品を参照ください

```javascript
const notes = JSON.parse(localStorage.notes || '[]');
```
２つの処理をこの一行でまとめてます。
（１）LS内のnotesというキー名が存在すれば、valueを取り出しparseし、notesに入れる。
（２）LSが空であれば、空の配列をparseし、notesに入れる。
<img width="311" alt="スクリーンショット 2018-07-05 13.53.11.png" src="https://qiita-image-store.s3.amazonaws.com/0/173182/22d2b086-64c6-cdad-0237-de72b7b207cb.png">

```javascript
function addNote() {
   notes.push({
      text: '',
      top: 60,
      left: 30,
      color: Math.floor(Math.random() * 10 / 2),
      zIndex: maxIndex + 1,
   });
   data2Dom();
   saveData();
}
```
notesという配列にオブジェクト（１枚のカードを構成する要素で成り立ってます）をpushする。
カードを新規作成した時に呼びます。

```javascript
function data2Dom() {
   let html = '';
   for (let i = $('.note').length; i < notes.length; i++) {
      html += `
      <div class="note">
      <div class="handle"/>
      <textarea class="text"/>
      <div class="trash">Delete</div>
      </div>
      `;
   }
   $('#board').append(html);

   for (let i = 0; i < notes.length; i++) {
      const note = notes[i];
      $('.note').eq(i).css({
         zIndex: note.zIndex,
         top: `${note.top}px`,
         left: `${note.left}px`,
         background: colorList[note.color],
      }).children('.text').html(note.text);
   }
}
```
オブジェクトをDOMに描画する処理です。
一つ目はカードのオブジェクトが増えた時だけDOM要素を生成するので少し特殊なfor文です。
二つ目はnotesという配列内に存在する全てのオブジェクトにCSSを当てるので通常のfor文です。

```javascript
function saveData() {
   localStorage.notes = JSON.stringify(notes);
}
```
notesという配列をJSON形式でLocal Storageに保存（key名はnotes）する。

data2Dom()とsaveData()は、オブジェクトが新規で作成された時はもちろん、プロパティに変更が起こる（テキスト内容を書き換えたり、ドラッグして動かしたり）毎に呼んでます。


# 最後に
オブジェクトはJavaScriptを使いこなす上で重要でそれだけに特化した本もあるほどです。https://www.oreilly.co.jp/books/9784873116815/
この本を読んで得た知識や気づきを次回以降まとめていこうと思います。
git tips 

##リモートのURLを変更する。
    現在のURLを確認
    git remote -v 
    新しいURLに変更する。
    git remote set-url origin https://github.com/misoragod/ardupilot.git 

##リモートのURLを変更した後にローカルにあるソースをpushする。
git add -A 
git push -u origin master 
**master以外のブランチになっている場合はmasterの代わりにそのブランチ名を指定する。

##ユーザとメールアドレスを変更する。
$ git config --global user.useConfigOnly true
$ git config --global --unset user.name
$ git config --global --unset user.email

$ cd /path/to/my_repo
$ git config user.name "My Name"
$ git config user.email "me@example.com"

##ローカルに新しいブランチを作成する。
$git checkout -b yatagarasu-v2

##リモートに新しいブランチを作成する。
$git push -u origin yatagarasu-bv2  

##変更をリモートに反映する。
$git add file_name
$git commit -m "Type message here"
$git push   

##現在のローカルブランチとリモートブランチの差分を表示。
$git diff remotes/origin/master

##リモートリポジトリから最新情報をローカルリポジトリに持ってくる。
$git fetch 

##リモートリポジトリのURLを確認する。
git remote -v

##ある1ファイルの変更点を見る
git diff -- 対象のファイルパス

git diff ブランチA..ブランチB -- 対象のファイルパス


##remoteの設定を行でエラーが出た
git remote set-url origin https://github.com/xxxxxx/xxxxx.git
fatal: No such remote 'origin'
原因は一番最初にremote addしていなかったから
なので正しくは

git remote add origin https://github.com/KTakata/poke_app.git
あくまで
remote set-url origin hugahuga
は一度設定しているremoteの向き先を変えるってお話


##直前のコミットを取り消す。
git reset --soft HEAD^ 

##git addを取り消す。
git reset

##git fetch
https://qiita.com/osamu1203/items/cb94ef9da02e1ec3e921

##Publicで公開されているリポジトリをprivateリポジトリにする方法
https://help.github.com/articles/duplicating-a-repository/


##ローカルリポジトリを作成してGitHubにpushするまでの手順
ローカルリポジトリを作成⇒GitHubにpushする手順をよく忘れるのでメモする。
まずは、リモートにリポジトリを作成する。

    $ git init
    $ git add .
    $ git commit -m "first commit"
    $ git remote add origin https://github.com/misoragod/pwm.git
    $ git push -u origin master

##コラボレータをプライベートリポジトリへ招待する。
https://help.github.com/ja/github/setting-up-and-managing-your-github-user-account/inviting-collaborators-to-a-personal-repository

https://help.github.com/ja/github/setting-up-and-managing-your-github-user-account/permission-levels-for-a-user-account-repository#collaborator-access-on-a-repository-owned-by-a-user-account
超初心者が学ぶJavaScriptとreturn falseによる中断処理

# はじめに
久しぶりのQiita投稿になります。２０１８文系卒未経験エンジニアです。最近は本格的に業務に携わるようになり、以前のようにPHPだけを触っていれば良いというわけにもいかなくなりました。
今回はJavaScript、ならびにVie.jsを勉強したのでそのメモ。

# 実装した処理

複数のIDを入力できるフォームの送信ボタンが押された際に、半角数字以外が入力されていた場合にエラー処理を出すというものです。
当初はこのようにしていました。

```vuejs

<input type="submit" class="btn" value="検索" v-on:click="check()">

~~

check: function() {
            var ad_group_id = this.adGroupId;
            var ad_group_ids = ad_group_id.split(/\r\n|\r|\n/);
            for (var i = 0; i < ad_group_ids.length; i++) {
                var pattern = /^\d*$/
                if (pattern.test(ad_group_ids[i]) == false) {
                    alert("半角数字を入力してください。");
                    return false;
                }
            }
            document.searchForm.submit();
        }


```

しかし、正規表現のチェック後アラートは出るものの、そのまま送信されてしまっていました。


正しく動くコードは以下です。

```vue
<input type="submit" class="btn" value="検索" onclick="return false" v-on:click="check()">

~~

check: function() {
            var ad_group_id = this.adGroupId;
            var ad_group_ids = ad_group_id.split(/\r\n|\r|\n/);
            for (var i = 0; i < ad_group_ids.length; i++) {
                var pattern = /^\d*$/
                if (pattern.test(ad_group_ids[i]) == false) {
                    alert("半角数字を入力してください。");
                    return false;
                }
            }
            document.searchForm.submit();
        }


```
inputタグ内にonclickの記述を追加しました。
onclick="return false"は一言で言うと**処理を止める**ための記述だそうです。
なので流れは、if文の中を通ったらアラート→return false(js内の)でjsの処理ストップ。その結果処理がストップしたままでいてくれるそう。
逆に中を通らなかった場合は、一度処理がストップした後にsubmitのフォームを呼び出しているので結果的に送信は行えるとのこと。

# 感じたこと
* onclickでreturn falseを記述しないと処理が走ってしまう
* jsのonclickとvue.jsのv-on:clickは共存できる(?)
* JavaScript勉強しなければなあ

# 最後に
まだ4月に未経験からデビューしたエンジニアなので、間違いや誤った解釈は多々あると思います。もしそのような点を発見されたらぜひ一言修正いただけますと大変助かります。
rails触りながらハマったときの解決メモ

# rails s → だめです

## 権限を確認する
```
sudo chmod -R 777 /usr/local/var/mysql/
```


[bundle install "rmagick" でインストールができない - Qiita](https://qiita.com/sho012b/items/362abe993248c686fcf4)


[mysqlが起動できない - Qiita](https://qiita.com/hondy12345/items/d32ed749fb49e9da7de6)

## 流れ

```
ERROR 2002 (HY000): Can't connect to local MySQL server through socket '/tmp/mysql.sock' (
```

### Step1
エラーログを
（2） → (38)
に変えて


### step 2

[mysqlが突然起動しなくなる　第二幕 - 猫も杓子も記事を書く](http://hidamariman.hatenadiary.jp/entry/2016/02/01/133205)

/tmp/mysql.sock.lock
を消す

# mysql 再起動
```
$ sudo mysql.server restart

```

# なんか変なときのDB再起動など

```
# データベースのやりなおし
$ bundle exec rake db:drop
$ bundle exec rake db:create
$ bundle exec rake db:migrate

# 種をまく
$ bundle exec rake db:seed:user
$ bundle exec rake db:seed:kessan
```

# rails s で立たない
```
rails s

...
...
...
Address already in use - bind(2) for "0.0.0.0" port 3000 (Errno::EADDRINUSE)
```

###解決策

使われてるポートを頑張って消します

```terminal

ps aux | grep puma
*****             692   0.0  0.3  2566352  28056   ??  S    10:40AM   0:00.38 puma 3.12.0 (tcp://0.0.0.0:3000) [******]  
↑こいつが原因なので

sudo kill -9 692(ポート番号)

ちゃんと消えてるか確認
ps aux | grep puma
```

参考
http://hyottokoaloha.hatenablog.com/entry/2015/09/17/144100

# rbenv

[rbenv: bundle: command not found の解決](https://qiita.com/geshi/items/02ffd4c4c888ad8256a9)

# 本番環境→テスト環境切り替え

```database.yml
username: root
password:

development:
  <<: *default
  database: *****_development
```


```puma.rb
environment ENV.fetch("RAILS_ENV") { "development" }

#homeディレクトリの設定とかしてたらそこも変更
```
Node.js上でCUIコマンドを実行する

#Node.jsでCUIコマンド実行
今回、Node.jsからCUIコマンドを実行する方法を
紹介したいと思います。
たまたま、適当なnodeモジュールを漁っていて
見つけたものでそこまで知られていないと思います。
※ あまり推奨されることではないので実際の利用は注意
##必要なもの
 - Node.js 実行環境
 - child_processモジュール

Node.jsの実行環境やローカルサーバの呼び出しなどは、
省略させていただきます。

```index.js
const exec = require('child_process').exec
let callback;

function CUIExe(){
  let NodeJSExec = "command_name [option] [arg]"
  if (process.env.SUDO_USER) {
    NodeJSExec = 'sudo -u ' + process.env.SUDO_USER + ' ' + NodeJSExec;
  }
  return exec(NodeJSExec, callback);
}

```
##最後に
参考にしたモジュールはこちらです
https://www.npmjs.com/package/open-cli
npmインストールした後、
一緒にopenモジュールがダウンロードされます。
その中のopen.jsの中に
CUIコマンドをNode.js上で実行できる機構を
確認したので共有しておこうと思いました。

間違い等あれば
指摘の方よろしくお願いします。
XSERVER BUSINESS環境へ「WP-CLI」をインストールする

#### 1. 「wp-cli」インストール
``` sh
cd ~

# ディレクトリ作成
mkdir wp-cli

cd ~/wp-cli

# wp-cli.pharをダウンロード
curl -O https://raw.githubusercontent.com/wp-cli/builds/gh-pages/phar/wp-cli.phar

# 実行権限付与
chmod +x wp-cli.phar

# 動作確認
php wp-cli.phar --info
```

#### 2. 「wp-completion.bash」インストール
``` sh
cd ~/wp-cli

wget https://raw.githubusercontent.com/wp-cli/wp-cli/master/utils/wp-completion.bash
```

#### 3. 「.bash_profile」編集
``` sh
cd ~

cp -ip .bash_profile .bash_profile.org

diff .bash_profile.org .bash_profile

vi .bash_profile
# 以下追記
source ~/wp-cli/wp-completion.bash

diff .bash_profile.org .bash_profile

source ~/.bash_profile
```

#### 4. 「.bashrc」編集
``` sh
cp -ip .bashrc .bashrc.org

diff .bashrc.org .bashrc

vi .bashrc
# 以下追記
alias wp='php ~/wp-cli/wp-cli.phar'

diff .bashrc.org .bashrc

. ~/.bashrc
```
Railsの開発環境でcssがロードされないときの解決方法

オープンソースのSharetribeを開発中にcssが開発環境で反映されない事態に遭遇しました。
下記の方法で解決しましたので載せておきます。


`config/development.rb`に下記の1行を追加します。

```config/development.rb

config.assets.digest = false
```

サーバーを再起動します。
システムマネジメントしているか？ 技術的負債やDXへの取り組み

# マネジメントとは？

マネジメントとひと言で言っても、色々な領域が存在する。

マネジメントと言う話で、まず大きく分けられるのが
・プロダクトマネジメント
・プロジェクトマネジメント
・ピープルマネジメント
の３つがある

僕はエンジニアであればここにシステムマネジメントを加えたい。

## そもそもマネジメントの価値とは？

正直マネジメントが無くても、ことは進むと思っている。
ただし、そのスピードが遅くなっていたり、チームのパフォーマンスが最大化していない状態。

進むスピードが遅いというのは、止まっているわけではないので問題に手を付けづらい状態である。
遅いというのは相対的な価値なので、閉じた環境では場合によっては問題自体に気が付かないことすらある。
止まった状態になったときに初めて問題として認識して手を付けるのが常だ。
もっと早く手を打てばこんなに問題にならなかった。そう思うことも多い。


つまり、マネジメントとは仕事において、ゴールである価値の提供に対して、チームのパフォーマンスを最大化することだと考えています。

チームのメンバーが優秀かどうかではなく、現状のチームや環境を改善し、最大のパフォーマンスを引き出すことがゴールです。
そのためにプロジェクトを管理したり、どのような人間でどの様な価値観を持つ人間かを理解したり、そしてどのようなものを作るべきかを考えるマネジメントがあると考えます。


# システムマネジメントの概念

これもマネジメントのため、ゴールは価値の提供である。
システムを完成させることがゴールではなく、価値を提供しなければシステムの意味はない。
ゴールの価値にたどり着くためにシステムが必要なだけ。

つまりオーバーデベロップメントでは価値提供に届かない部分の開発にコストを掛けている可能性がある。
汎用性や柔軟性を持った開発はコストが掛かる。それが価値に繋がっているかを判断する必要がある。
これはプロジェクトの状況やフェーズによって同じ判断にならないので、随時あらゆる情報の中でバランスを取る必要がある。
柔軟性などを持たないシステムを作った場合には技術的負債になりうる可能性があります。
しかし、価値提供のスピードは圧倒的に早い場合もあります。この部分を判断する必要があります。

次に短期の価値提供戦略と中長期の価値提供戦略は全く別物になります。
通常システムマネジメントをしないチームはビジネスメンバーの要求を最短で開発する短期価値提供に偏る傾向があるのではないかと思います。


## システムマネジメントの具体的観点と施策

#### 技術的負債
- 新規開発時の価値提供スピードの低下 (柔軟性・堅牢性)
- エンジニアモチベーションの低下
- 不要な運用コストの発生

よくある認識は上記のような項目であるが、完全悪ではないと言う認識を持つべき
何故ならば、負債を受け入れる代わりに価値の提供のスピードを上げることが出来ることが多いからだ
つまり、負債を受け入れることで受け取れるメリットと負債受け入れによるリスクの認識、そして負債解消の計画をする必要がある。ここが僕の考えるシステムマネジメントの大きな軸の１つであると考えています。

負債を受け入れることは事業のスピードの向上を意味することがあると言うことを認識し、事業全体を俯瞰した上でシステムのアーキテクチャや作りを決定する必要があるということです。

中長期的な計画を持って負債解消をしなければ、いつまでも負債は解消されず、全力で走っていても重りを付けたまま走っているようなものです。目標は全力で走ることではないです。重りを解消するタイミングを計画し、実行することが必要です。

#### Developer Experience (DX) 
- テストコード
- 継続的なインテグレーション
- 最新バージョンのライブラリ/フレームワーク
- Gitなどでのコラボレーション
- ドキュメントツールによる知識の形式化、知識の管理と共有


エンジニアは快適に開発ができる環境を求めています。
快適に開発ができる環境とは、良いマシンや良い椅子などもありますが、システムの開発する上で安心して追加変更出来るようなテストコードや必要最低限のドキュメント、快適なデプロイ環境、チームコラボレーションをサポートするツールや運用など、エンジニアにしか分からない快適な開発体験があります。

ビジネスチームだけでエンジニアの環境改善を行うとやってしまいそうなのが、ひたすらエンジニアに甘い環境を作ってしまうことです。パフォーマンスが出せる良い環境と甘い環境は別物だと考えています。
しかし、エンジニアは環境作成や実行権限を持っていないことも多いので、組織的にはなかなか難しい課題とは思います。

エンジニアの体験(Experience)改善はエンジニアの手で行えると良いですね。

#### 事業展開の想定から考えるアーキテクチャ構成やデータ構成

最初にシステム要件と来る情報は全ての情報が入ったものではなく、最初の価値提供のためのサイズになっていることが多いと思います。
ただ、事業コンセプトと市場状況とアイデアが掛け算されていると、事業方向性のいくつかのパターンとその中での可能性とがいくつかイメージとしてありうると思います。

その中でデータの成長やパターンの増加などをどのくらい許容できるように作っておくかは重要になると考えます。データ項目の増減はデータ分析や機械学習のモデルなどに影響を与えますが、それらの修正の影響をどれだけ許容できるように作っておくか、色々なパターンがあるロジックの部分の拡張性をどれだけしっかり作り込んでおくかなどは、持たせたい汎用性と柔軟性のポイントは事業や追加機能の方向性によって変わると思います。

これはエンジニアリングだけでは解決できない問題であり、事業の視点からシステムを俯瞰して判断する必要があると考えています。

## システムマネジメントは誰がするべきか？

完全に組織の形によるものになってしまうと思います。
20人までのエンジニアのサイズであればCTOと呼ばれる人が事業的に重要なシステムをチェックして良いかもしれません。

複数チームで分かれているならばテックリードが中心になって考えるのが良いかもしれませんし、スクラムの考えではチーム全員で考えることかもしれません。
組織構造でサポートするならSREチームがその役割の一部を担っているかもしれません。

いずれにせよ、技術部分に関する投資と価値提供のバランス、短期と中長期のバランスを考え、段取りを作るべき人が居たほうがより良い価値提供につながると考えています。


# 締め

エンジニアにしかわからない感性の中でのマネジメントが存在していると考えています。
美しいソースコード、美しいアーキテクチャ、美しいシステム。
それらは厳しい要求があっても、すばやく開発ができるものだったり、エンジニアが楽しく開発出来るものだったりします。

それらを上手く決定し進めて、楽しい価値がある開発が出来るようなチームや組織を作れたらといつも願っています。



勢いで色々書きました。
面白かったらいいねくれると、また記事を書きます(笑)
複数項目の詳細表示 / 非表示を、JQuery5行で実装する

![slideToggle.mov.gif](https://qiita-image-store.s3.amazonaws.com/0/255971/007e819c-3d0e-bc49-f6b0-30979b81a92e.gif)

よくあるこういうリスト形式の詳細表示非表示をJQuery5行で実装しました。

HTML・CSSはこんなかんじです。

```html:pulldown.html
<head>
  <link rel="stylesheet" type="text/css" href="./stylesheet.css">
  <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
  <script src="./pulldown.js"></script>
</head>

<body>
  <div class="item1 pulldown">
    <div class="pulldown-head" data-slide="slide1">ここを押すと表示 / 非表示</div>
    <div class="pulldown-body slide1">詳細部分1</div>
  </div>

  <div class="item2 pulldown">
    <div class="pulldown-head" data-slide="slide2">ここを押すと表示 / 非表示</div>
    <div class="pulldown-body slide2">詳細部分2</div>
  </div>
</body>
```

```css.stylesheet.css
.pulldown {
  width: 300px;
  margin: 0 0 10px 20px;
}

.pulldown-head {
  background-color: lightgreen;
  height: 40px;
}

.pulldown-body {
  display: none;
  background-color: lightgray;
  height: 200px;
}
```

当然、pulldown-headクラスにクリックイベントをバインドしてpulldown-bodyをスライドダウンする記述だと、ひとつのpulldown-headをクリックした時に全ての要素のbodyが表示されてしまいます。

だからといって要素１つ１つにjsを書いていては冗長すぎるので、以下のようにしました。

まずHTML追記。

```html:pulldown.html
<div class="pulldown-head" data-slide="slide1">ここを押すと表示 / 非表示</div>
<div class="pulldown-body slide1">詳細部分1</div>

<div class="pulldown-head" data-slide="slide2">ここを押すと表示 / 非表示</div>
<div class="pulldown-body slide2">詳細部分2</div>
```

js５行書く。

```js:pulldown.js
  $(function(){
    $('.pulldown-head').on('click', function(){
      $('.' + $(this).data('slide')).slideToggle(700);
    })
  })
```



## 解説

### ポイント１：カスタムデータ属性経由で詳細部分を取得

まず詳細部分のHTMLタグに、その項目特有のクラス名（ここではそれぞれslide1, slide2)を付与します。
次に、head部分のHTMLタグにカスタムデータ属性(ここではdata-slide)を付与し、その値に上で定義したクラス名を入れます（slide1, slide2)

こうすることで、js側で、クリックされた要素のdata属性の値がクラス名である要素を取得することが可能になります。

```js
//data-slideがslide1の要素をクリックした時
$('.' + $(this).data('slide'))==$('slide1')

//data-slideがslide2の要素をクリックした時
$('.' + $(this).data('slide'))==$('slide2')
```
なお、このときJQueryのセレクタで外側をクォーテーションマークで囲む必要はないようです。

### ポイント２：slideToggle()

名前の通り、要素をスライド表示・非表示するslideUp(), SlideDown()と、表示非表示を交互に行うtoggle()がこれひとつでできちゃうお得なセット。
もはや解説不要です。

### 補足

スライド表示・非表示に加えて同時に他の動きをさせたい（たとえば詳細部分の文章をfadeするとか)場合、head部分のカスタムデータ属性を増やして同じように記述すればオッケーです。
fadeToggleもあるよ、、！

```html:pulldown.html
<div class="pulldown-head" data-slide="slide1" data-fade="fade1">ここを押すと表示 / 非表示</div>
<div class="pulldown-body slide1">
  <p class="fade1">詳細部分をフェードイン / アウト</p>
</div>
```
```js:pulldown.js
  $(function(){
    $('.pulldown-head').on('click', function(){
      $('.' + $(this).data('slide')).slideToggle(700);
      $('.' + $(this).data('fade')).fadeToggle(700);
    })
  })
```

###失敗したこと

最初、クリックされた要素の兄弟要素を取得してそれをスライドさせる処理を書いたんですが、同じクラス名が複数存在している場合うまく動かないみたいでした。

###おしまい
何かのお役に立てば・・・。
Chefでリソースのactionへの引数を、String(もしくはそのArray)から変換する

##問題
Chefでリソースのactionに渡す引数は、SymbolもしくはSymbolのArrayである必要がある。

##レシピの例：

```ruby:recipes/default.rb

service 'firewalld' do
  action [:stop, :disable]  # ここがSymbolもしくはSymbolのArray
end
```


##Ruby DSLの場合の例:

その引数をChefのattributeに持たせる場合、Ruby DSLであれば、SymbolもしくはSymbolのArrayで保持できる。

```ruby:attributes/default.rb
default['foo']['service']['firewalld']['action'] = [:stop, :disable]  # Ruby書式ならそのままSymbolもしくはSymbolのArrayで持てる
```



##JSONの場合の例:
しかし、例えばchef-clientコマンドに-jオプションでJSONで渡す場合などでは、JSONにはSymbolが無い為、String(もしくはそのArray)などで記述する必要が生じる。

```json
{
  "foo": {
    "service": {
      "firewalld": {
        "action": [
          "stop",
          "disable"
        ]
      }
    }
  }
}
```

:stopや:disableは使えない。

#対応0 StringもしくはSymbolなら.to_symにより対応可能

```ruby:recipes/default.rb

node['foo']['service'].each do |s_name, s_attr|
  service s_name do
    action s_attr['action'].to_sym
  end
end
```
Stringのto_symメソッドはSymbolに変換
Symbolのto_symメソッドはSymbolのまま何もしない
Arrayにはto_symメソッドは無い
したがって、Array(Chef::Node::ImmutableArray)の場合にはエラーとなる。

```
       NoMethodError
       -------------
       undefined method `to_sym' for ["stop", "disable"]:Chef::Node::ImmutableArray
```

#対応1 Class別に処理を分ける
Stringであれば.to_symにてSymbol化が可能
Arrayであれば、.map { |e| e.to_sym }にてSymbolのArray化が可能
どちらか判らなければ、class毎に対応を変更する

```ruby:recipes/default.rb

node['foo']['service'].each do |s_name, s_attr|
  service s_name do
    if s_attr['action'].class == Chef::Node::ImmutableArray
      action s_attr['action'].map { |e| e.to_sym }  # もしくは.map(&:to_sym)
    else
      action s_attr['action'].to_sym
    end
  end
end

```
もしくは三項演算子
しかし、いずれにせよ長く読みにくい

#対応2 Classを拡張する
Array(正確にはChef::Node::ImmutableArray)の場合に個々の要素毎に.to_symをしてくれれば良いので

```ruby:recipes/default.rb

class Chef::Node::ImmutableArray  # Chef::Node::ImmutableArrayクラスを拡張 (Rubyの柔軟性は凄い)
  def to_sym
    self.map{ |e| e.to_sym }
    # map(&:to_sym)               # cookstyle -a を通すと、上の行はこう変換される。&:については参照3
  end
end

node['foo']['service'].each do |s_name, s_attr|
  service s_name do
    action s_attr['action'].to_sym
  end
end

```
これで値がStringでもStringのArrayでも大丈夫
単純な関数likeなmethodを書いても良さそう。


#参照
- [シンボルでも文字列でもアクセス可能なHashを使おう！ActiveSupport {Hash編}:[コラム]オープンクラスとは？](http://mugenup-tech.hatenadiary.com/entry/2013/12/24/103952)
- [rubyのチェーンメソッド関数の作り方](https://ja.stackoverflow.com/questions/5226/rubyのチェーンメソッド関数の作り方)
- [2-32【統一】ブロックの各要素でメソッドを1つだけ呼び出す場合は、proc呼び出しのショートハンド「&:」を使う](https://techracho.bpsinc.jp/hachi8833/2017_01_17/32603#2-32)
- [ChefからInSpecにattributeをJSON経由で渡したら、シンボルが文字列になっていた
](https://qiita.com/hiroyuki_onodera/items/526c33b2c09a145c1a76)
バイオリンプロットの本当の描き方を見せてやる

「バイオリンプロット」の本当の描き方を簡単ですが以下に示します。

```python
%matplotlib inline
import matplotlib.pyplot as plt
```


```python
import numpy as np
import math
x = np.linspace(0, 2.0 * math.pi, 15)
y = np.sin(x)
```

まず以下のようにして、丸いマーカーを使ってプロットを描きます。

```python
markers = []
markers.append(('o', [100, 0, 0, "black"]))
for m, s in markers:
    plt.scatter(x + s[1], y + s[2], marker=m, c=s[3], color=s[3], s=s[0])
plt.show()
```


![output_2_0.png](https://qiita-image-store.s3.amazonaws.com/0/211162/7add30a4-8c44-2fd9-8cc3-4b56caa08630.png)


次に、少し小さめの丸いマーカーで、少しだけ位置をずらしてプロットします。

```python
markers.append(('o', [60, 0.1, 0.1, "black"]))
for m, s in markers:
    plt.scatter(x + s[1], y + s[2], marker=m, c=s[3], color=s[3], s=s[0])
plt.show()
```


![output_3_0.png](https://qiita-image-store.s3.amazonaws.com/0/211162/d68b8d75-3c3f-6737-7fac-941d04abaf34.png)


次に、小さい丸を使って、位置を微調整しながらプロットします。このとき、白などの背景色を選ぶのがポイントです。

```python
markers.append(('o', [20, 0.17, 0.03, "white"]))
for m, s in markers:
    plt.scatter(x + s[1], y + s[2], marker=m, c=s[3], color=s[3], s=s[0])
plt.show()
```


![output_4_0.png](https://qiita-image-store.s3.amazonaws.com/0/211162/2ab365d9-182f-9e2a-7cb7-296c677d8c23.png)


同じ大きさの小さい丸で、位置を微調整しながらプロットします。これで胴体のクビレができました。

```python
markers.append(('o', [20, -0.05, 0.09, "white"]))
for m, s in markers:
    plt.scatter(x + s[1], y + s[2], marker=m, c=s[3], color=s[3], s=s[0])
plt.show()
```


![output_5_0.png](https://qiita-image-store.s3.amazonaws.com/0/211162/bb4e92d4-e1b9-53dc-c261-0054f545de9b.png)

続いて、ネックの部分を作成します。forとrangeを使って細かい丸をプロットすることで線を描きました。

```python
for n in range(11):
    xy = n * 0.01 + 0.14
    markers.append(('o', [1, xy, xy, "black"]))
for m, s in markers:
    plt.scatter(x + s[1], y + s[2], marker=m, c=s[3], color=s[3], s=s[0])
plt.show()
```


![output_6_0.png](https://qiita-image-store.s3.amazonaws.com/0/211162/8b5be48a-f96e-69bf-892d-ded87283e2e2.png)

最後にペグの部分をちょいちょいと足してやれば、、、

```python
markers.append(('o', [1, 0.22, 0.20, "black"]))
markers.append(('o', [1, 0.20, 0.22, "black"]))
markers.append(('o', [1, 0.24, 0.22, "black"]))
markers.append(('o', [1, 0.22, 0.24, "black"]))
for m, s in markers:
    plt.scatter(x + s[1], y + s[2], marker=m, c=s[3], color=s[3], s=s[0])
plt.show()
```


![output_7_0.png](https://qiita-image-store.s3.amazonaws.com/0/211162/526e5ab7-b976-5e8b-00ea-2e3770a22019.png)

バイオリンっぽくなりましたね！！

## 参考

* matplotlib で使える marker を全て試してみる
    * http://ailaby.com/plot_marker/
* ウニプロットをmatplotlibで描く
    * https://qiita.com/maskot1977/items/03d76587f05ba40e1fd7
C++ Builder XE4 > LME288 (2018-07-05版) (Windows 7) > 対処 > Debugフォルダと.local, .resファイルを消す > 有効ではない? 

```txt:動作環境
C++ Builder XE4
```

### 関連

- [C++ Builder XE4 > LME288 (2018-05-15版) (Windows 7) > 対処 > (*.objファイル削除 + IDEを再起動) * 数回](https://qiita.com/7of9/items/f9f9552377d6ba25f90b)
- [C++ Builder XE4 > LME288 (2018-06-28版) (Windows 7) > 対処 > Link: 【RS10.2Tokyo】リンクできません、の続き @ BLOGN.MONZEN.ORG 様 > 再発](https://qiita.com/7of9/items/fe704ac4ac78790434d3)

### 症状

ビルドできていた環境が突然LME288エラーになる。

### 対処

今回以下を実施したら解消した。

1. Win32/以下を削除
2. .localファイルを削除
3. .resファイルを削除
4. ビルドしなおす

再現性の高い解決方法化は不明。


### 追記 2018/07/06

再発したので上記の対応を実施した。
3回試したが、解消しなかった。

その後、ログインしなおしビルドをしなおすとLME288エラーは出なくなった。

### 追記 2018/11/02

以下を試したところ直った

1. 起動していたゲストOSを終了
2. VMWareの該当ウィンドウを閉じる (VMwareの別ウィンドウは開いたまま)
3. 新しいウィンドウでゲストOS(XE4のWindows 7)を起動
4. ビルドする

問題が出始めたのは、ゲストOSイメージファイルのコピーのためいったんゲストOSを落としてから。
deviseでSTIを使う時

STIを使う機会があってハマったのでメモ

```ruby
class User < ActiveRecord::Base
end

class Hoge < User
end

class Fuga < User
end
```
の場合

```ruby
# app/controllers/application_controller.rb
devise_group :user, contains: [:hoge, :fuga]
```
これを追加する。
プログラミング初心者が入門３ヶ月で使ってよかった教材まとめ

プログラミングの勉強を本格的に始めて３ヶ月になりますが、費用対効果が高かったと思える教材等をまとめておきます。

##未経験からプロのWebデザイナーになる！ 400レッスン以上の完全マスターコース
https://www.udemy.com/web-design-master/learn/v4/overview
Udemyの通信教育です。1,300円で購入しました。Photoshop、HTML、CSSの基本的な事項が網羅されています。説明も丁寧で、分かりやすかったです。

##Material Design
https://material.io/design/
Googleが無料で公開しているウェブデザインのガイドラインです。ウェブデザインの基本的な事項が網羅されています。英語版のみのようです。

##ドットインストール
https://dotinstall.com/
通信教育です。無料講座もありますが、月額980円で有料講座も全て受講できますので、980円だけ払って一通り受講しました。JavaScriptとPHPの講座が充実しています。

##SQL入門
https://www.1keydata.com/jp/sql/
無料で公開されています。SQLの基本的なコマンドが具体例を交えて解説されています。

##Create a REAL Social Network like Facebook in PHP + MySQL
https://www.udemy.com/make-a-social-media-website/
Udemyの通信教育です。1,300円で購入しました。下記の言語を使用してSNSの基本的な機能を実装していきます。特に、PHPについては、class、include、require、ajax等の重要なコマンドを多用しますので、勉強になりました。
使用言語：HTML、CSS、JavaScript(jQuery、Bootstrap)、PHP、MySQL

##リーダブルコード――より良いコードを書くためのシンプルで実践的なテクニック
https://www.oreilly.co.jp/books/9784873115658/
とりあえず動くコードが書けるようになった後は、よいコードを書くことが重要になってきますが、そういう視点で書かれたテキストです。私は英語版を読みましたが、日本語版も定価2,592円で販売されています。分かりやすくコンパクトにまとまっていますので、数日もあれば、読める内容です。
今日の日付を表示するプログラム　C言語

#はじめに
今日の日付を表示するプログラムを書いてみました

#ソースコード
```
#include <stdio.h>
#include <time.h>

int main (void) {
    time_t t = time(NULL);
    struct tm tm;
    char str[81];
    
    localtime_s(&tm,&t);
    
    strftime(str,sizeof(str),"%Y-%m-%d %H:%I:%S",&tm);
    
    printf("%s",str);
    
    return 0;
}
```
実行結果!




![hizuke.png](https://qiita-image-store.s3.amazonaws.com/0/249273/47a99942-db2b-fc81-5037-66fae90267bf.png)
BQで、STRINGのunixtimeをJSTに変換する

# 何したかったのか
１秒未満の時刻をログにのこしソートしたかった。

syslogフォーマットだと１秒以下が記録されないので、雑にunixtimeをstringで送っておいた。

```
TIMESTAMP_ADD(TIMESTAMP_MILLIS(CAST(ROUND(  CAST(unixtime as float64 ),3) * 1000 AS int64)),INTERVAL 9 HOUR) as JST
```

##注意点
- 時間はJSTだけど、表示はUTCになる
- standard sql

`Special thx ＠satoruxx`
Linux Mint 18.3のPHP7.0を7.2にする

諸般の事情でPHP7.0で始めたプロジェクトを、7.2に移行することになったので、環境構築したときのメモです。

# 参考文献
[UbuntuにPHP7の環境をつくる](https://qiita.com/yamatmoo/items/b9e8035c55032de88084)

# リポジトリ準備
```
sudo add-apt-repository ppa:ondrej/php
sudo apt update
```

PHP7.2がインストール可能になる

# PHP7.2インストール

```
sudo apt install php7.2 php7.2-dev php7.2-mbstring php7.2-common php7.2-gd php7.2-xml php7.2-zip php7.2-mysql
```

Laravel5.5を動かす前提で必要なモジュールもインストール

# 確認
```
php -v
PHP 7.2.7-1+ubuntu16.04.1+deb.sury.org+1 (cli) (built: Jun 22 2018 08:44:50) ( NTS )
Copyright (c) 1997-2018 The PHP Group
Zend Engine v3.2.0, Copyright (c) 1998-2018 Zend Technologies
    with Zend OPcache v7.2.7-1+ubuntu16.04.1+deb.sury.org+1, Copyright (c) 1999-2018, by Zend Technologies
```
できました。
PHPunit実行時にメモリが足りない・・・

# テストは大事
Laravel（version 5.6）でWebアプリケーションを開発中。
Unitテストを中心に、たくさんのテストを作成している。
# こんなエラーが出た
```ruby:エラー内容
Fatal error: Allowed memory size of 134217728 bytes exhausted
```
許可されているメモリサイズを超過したらしい。
# 対処方法
Laravelの`phpunit.xml`というファイルに以下を追加する。

```XMLruby:phpunit.xml
<phpunit.../>
  <php>
    <ini name="memory_limit" value="-1"/>
  </php>
</phpunit>
```
`memory_limit`を無限大にするということらしいです。
SQL Server Management Studio(SSMS) で、列を追加する。



#T-SQLで、テーブルに列を追加する
![image.png](https://qiita-image-store.s3.amazonaws.com/0/93227/31d4ad26-2b55-790f-2dcb-1cfe1c288ed6.png)

データベースが、Azure SQL だと、SQL Server Management Studio(SSMS) Ver11.0 で、列を追加するのに、［デザイン］メニューが出てきません。


![image.png](https://qiita-image-store.s3.amazonaws.com/0/93227/ca19d8cd-2eeb-0cc5-f082-d3440ab4cc57.png)

なので、クエリーで追加しなければなりません。
T-SQLコマンドを忘れないように記述しておきます。


SQL Server Management Studio(SSMS) Ver17.x だと、［デザイン］メニューがあるみたいです。

## ALTER TABLE コマンドを実行する。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/93227/11e67afa-8cf0-1048-3fd0-9823c93aeaa5.png)

```SQL
ALTER TABLE [テーブル1] ADD [カラム1] [データ型] [NULL or NOT NULL];
```

```SQL
ALTER TABLE T_SysLblKihon
ADD [明細01] NVARCHAR(50) NULL ;
```

#AccessとExcelを連携してクラウドシステムを作成する
データベースをAzure SQL にセットして、AccessやExcelのプログラムから データベースを遠隔地間で共有するシステムを公開しています。

[<img src="https://qiita-image-store.s3.amazonaws.com/0/93227/1e640f8b-edfd-2b4e-aafe-ce96a835dd7b.png" width=70%>](http://access-cloud.hatenablog.com/entry/database)
http://access-cloud.hatenablog.com/entry/database
Qiita > tag > 32bitがundefinedbitになる症状の回避

```txt:動作環境
Windows 10 Pro (64bit) バージョン 1803 (April 2018 Update)
Google Chrome バージョン: 67.0.3396.99（Official Build） （64 ビット）
```

### 症状

2018年7月5日現在、Qiita記事作成時、「数値で始まるタグ」を入力しようとすると`undefined***`に変換される。

手順

1. タグ入力欄に`32bit`と入力
2. タグ候補を選択
    - => `undefinedbit`になる

### 対応

実は、単純な方法で対応可能でした。

手順

1. タグ入力欄に`32bit`と入力
2. Escキーを押す

### Firefoxでは発生しない
(追記 2018/07/21)

下記の環境では発生しなかった。

```
Ubuntu 16.04 LTS
Firefox Quantum 61.0.1
```

同じUbuntuでChromeでは発生する。
ChromeとQiitaの組合せによる問題なのかもしれない。

### FireFoxでも発生する場合がある?
(追記 2018/07/29)

macOS(バージョン不明）でFireFox Developer Editionでは発生したという報告もあります。
サンプルコードでわかるNSObjectのdictionaryWithValues(forKeys:)

環境はSwift 4.1(Xcode 9.4.1)

NSObjectのインスタンスメソッド [dictionaryWithValues(forKeys:)](https://developer.apple.com/documentation/objectivec/nsobject/1411319-dictionarywithvalues)をわかりやすくするためにサンプルコードを書いてみた。

メソッドは`NSObject`を継承したオブジェクトのプロパティを配列の値からDictionaryにできる。

```swift
import Foundation

class Object: NSObject {

    @objc dynamic let a: Int = 1
    @objc dynamic let b: Int = 2
    @objc dynamic let c: Int = 3
    @objc dynamic let str = "Hello"
    @objc dynamic let value = Value()

    class Value: NSObject {
        let v = 1
    }

    override init() {
        super.init()

        let keys = ["a", "b", "c", "str", "value"]
        let dictionary = dictionaryWithValues(forKeys: keys)
        print(dictionary) // ["b": 2, "str": "Hello", "value": {NSObject, v 1}, "a": 1, "c": 3]
    }
}

let object = Object()
```

- プロパティが`NSObject`を継承していればそれも使える（例では`Value`）
- `@objc dynamic` にない項目を`keys`で指定してしまうとSIGABRTする
EntityFramework CoreのDatabase First Approachで、Modelを作成する

#EntityFramework Coreで、DBからModelクラスを生成する
ASP.netで開発されている技術者の方は、Visual StudioのADO.NETを使って、モデルの生成をされているかと思います。
しかし.Net Coreの世代になるとマルチプラットフォームになるため便利なGUIのツールは用意されなくなりました。
もちろん出来なくなった訳ではなく、コマンドラインから実行することができます。
これからの主流は、.Net Coreになりますので、コマンドラインからのModel作成を調査してみました。
##テストプロジェクトの作成
ASP.Net Coreのプロジェクトを作成します。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/7839/7cadac7a-260b-4ad3-e592-1da2fe845f36.png)

##Packageの設定
下記の4つのパッケージをNuGetで登録します。

+ Microsoft.EntityFrameworkCore
+ Microsoft.EntityFrameworkCore.SqlServer
+ Microsoft.EntityFrameworkCore.SqlServer.Design
+ Microsoft.EntityFrameworkCore.Tools.DotNet

![image.png](https://qiita-image-store.s3.amazonaws.com/0/7839/6d700790-7780-d305-ca2e-c68d9defa738.png)
##csprojファイルに、定義を追加
csprojファイルにDotNetCilToolReferenceを追記します。

```xml:DbFirstApproach.csproj
<Project Sdk="Microsoft.NET.Sdk.Web">

  <PropertyGroup>
    <TargetFramework>netcoreapp2.1</TargetFramework>
  </PropertyGroup>

  <ItemGroup>
    <PackageReference Include="Microsoft.AspNetCore.App" />
    <PackageReference Include="Microsoft.EntityFrameworkCore" Version="2.1.0" />
    <PackageReference Include="Microsoft.EntityFrameworkCore.SqlServer" Version="2.1.0" />
    <PackageReference Include="Microsoft.EntityFrameworkCore.SqlServer.Design" Version="1.1.5" />
    <PackageReference Include="Microsoft.EntityFrameworkCore.Tools.DotNet" Version="2.0.3" />
  </ItemGroup>
  <ItemGroup>
    <DotNetCilToolReference Include="Microsoft.EntityFrameworkCore.Tools.DotNet" Version="2.0.3" />
  </ItemGroup>
</Project>
```
##開発者コマンドの実行
開発者コマンド プロンプト for VS 2017を起動して、プロジェクトルートへ移動します。
###Model作成コマンド

```
dotnet ef dbcontext scaffold "Server=[サーバー];Database=[DB名];persist security info=True;user id=[ID];password=[PW];MultipleActiveResultSets=True" Microsoft.EntityFrameworkCore.SqlServer -o Models
```
###更新コマンド
-f オプションで、強制更新されるみたいです。

```
dotnet ef dbcontext scaffold "Server=[サーバー];Database=[DB名];persist security info=True;user id=[ID];password=[PW];MultipleActiveResultSets=True" Microsoft.EntityFrameworkCore.SqlServer -o Models -f
```
##参考
[EntityFramework Core Database First Approach (ASP.Net Core Part - 7)](https://www.youtube.com/watch?v=7NDE8wR5X_c)
【Python3】時差付きの時間を表す文字列をdatetimeに変換したい

Python 3.5.2

良くこういう時間表記をみかけますよね。

```
 Wed, 04 Jul 2018 05:37:23 -0700
```
このフォーマットに名前とかあるんですかね？

Python3でこの文字列をJSTに変換したかったのでメモを残します。

```
>>> from datetime import datetime
>>> from pytz import timezone
>>> t = datetime.strptime('Wed, 04 Jul 2018 05:37:23 -0700','%a, %d %b %Y %H:%M:%S %z')
>>> t
datetime.datetime(2018, 7, 4, 5, 37, 23, tzinfo=datetime.timezone(datetime.timedelta(-1, 61200)))
```
これでdatetimeに変換できました。tzinfoがついてますね。
これをJSTに変換します。

```Python
>>> t.astimezone(timezone('Asia/Tokyo'))
datetime.datetime(2018, 7, 4, 21, 37, 23, tzinfo=<DstTzInfo 'Asia/Tokyo' JST+9:00:00 STD>)
```

最後にYYYY-mm-dd HH:MM:SSに変換します

```Python
>>> datetime.strftime(t.astimezone(timezone('Asia/Tokyo')),'%Y-%d-%m %H:%M:%S')
'2018-04-07 21:37:23'
```
Ruby on Railsでgroup byとorder byを組み合わせて使う方法

そもそもSQLの勉強不足だということもあり躓いたので、メモします。

# group byとorder byをあわせて使いたい

以下のようなmessage_searchesテーブルがあるとします。

| id      |      message_room_id |    message_id   |
|:------------------:|:------------------:|:------------------:|
| 1             |    10 |       2      |
| 2          |   30 |      4    |
| 3          |  10 |     1    |
| 4           | 10|      5    |
| 5            | 20 |    6   |
| 6         | 20 |     3  |

このテーブルにおいて、各message_room_idにおいて、message_idが一番大きいレコードのみを取得したいと思います。手順としては、message_idでorder byをしてからmessage_room_idでgroup byをします。
欲しい結果は、idが2, 4, 5のレコードです。

# group byされてからorder byされてしまう
```messages_controller.rb
MessageSearch.order(message_id: :desc).group('message_room_id')

# => SELECT  `message_searches`.* FROM `message_searches` GROUP BY `message_searches`.`message_room_id` ORDER BY `message_searches`.`message_id` DESC
```
上記SQLから、order byを先に記述しても、先にgroup byが実行されてしまいます。（RailsというよりSQLの基本）
結果、GROUP BYにより、idが1, 2, 5のレコードが取得され、ORDER BYにより、idが5, 2, 1の順番に並べ替えられます。

# 解決方法
以下リンクを参考に、fromを使うことでサブクエリが使えます。(サブクエリの中の処理が先に実行されます。)
http://api.rubyonrails.org/v4.2.10/classes/ActiveRecord/QueryMethods.html#method-i-from

.from(サブクエリ内の処理, :エイリアス名)

```messages_controller.rb
MessageSearch.group('message_room_id').from(MessageSearch.order(message_id: :desc), :message_searches)
# => SELECT  `message_searches`.* FROM (SELECT `message_searches`.* FROM `message_searches` ORDER BY `message_searches`.`message_id` DESC) message_searches GROUP BY message_room_id
```
先にORDER BYされてからGROUP BYされるようになりました。

# 2019/6/24に追記
最初はこのやり方で検索をかけていましたが、10万件を超えるレコードだと圧倒的に**パフォーマンスが落ちてしまいました**。（今更感で申し訳ございませんm(_ _)m）したがって、サブクエリを使ったやり方はあまりおすすめしません。

どのような対処をしたかというと、今回のケースだと、以下lastest_messagesテーブルを作成し、こちらのテーブルで検索するようにしました。message_searchesテーブルでレコードが作られた際、after_saveでlastest_messagesテーブルの関係するlastest_message_idを更新するようにしています。

| id      |  message_room_id |    lastest_message_id   |
|:------------------:|:------------------:|:------------------:|
| 1             |    10 |       5      |
| 2          |   30 |      4    |
| 3          |  20 |     6    |
Redmineのデフォルトの文字の大きさを変更する

# 概要
Redmineのデフォルトの文字が小さくて見にくいと一部の人から言われたので、大きくなるように変更

# 変更するファイルと場所
{文字の大きさ}部分を任意に変更

```css:/var/lib/redmine/public/stylesheets/application.cssの2行目
body { font-family: Verdana, sans-serif; font-size: {文字の大きさ}px; color:#333; margin: 0; padding: 0; min-width: 900px; }
```

変更したらRedmineを再起動すること
android stdioのエミュレーターをRyzen(AMDのCPU)で動かすには

###始めに、、
---
普段から家でAMD製のCPU（RYZen）を搭載したPCでゲームやら学校でやったプログラム関係の授業の復習なりしてるんですが・・・
ある日、家でandroid studioでエミュレーターを使おうとしたら
**動きませんでした！！！！！**
って事で、色々調べてみた。
###調べた結果
---
結論から言ってしまえば**動かないです！！**
理由は、これだけ

・そもそもAndroid StudioはAMDのCPUをサポートしていない。
・エミュレーターを動かすために提供しているのはIntelCPU向けのHAXMのみ

たったこれだけ。 
Android StudioがAMDのCPUに対応してくれればいいんですけどねー・・・
恐らく当分先なんだろうなー
###どうやって動作確認する？
---
付属してくるエミュレーターを動かせない以上は、打ち込んだプログラムが
ちゃんと動作してくれるかどうかすら、わからない、、、
ってことでまた、調べてみた

・実機を使用する←僕が、普段してるやり方
・Android Studioについてきている低速なエミュレーターで我慢する(とにかく遅いらしい)
・高速な他社製Androidエミュレーターで我慢する

2、3番目は試したことはない
いずれ、やってみようかな？、、、
実機を持っている人は、実機でやるのがいいんじゃないか
2でやるひとは、メモリが4GBなら、かなりしんどいらしい（起動に20分以上とか、、、）
あっ、android stdioが推奨してるメモリは8GBだよ
###最後に
---
結局は、動かないんで実機が一強みたいなところが、ありそう
そういや、intelの新しいCPUが出ましたね（i7 8086K）
あれで、自作PC組んで使うものありかも知れない、、、
Qiitaの画像アップロード上限について

# アップロード上限について
記事を初めて投稿しようとして、画面キャプチャの画像を何枚か添付したところ、途中から以下のエラーが出ました。

```
![Payload Too Large]()
```

調べて見るとQiitaに1件も投稿してない状態では、画像のアップロード上限は2MBで、1件以上投稿したことがあれば月間100MBとのことです。

#### 参考URL  
- Qiitaに1件も投稿していない時の画像アップロード容量の上限は月間2MBまで  
https://qiita.com/unsoluble_sugar/items/f61be798972883e44877  

# 画像を添付した下書き（記事）を消しても容量は減らない
前述のとおりアップロードの上限は分かったので、容量を減らそうと思い下書きを削除して、別の記事を書こうとしたところ、画像を1ファイルだけアップロードしようとした時点で同じエラーが出ました。

いろいろと試された方によると記事を削除しても、少なくともすぐには画像は消えないようです。
#### 参考URL  
- Qiitaの記事に埋め込んだ画像の開放タイミングについて   
 http://satoru-takeuchi.hatenablog.com/entry/2017/03/03/090041

# まとめ
- 記事をQiita上で書き始める前に添付を予定している画像の容量を確認する
- 誤った画像を添付した場合、下書きの状態で記事を削除しても画像は消えないため、画像の選択時は十分に注意を行う
Enzymeのshallowとinstanceの違いに関して

# 想定読者
enzyme、jest触りはじめの方
enzymeのshallowとinstanceの違いがわからないぞという方

# Enzymeのshallowとinstanceの違いがわからなかった...
最近Jest+enzymeでテストコードを書いてるんですが、いまいちshallowとinstanceの違いがわからなくてモヤモヤしてたんですがようやくわかったのでメモしてます。

# まずshallowってなに?
Enzymeには3つのレンダリング方法があります。
1. Shallow Rendering
2. Full DOM Rendering
3. Static Rendering
です。

これらの違いの説明は[公式サイト](http://airbnb.io/enzyme/docs/api/)に任します！

shallow Renderingはその中の1つのレンダリング方法です。
shallow(浅い)という意味通り「浅くやるんだな〜」くらいに思っておいていいと思います。(最初は)
今回はこのshallow Renderingの中でshallow()とinstance()を使って行きたいと思います。

# shallow( )はどうやって使うの？

```tsx
describe('<MyComponent/>のテストだよ', () => {
  it('shallow()をつかって見るよ', () => {
    const wrapper = shallow(<MyComponent />);
    expect(wrapper.find(Foo)).to.have.length(3);
  });
});

```

こんな感じで使います。

shallow( )を使うことによってShallowWrapperなるものができます。
それに対してfind( )、html( )といったメソッドを使うことで色々なテストができるのです。
find( )、html( )といったメソッドの詳しい使い方は[こちら](http://airbnb.io/enzyme/docs/api/ShallowWrapper/find.html)

# じゃあinstance( )ってなんだよ
ここできました。instance。
実際のコードは以下になります。

```tsx
describe('shallowのテストだよ', () => {
  it('instance()つかって見るよ', () => {
    const wrapper = shallow(<MyComponent />);
    const inst = wrapper.instance();
    expect(inst).to.be.instanceOf(MyComponent);
  });
});
```

なにやらshallow()を使った後にwrapperに対してinstance()を使っていますね。
instance()は文字どおりインスタンス(実体)を作成するメソッドです。
正確に言うとReactComponentを返すメソッドです。

ここで疑問が生まれます。
ShallowWrapperと何が違うんだよという疑問です。
ShallowWrapperもインスタンスっぽい雰囲気を醸し出してるので一瞬インスタンスなのか
と思いそうになるんですが違います。
今から違いを書いていこうと思います。

# ShallowWrapperとinstanceの違い
一言で言うと
shallow()で作成したShallowWrapperに対してはEnzyme側が提供しているメソッドを全て使うことができます。
さっきでてきたfind()やらhtml()やらそんな感じのやつです。

それに対して、instance()を用いて作成したインスタンスにはEnzymeが提供しているメソッドを使うことができません。コンポーネントに書いてあるメソッドだけは使うことができます。

以下の具体例で確認します。

例えばこんなクラスがあるとします。

```tsx:human.tsx
class Human extends React.Component {
  handleClick = () {
    console.log("クリックされたわ〜");
  };

  render() {
    return (
      <div>こんにちは</div>
    );
  }
}
```

これをテストする際のテストスクリプトはshallow()だけを使う場合、

```tsx:human.test.tsx
describe('<Human/>をテストするよ', () => {
  it('shallow()だけ使ってみるよ', () => {
    const wrapper = shallow(<Human />);
    wrapper.find('div');
  });
});
```

のような感じでEnzymeが用意しているfind()メソッドを使うことができます。

今度はinstance( )を使ったコードを見てみます。

```tsx:human2.test.tsx
describe('<Human/>をテストするよ', () => {
  it('instance()を使ってみるよ', () => {
    const wrapper = shallow(<Human />);
    const instance = wrapper.instance()
    wrapper.find('div');    //　これはもちろんOK
    instance.find('div');   // find()はHumanクラスに無いのでエラーがでます。
    instance.handleClick(); // HumanクラスにhandleClick()があるので、これならオッケー
  });
});
```

と言うような感じになります。

まとめると
**「instance()を使って生成したReactComponentにはクラスに書いてあるメソッドしか使えないんだな〜」**
くらいに思っておけばいいと思います。


間違いがありましたら教えていただけると嬉しいです〜
TypeScriptを導入してCSSをimportできるようにする

# はじめに
これまでES6で書いてきたプロジェクトにTypeScriptを導入した際に、
cssがimportできなかったのでメモとして。

## TypeScriptでCSS Moduleを使用できるようにする
TypeScriptではCSSやSASSファイルをこれまで通り`import`するとエラーが出る。
そこで、CSSファイルごとに型の定義ファイルを作成することでimportできるようにする。

### 手順1: 型定義ファイルを作成する
作成したCSSファイルと同じ階層に`CSSファイルと同じ名前.css.d.ts`を作成する。
例）`style.css`を作成した場合、`style.css.d.ts`を作成する。

```
src
 ￤-- style.css
 ￤-- style.css.d.ts
```

### 手順2: 型を定義する
型定義ファイルにCSSに対応する型を記述する。
以下のようなCSSを記述したとする。

```style.css
.wrapper {
  border-left: 1px solid #eee;
}
.messages {
  padding: 15px;
}
```

その場合の型定義ファイルは以下のようになる。

```style.css.d.ts
export const wrapper: string
export const messages: string
```

### 手順3: TSファイルでimportする
CSSファイルをimportできるようになっているので、TSファイルimportする。

```ts
import * as styles from 'style'
```

### 手順4: 使用する
あとは`className`などで使用するだけ。

```ts
<div className={styles.wrapper}>
...
</div>
```

## おわりに
これでCSSは読み込めるようになった。
SASSだとまた違うようなので、どうしたらSASS（SCSS）を使えるようになるのか調べたい。
ちらっとドキュメントに書いてあったような。

間違いがありましたらコメントなどでご指摘ください。
こういう方法もあるよというコメントも大歓迎です。
atomic designのTemplatesはrender propsで書く

# はじめに
reactを用いたatomic designのTemplatesの実装に２通りあると思っている。

- データを引数で受け取る方式。pagesにデータとの依存解決をしてもらう。
- コンポーネントを引数で受け取る方式。pagesにorganismsとの依存解決をしてもらう。

本には前者で書いてあるようだけど、render propsを使うことでtemplatesの抽象度を上げることできる。

danが言っていた[「render propsを使えばバケツリレーを浅くできるよ」](https://twitter.com/dan_abramov/status/978236117970571264)の意味を知るわかりやすい例にもなると思うので書いてみる。

# データを引数で受ける方式
本にはこう書いてあるみたい

```jsx
const TweetsPage = ({ tweets, goBack }) => (
  <TweetsTemplate
    headerData={{
      title: 'tweets',
      onCLickLeftButton: () => goBack(),
    }}
    ListData={tweets}
  />
)
```
templateはデータを受け取る。
命名はわかり易さのためにPageとかOrganismsとかをsufixにしてます。
TweetsPageに対してTweetTemplateがある。
TemplatesはPageとほとんどが1対1で作っていくことになると思う。
Templateにデータを流し込むのがPageのしごと。

# コンポーネントを引数で受ける方式
個人的にはこうだと思ってた

```jsx
const TweetsPage = ({ tweets, goBack }) => (
  <MyTemplate
    headerTitle='tweets'
    headerLeftItem={() => (
      <MyButtonAtom
        icon='back'
        onClick={() => goBack()}
      />
    )}
    body={() => (
      <TweetsList tweets={tweets} />
    )}
  />
)
```
templateはコンポーネントを受け取る。
Templatesの抽象度は前者より高く、枠だけ決めていてコンテンツが何かはPagesが注入する。
なのでTemplatesはPageと1対1ではなく１アプリケーションに付き1~3個くらいにしかならないと思う。

「PageがTemplatesとOrganismsを知っている」って感じなので、Organismsに直接Paramsを渡せる。
これでdanが言っていた[「render propsを使えばバケツリレーを浅くできるよ」](https://twitter.com/dan_abramov/status/978236117970571264)を体感できると思う。

# きもち
reactはpropsを受けてjsxを返すだけのただ関数。`(Props) => JSX`
propsがデータだろうがコンポーネント(関数)だろうが大した差ではないけど、関数渡しても良いんだ、高階化してい良いんだってのを知ってるか知らないかで設計は変わる。ただの知識なので誰もが知ってて損ないと思う。
【react-navigation】2.5.5のヘッダー仕様

## 何が起きたか
react-navigationのヘッダーにImageを使用したくて以下のようにしていた

```jsx
navigationOptions: {
  title: (
      <Image source={xxx}/>
  ),
}
```

`2.5.5`に上げるとエラー

エラー内容

```
- title must be string or null, instead it was of type 
```

![image.png](https://qiita-image-store.s3.amazonaws.com/0/103475/3e56c1f9-52ec-89fe-9582-8e6b51136f51.png)


これは`２．５．４`以前の仕様では問題なく動作していました。

## 2.5.5になると
`title`オプションではstring以外受け付けないようになりました。開発モードではエラーになります。
該当コミット： [bc01a4c](https://github.com/react-navigation/react-navigation/commit/bc01a4cd5701fd6f73861c14a578131950061f28)
![image.png](https://qiita-image-store.s3.amazonaws.com/0/103475/3de9ca68-04ce-780c-2b72-3f2e4017de2b.png)


## どうするか
コミッターに聞いたところ、`headerTitle`オプションを代わりに使うようにとのコメントがありました。
`title`はあくまで文字列専用にして、それ以外は`headerTitle`で扱うような使い分けかもしれません。

```jsx
navigationOptions: {
  headerTitle: (
      <Image source={xxx}/>
  ),
}
```

備忘録として。
ターミナル　ショートカットコマンド

ターミナルをたまにいじったりするので、少しだけまとめておきました。

カーソル
-
ctrl+b = 後退

ctrl+ｆ = 前進

ctrl+a = 行頭へ

ctrl+e = 行末へ

Esc+b = 一語後退

Esc+f = 一語前進

画面をクリア・終了
-

ctrl + l =画面をクリア

ctrl+c = 実行中のコマンドを強制終了

ctrl + d = 終了
ReactNative最強の再起動のワンライナー

![alt](https://user-images.githubusercontent.com/26253721/39765058-e8d0eae4-531b-11e8-9305-4c852f269517.png)
仕事のできる同僚から聞いたreact nativeを再起動するときの最強のワンライナーを紹介する。

watchman watch-del-all && rm -rf node_modules && rm -rf /tmp/metro-bundler-cache-* && npm i

これにiosフォルダのbuildディレクトリを削除すれば完璧らしい。

またReact Nativeではsimulatorを　Erace all contentsすると、(キャッシュに関連した)原因不明のエラーが治ることがよくあるので試したい。
Gitで直近のコミットをコミット前に戻すにはgit reset @~

Gitで直近のコミットをなかったことにし、コミット前の状態に戻す方法です。

このようなコミットがある状況で:

```
* 40c620d 2018-07-05 suin commit 4
* ea300fa 2018-07-05 suin commit 3
* bd03840 2018-07-05 suin commit 2
* 76c4199 2018-07-05 suin commit 1
```

次のコマンドを実行すると:

```
git reset --soft @~
```

「commit 4」が消えてこうなります:

```
* ea300fa 2018-07-05 suin commit 3
* bd03840 2018-07-05 suin commit 2
* 76c4199 2018-07-05 suin commit 1
```

「commit 4」で加えられた変更はステージされた状態(`git add`された状態)になります。
C言語　九九の結果を表示するプログラム

#はじめに
C言語での九九の結果を表示するプログラムを作成してみました。

#ソースコード
```c
#include <stdio.h>
 
int main(void){
 
  /* カウンタ変数の宣言 */
  int a, b;
 
  /* 九九の計算 */
  for(a=1;a<10;++a) {
    for(b=1;b<10;++b) {
      if(b==9)
        printf("%3d\n", a*b);
      else
        printf("%3d", a*b);
    }
  }
 
  return 0;
}


```
#実行結果
```
  1  2  3  4  5  6  7  8  9
  2  4  6  8 10 12 14 16 18
  3  6  9 12 15 18 21 24 27
  4  8 12 16 20 24 28 32 36
  5 10 15 20 25 30 35 40 45
  6 12 18 24 30 36 42 48 54
  7 14 21 28 35 42 49 56 63
  8 16 24 32 40 48 56 64 72
  9 18 27 36 45 54 63 72 81
```
GoogleCloudDatastore（objectify利用）でkey検索するときのエラー

## 前提
Kotlin SpringBoot + GoogleCloudDatastore
いろいろ検索しても本当に情報がでてこないので、だれにも求められていない情報なのではと思いつつ。。
キー検索したときに出たエラーと対処法をメモする。

## エラーメッセージ
### 普通に検索してエラー

<< コード >>

```kotlin
        return ObjectifyService.ofy()
                .load()
                .type(HogeCloudDatastoreEntity::class.java)
                .filter("id = ", id))
                .first()
                .now()
                .toDomain()
```
<< エラー >>

```
java.lang.IllegalArgumentException: @Id fields cannot be filtered on. Perhaps you wish to use filterKey() instead?
```

### filterKeyを使ってエラー

<< コード >>

```kotlin
        return ObjectifyService.ofy()
                .load()
                .type(HogeCloudDatastoreEntity::class.java)
                .filterKey(id)
                .first()
                .now()
                .toDomain()
```
<< エラー >>

```
com.google.appengine.repackaged.com.google.datastore.v1.client.DatastoreException: __key__ filter value must be a Key
```

### 正解

```kotlin
        return ObjectifyService.ofy()
                .load()
                .type(HogeCloudDatastoreEntity::class.java)
                .filterKey(Key.create(HogeCloudDatastoreEntity::class.java, id)
                .first()
                .now()
                .toDomain()
```