OmniAICreator/Qiita-1.07M huggingface dataset:
AWS Lambda(Node.js)でkintoneからレコード取得~kintone-nodejs-sdkを使ってみた~

# はじめに

kintoneのカスタマイズやプラグインでは`kintone.api`という便利なものがありますが、AWSとkintoneで連携するときの一つの手段として、`kintone-nodejs-sdk`というモジュールを用いてkintoneアプリからレコードを取得する操作のメモを残しておきます。

# 準備

- AWS Lambda関数
- Node.jsインストール済みのPC
- kintoneアカウント、てきとうなアプリ

# 参考にしたもの

ドキュメント
https://kintone.github.io/kintone-nodejs-sdk/

ソース
https://github.com/kintone/kintone-nodejs-sdk


# 手順

大まかな手順は以下の通りです：

1. kintoneアプリの設定画面でAPIトークンを発行
2. npm install kintone-nodejs-sdk
3. Lambda関数の中身(index.js)作成

それでは、具体的に見ていこうと思います。

## 1. kintoneアプリの設定画面でAPIトークンを発行

まずはkintoneアプリの設定画面に移り、APIトークンを発行します。
**「アプリ一覧画面の歯車記号⇒設定⇒APIトークン」**と進んでいってください。

この後の詳細は[こちら](https://developer.cybozu.io/hc/ja/articles/202463840-API%E3%83%88%E3%83%BC%E3%82%AF%E3%83%B3%E3%82%92%E4%BD%BF%E3%81%A3%E3%81%A6%E3%81%BF%E3%82%88%E3%81%86)のページをご覧ください。APIトークンのつくり方と、そのメリットについても書かれています。

# npm install kintone-nodejs-sdk

ここからはお手持ちのPCのターミナル(コマンドライン)を用いて作業をしていきます。

念のため、npmのバージョンを確認しておくといいかもしれません：

```txt
$ npm -v
```

アップグレードが必要な方は以下のコマンドを実行してみてください。

```txt
$ npm install -g npm
```

それではいよいよ本番です。
作業ディレクトリに移り、以下のコマンドを実行してください：

```txt
$ npm init -y
$ npm install --save kintone-nodejs-sdk
```

すると、作業ディレクトリ内に**node_modules**というディレクトリが作られるはずです。

# Lambda関数の中身(index.js)作成

最後に、Lambda関数の中身を作成しましょう。作業ディレクトリにindex.jsというファイルを作り、その中にコードを書いていきます。

今回は特に難しいことは考えず、シンプルに複数のレコードを取得します。ソースは以下です：

```javascript:index.js
'use strict';

const kintone = require('kintone-nodejs-sdk');

//APIトークンを用いて認証
const kintoneAuth = new kintone.Auth();
const apiTokenString = 'xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx';
kintoneAuth.setApiToken(apiTokenString);

//接続
const myDomainName = 'xxxxx.cybozu.com';
const kintoneConnection = new kintone.Connection(myDomainName, kintoneAuth);

//レコード操作のためのオブジェクト
const kintoneRecord = new kintone.Record(kintoneConnection);

//取得先のアプリID
const appId = 1;

exports.handler = (event, context, callback) => {
    kintoneRecord.getRecords(appId)
    .then((rsp) => {
        console.log(rsp);
        callback(null, resp);
    })
    .catch((err) => {
        // This SDK return err with KintoneAPIExeption
        console.log(err.get());
        callback(err);
    });
};
```

# まとめ

わりと最近出たものっぽいですね。たまたま見つけたのでサクッと簡単なコードを書いてみました。なかなか便利そうな気がします。
dts-bundleで、型定義ファイルを1ファイルにする

# 概要
できると便利そうだと思って試してみたけど、
時間が足りず、1ファイルにしなくてもいいことにしました。
中途半端ですがメモとして残します。

# 背景など
社内向けに、ブラウザで動作するライブラリをTypeScriptで書いています。
(npmで公開するには汎用的じゃなさすぎるやつです)
このライブラリは、外部モジュールとして&lt;script&gt;で読みこませる形式を想定した作りにしています。
また、ライブラリを使う側でもTypeScriptを使いたいので、tscの「declaration」オプションで型定義ファイルを出力しています。

ライブラリのビルド成果物としては、minifyされたjsファイル(+map)ファイルを一つと、
型定義ファイル(d.ts)を1つのtsファイルごとに出力させていたのですが、
一つにまとまっているとライブラリを使う側がシンプルになるかと思ったので、
試してみました。

# 検証バージョン
webpack: 4.9.1
awesome-typescript-loader: 5.0.0
dts-bundle: 0.7.3

# コード
## tsconfig.json
(webpackでもオプションつけるので要らないものもありそうだけど、検証時のもの)

~~~ .json
{
    "compilerOptions": {
        "module": "commonjs",
        "target": "ES6",
        "outDir": "./output",
        "declaration": true,
        "sourceMap": true,
    },
    "exclude": [
      "node_modules",
      "output"
    ],
}
~~~

## webpack.config.js
(DtsBundlePluginを使って設定します)

~~~ .js
const path = require('path');
const webpack = require('webpack');
var rootDir = path.resolve(__dirname);

// dts-bundleの設定
function DtsBundlePlugin() {}
DtsBundlePlugin.prototype.apply = function(compiler) {
  compiler.plugin('done', function() {
    var dts = require('dts-bundle');

    dts.bundle({
      // ライブラリ名
      name: 'testtest',

      // 入力ファイル名(declarationで出力されるファイルを全て指定)
      main: rootDir + '/output/**/*.d.ts',

      // 出力ファイル名
      out: rootDir + '/output/index.d.ts',

      removeSource: true,
      outputAsModuleFolder: true
    });
  });
};

module.exports = {
  entry: './src/testtest.ts',
  output: {
    filename: 'testtest.min.js',
    path: path.join(__dirname, './output/'),
    library: 'testtest',
    libraryTarget: 'umd',
  },
  module: {
    rules: [{
      test: /\.tsx?$/,
      loader: 'awesome-typescript-loader',
      exclude: /node_modules/,
      query: {
        // tsコンパイル時に、型定義ファイルを出力する
        declaration: true,
      }
    }]
  },
  devtool: 'source-map',
  resolve: {
    extensions: [".tsx", ".ts", ".js"],
    modules: [
      "node_modules",
    ],
  },
  plugins: [
    new DtsBundlePlugin(),
  ],
  cache: true,
};
~~~

# 結果
webpackを実行すると、./oupputの中にindex.d.tsができて、複数ファイルのclass定義が1ファイルにまとまったのが確認できました。基本的には問題なさそうに見えました。

しかし、成功したのは3つほどのtsファイルで作ったHelloWorld的なプロジェクトで、実際に使っているライブラリにも組み込んでみると、できあがるindex.d.tsが空ファイルになってしまいました。

少し試行錯誤しましたが、無理して1ファイルにしなくてもいいかなと思い直し、今回はdts-bundleは使わないことにしました。活用できればライブラリを使う側の管理が楽になりそうなので、時間があればオプションなど見直したいところです。

# 参考
- [TypeStrong/dts-bundle: Export TypeScript .d.ts files as an external module definition](https://github.com/TypeStrong/dts-bundle)

- [How to merge d.ts typings with dts-bundle and Webpack](https://medium.com/@vladimirtolstikov/how-to-merge-d-ts-typings-with-dts-bundle-and-webpack-e8903d699576)
cloudn APIをサーバから実行させる

## 手順①cloudmonkeyの実行環境を用意
参考：https://www.cloudn-service.com/guide/manuals/html/flat-api/rsts/APIInfo/api_client.html#how-to-api-client

### インストール
```
# yum -y install python python-setuptools
# easy_install cloudmonkey
```

### keyのセット
```
$ cloudmonkey
(これ以降はshellではなくcloudmonkey内でのコマンド実行)
> set url https://comp-api.jp-e1.cloudn-service.com/client/api
> set apikey ## APIアクセスキーIDを入力する
> set secretkey ## API秘密鍵を入力する
> exit
```

### 実行
```
#cloudmonkey
> list virtualmachines
```

で正常に仮想マシンの一覧を取得できることを確認


## 手順②シェルファイル作成

/path/test.sh

```
#!/bin/bash
cli=cloudmonkey
id=【仮想サーバのID】

echo "サーバの状態確認"

state=`$cli listVirtualMachines id=$id | grep ^state\ = | awk '{print $3}'`
echo "state" $state

if [ "$state" = "Running" ]; then
  echo "状態は正常です。"
else
　echo "サーバ起動実行"
  start=`$cli startVirtualMachine id=$id`
fi

echo "完了しました。"

```

一度コンソールでサーバを停止させてから実行し、サーバが起動することを確認。

叩くAPIはこの辺を参照
https://www.cloudn-service.com/guide/manuals/html/flat-api/rsts/ComputeStyle/index.html
React Nativeでグラデーション

# React Nativeでグラデーション？

React Nativeでは純正のStyleSheetモジュールでほとんどのCSSの振る舞いをサポートしていますが、グラデーションだけは再現することができません。

そこで、react-native-linear-gradientというパッケージを使用して、グラデーションを再現します。

# インストール

```
yarn add react-native-linear-gradient
react-native link
```

注）linkした後によくあるiOSネイティブコードのエラーは以下で解消できます。

```
rm -rf ios/build && run-ios
```

# サンプルコード

```
import LinearGradient from 'react-native-linear-gradient';

<LinearGradient 
  colors={['rgba(249,190,107,1)', 'rgba(255,119,191,1)']} 
  start={{x: 0.0, y: 1}} 
  end={{x: 1, y: 1}}>
  <Text style={{width: '100%', textAlign: 'center', padding: 10, color: '#fff'}}>グラデーション</Text>
</LinearGradient>
```

<img width="370" alt="スクリーンショット 2018-05-30 0.01.06.png" src="https://qiita-image-store.s3.amazonaws.com/0/114895/c36ede48-28cc-1b57-4ff2-8aa619d0a071.png">

LinearGradientはViewを継承しています。なので、デフォルトのスタイルはViewと同じです。


# 各種propsの解説

## colors props
例： colors={['#4c669f', '#3b5998', '#192f6a']}
配列で指定します。**色**を設定できます。

## start/end props
オブジェクトで指定します。**グラデーションの開始位置と終了位置**を指定できます。
xとyは1.0=100%です。

## locations
colorsがそれぞれどのくらいの割合を占めるか、を設定できます。
例えば[0.1, 0.75, 1]の場合、一色目が0~10%、二色目が10%~75%、三色目が75%~100%という割合でグラデーションが描画されます。

# まとめ
意外と使い方がわかりにくかったので書きました。もしお役に立てれば幸いです。
[Electron] 環境構築、サンプルアプリの実行、パッケージ作成

# Electronとは？

[Electron](https://electronjs.org/)とは、GitHubが開発したChromiumとNode.jsを使ったHTML, CSS, JavaScriptでWindows, macOS, Linux向けのクロスプラットフォームデスクトップアプリ開発するフレームワーク。

# 準備
## Node.jsのインストール

1. [Node.js](https://nodejs.org/ja/)からインストーラーをダウンロードする。
2. インストーラーを実行してNode.jsとnpmをインストールする。
3. PATHが通ってなければ、PATHを通す。

```bash
$ echo 'export PATH="/usr/local/bin:$PATH"' >> ~/.bash_profile
$ source ~/.bash_profile
```

# サンプルアプリのビルドと実行
[Electron Quick Start](https://github.com/electron/electron-quick-start), [Electron API Demos app](https://github.com/electron/electron-api-demos)などのサンプルアプリを動かすまでの手順です。

## Electron Quick Start (Hello World)

Hello World!を表示するだけのサンプルアプリ

```bash
$ git clone https://github.com/electron/electron-quick-start
$ cd electron-quick-start
$ npm install
$ npm start
```
![ScreenShot_electron-quick-start.png](https://qiita-image-store.s3.amazonaws.com/0/168061/56b65929-c63f-604f-afcf-a5325e58463c.png)


# アプリケーションパッケージ作成

## Electron Packagerのインストール
アプリをパッケージ化する(Windowsであれば`*.exe`, macOSであれば`*.app`にする)には[Electron Packager](https://www.npmjs.com/package/electron-packager)をインストールする。

```bash
$ sudo npm -g install electron-packager

/usr/local/bin/electron-packager -> /usr/local/lib/node_modules/electron-packager/cli.js
+ electron-packager@11.1.0
added 229 packages in 14.021s
```

# パッケージ作成

Electron Packagerのコマンドは以下の通り。

```bash
$ electron-packager <sourcedir> <appname> --platform=<platform> --arch=<arch> [optional flags...]
```

|パラメータ名|値|
|---|---|
|platform|all, darwin, linux, mas, win32|
|arch|all, ia32, x64, armv7l, arm64, mips64el|

macOSの64bitで作成するのであれば、以下を実行する。

```bash
$ electron-packager ./ SampleApp --pratform=darwin --arch=x64
```
try-catchでパイプを使う

```php
try
{
    // throw(new \Exception('exception'));
    // throw(new \Error('error'));
}
catch (\Throwable $error)
{
    var_dump($error->getMessage());
}
```

で事足りるが、ExceptionとErrorだけに絞りたい場合にはパイプが使える

```php
try
{
    // throw(new \Exception('exception'));
    // throw(new \Error('error'));
}
catch (\Exception | \Error $error)
{
    var_dump($error->getMessage());
}
```
BitbucketのPipelinesを試してみる

今まで一部案件で、Jenkinsを使って```git push```していたが、そもそもBitbucketでソース管理をしていたので、せっかくなのでPipelineを使って、プルリクがマージされたタイミングと、masterブランチが更新されたタイミングで、サーバーに```git push```でデプロイする仕組みを構築する。

## bitbucket-pipelines.ymlの作成

1. デプロイしたいレポジトリの左メニューから、[pipelines]を選択する
1. 環境にあったテンプレートが選択できるので、テンプレートを選択し、[Commit file]ボタンを押下する

bitbucket-pipelines.ymlのファイルがおそらくディフォルトで設定しているブランチに作成される。

## bitbucket-pipelines.ymlの中身

テンプレートで作成すると、imageが設定されているが、DockerHubにあるものは使えるらしい。

```yml
pipelines:
    branches:
      develop:
        - step:
            deployment: staging
            script:
              - git remote add dev ssh://$STAGING_SSH_USER@$STAGING_SSH_SERVER:$STAGING_SSH_PORT/$STAGING_SOURCE_DIR
              - git push dev develop
      master:
        - step:
            deployment: production
            script:
              - git remote add prod ssh://$PROD_SSH_USER@$PROD_SSH_SERVER:$PROD_SSH_PORT/$PROD_SOURCE_DIR
              - git push prod master
```

pipelinesのbranchesで、対象のブランチがBitbucketにpushされたタイミングで、step内のscriptが実行される仕組みなる。
deploymentのキーに```test```,```staging```,```production```のいずれかを設定しておくと、左メニューのDeploymentsのページに、実行状況が表示される。

## 環境変数の設定

bitbucket-pipelines.ymlの中で使われている、$で始まるものは、レポジトリの[設定]-[PIPELINES]-[Environment variables]で環境変数を設定することにより、使えるようになる。
案件が複数ある場合など、bitbucket-pipelines.ymlは同じものを使い、環境変数で各案件にあったSSHの接続情報などを設定するなどの使い方ができる。

## SSH Keyの設定

sshで接続するためのSSH Keyはレポジトリの[設定]-[PIPELINES]-[SSH keys]から設定する。Keyを作成するか、すでに作成済みのKeyを登録する。

## 無料枠について

pipelinesは無料プランであれば、ビルド時間が月50分まで、スタンダードプランだと、月500分まで無料。

まだ、色々試しているので、何かあれば追記していこうと思う。

***

参考サイト

* [bitbucket-pipelines.yml を設定する](https://ja.confluence.atlassian.com/bitbucket/configure-bitbucket-pipelines-yml-792298910.html)
Laravelでスケジュールの出力をログに残す

Laravelの[タスクスケジュール機能](https://readouble.com/laravel/5.5/ja/scheduling.html)で予期しないエラー等の出力をログに残す方法

新規

```
$schedule->command('command:batch')->dailyAt($time)->sendOutputTo($schedule_log_path);
``` 

追記

```
$schedule->command('command:batch')->dailyAt($time)->appendOutputTo($schedule_log_path);
```


[task-output](https://laravel.com/docs/5.5/scheduling#task-output)
定額でオライリー社の本が読み放題！Safari Books Onlineを試してみた。日本語版も読めます！


2021/3/14(日)追記：
10000 views突破感謝です:bouquet:
日本語版も見れるようになっていたので、設定手順を追記しました。

# ご挨拶
初投稿です。Qiitaの皆様の記事は参考にさせて貰ってます。
今回は、自分が学習する際に便利だなーと思った「[SafariBooksOnline](https://www.safaribooksonline.com/)」について紹介します。

# 本記事のターゲット
こんな方に読んで頂けると参考になると思います。

・技術書で学習する人
・色んな技術書読みたいけど、買うお金ありませんという人
・最新の技術書読みたいけど、日本語版が出てなくて困ってる人
・技術書記載のコマンドや設定ファイルパラメータを、手で転記して使用するのに苦労している人

# SafariBooksOnlineとは
定額でオライリー社を始めとする電子書籍が読み放題のサービスです。
電子書籍以外もトレーニング用動画やカンファレンス動画が見れます。

<del>ちなみに、全部英語です。でも安心して下さい。Chrome先生の日本語翻訳が使えます。Goodです。</del>
[アプリ](https://www.safaribooksonline.com/apps/)もあり、外出先でも読めちゃいます。

**<font color="Red">特に凄いのが、なんと発売前の書籍が読めちゃいます！</font>**

# 気になる料金
定額制で月額／年額から選択可能です。年額がお得ですね。
ちなみに1週間トライアルで無料で使用出来ます。

| 料金体系 | 料金 |
|:-:|:-:|
| 月額  | $39  |
| 年額  | $399  |

# 日本語版が見れるようになっていた
しばらく見ない内に日本語版の書籍が参照出来るようになってました！
以下、設定変更で見れるようになります。

1. 「Settings」をクリック。
![1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/254711/97ecd44e-351a-eb34-bc4a-20abacf38ace.png)

2. 「Japanese」をチェック。
![2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/254711/0df6a606-7b2f-518a-7602-ea2809e2b30f.png)

3. 「Update Preferences」をクリック。
![3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/254711/27b1b8f4-23c0-c59e-b55c-2728cd05c971.png)

4. 検索してみる。日本語検索も対応しているようです。
![4.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/254711/86eb47a8-5d0b-9cc1-549c-39f935895f6b.png)

# 感想
以下、試してみた感想です。

・書籍数が凄い！1ヶ月で登録してみたけど全然時間が足りないです。
・最新の技術書もあり、情報量が多いです。定額でこれだけ読めちゃうのはお得でしょう。
　なかなかマニアック？な本もあったりします。
・本文がコピペ出来ちゃいます。コマンド入力も楽々ですね。（自己責任でご使用下さい。）
・アプリも便利！アプリだと翻訳機能は使用出来ないので、ブラウザで見るのが良いかもですね。
・トレーニング用動画やカンファレンス動画はまだ見れてない。

# おわりに
かなり昔からあるサービスみたいですので、今更感あるかもしれませんが。。
まだ試したことがない方は是非、トライアルから試してみて下さい。

[SafariBooksOnline](https://www.safaribooksonline.com/)
非負値行列因子分解(NMF)を使ったレコメンドの雰囲気を感じてみる

NMF(Non-negative Matrix Factorization)を使用したレコメンドをなんとなくわかった気になったので書き留めてみる。

ユーザ毎のアイテムに対する評価を持っている状況でのレコメンドを考える。

使用するデータは以下。
各アイテムに対する各ユーザの評価値(1-5)を持っている。
0は未評価の項目。

```python
df
```
![nmf_df_before.jpg](https://qiita-image-store.s3.amazonaws.com/0/196110/8511b70c-d97a-6022-462a-3d2ea5f32827.jpeg)

NMFを使って未評価の部分を補完した行列を作る。

ただし、通常のNMFはscikit-learnにも実装されているが、欠損値を含む場合には対応していないらしい。
https://github.com/scikit-learn/scikit-learn/issues/8447

欠損値を含むNMFについては[こちら](https://qiita.com/fujiisoup/items/add21d9c7c307e6b9318)が詳しかった。

```python
def update(Y, W, H, M):
    W = W * np.dot(Y * M, H.T) / np.dot(np.dot(W, H) * M, H.T)
    H = H * np.dot(W.T, Y * M) / np.dot(W.T, np.dot(W, H) * M)
    return W, H
```

この更新式を適当な回数繰り返し、低次元の$W$, $H$によって$M$に近似させる。

```python
k = 5
M = df.values
n, m = M.shape
W = np.random.rand(n, k)
H = np.random.rand(k, m)
mask_M = (M > 0)

# W,Hの更新を適当な回数繰り返す
# W @ H が徐々に M に近づいていく
for _ in range(100):
    W, H = update(M, W, H, mask_M)

pd.DataFrame(W @ H, index=users, columns=items)
```
![nmf_df_after.jpg](https://qiita-image-store.s3.amazonaws.com/0/196110/9e6da7f7-77ca-ed9d-4b28-190017cc0e10.jpeg)

評価のあった項目は元の値に近くなっており、未評価の項目にも値が入っている。
例えばuser_0は未評価のアイテムのうち最も評価値の高いitem_8をレコメンドしよう、となる。
herokuでCredentialsとActive Storageを使う

Rails5.2のActive StorageとCredentials便利ですね！
 (Encrypted secretsとは一体なんだったのか…)

これらの新機能ですけど、
development環境では[ドキュメント](https://railsguides.jp/active_storage_overview.html)や先人の記事などみて
「なるなる💡（←全然わかってない）」
という感じでサクッと使うことが出来たのですが、当然理解度は低いのでherokuにdeployする際にハマってしまっていたのでメモ。

## はまりポイント
 - Active Storageは、 __herokuの[ruby用buildpack](https://elements.heroku.com/buildpacks/heroku/heroku-buildpack-ruby)に含まれていない！__ 😢
 - Credentialsでbuildされた、 `config/master.key` はどうやってherokuに反映させるのか悩む… 🔑➰

## 解決方法 
Active Storageのbuildpackは、[herokuでは別途用意されています](https://devcenter.heroku.com/articles/active-storage-on-heroku#attachment-previews)のでそれを利用。

```
$ heroku buildpacks:add -i 1 https://github.com/heroku/heroku-buildpack-activestorage-preview
```

またherokuでmaster.keyを直接置くのはまずいので、値はheroku環境のENVに設定しておきます。こちら設定することで、credentials.yml.encを読み込めるようになります。

```
$ heroku config:set RAILS_MASTER_KEY=<master-key-value>
```
Twitterログインでサンプルと同じはずなのにエラー発生〜解決まで

#はじめに
spring-social-twitterでTwitterログインを実装していて、サンプル紹介してくれている[ブログ](https://geowarin.github.io/social-login-with-spring/
)があったので、真似して作っているところで詰まりました。

そもそもspring-social-twitter　＋ Spring Boot ログインの例が全然見つからず、
このサンプルに行き着くまでも何個か試してうまく行かなかったので、サンプルがおかしいのではないかと思っていたのですが
数時間の格闘の末、解決できたのでその過程を書きます。
#エラーとの格闘

<img width="950" alt="スクリーンショット 2018-05-29 0.56.27.png" src="https://qiita-image-store.s3.amazonaws.com/0/162167/42eb40ee-7c05-65c3-f9c8-3a6285d0c91d.png">

スクリーンショットで赤くなっている、`ProviderSignInUtils`でエラーが発生しています。
エラーメッセージは、
*[Java] The constructor ProviderSignInUtils(ConnectionFactoryLocator, UsersConnectionRepository) is undefined* 

と出力されていてどうやら定義されていないらしい。import間違って正しいライブラリー参照できてないのか？とか、
そもそも、そんなコンストラクター定義されていないんじゃないのか？など調べました。


サンプルと見比べてどうやらimportは正しい、[リファレンス](https://docs.spring.io/autorepo/docs/spring-social/1.1.4.RELEASE/apidocs/org/springframework/social/connect/web/ProviderSignInUtils.html)にも同じコンストラクターは定義されている。

| Constructor and Description |
|:--|
| ProviderSignInUtils(ConnectionFactoryLocator connectionFactoryLocator, UsersConnectionRepository connectionRepository)  |

あるものが使えない！意味がわからない。。。。。　エディターが悪いのか！と思いEclipseで試したり。
色々足掻いている中で、コンストラクターで右クリックすると定義元にいけることに気づき、みてみると・・・

#エラーの原因
<img width="1379" alt="スクリーンショット 2018-05-29 1.07.22.png" src="https://qiita-image-store.s3.amazonaws.com/0/162167/528941d5-a568-3d4b-bab0-862b75760e1d.png">

`ProviderSignInUtils`の参照元が若干違う！ 
エラーが発生している参照元が画面左です。たしかに定義されていないので、エディターは間違ってなかったですね。（そうだと思っていましたが・・・）
バージョンを見てみるとサンプルは2014、自分が実装しているのは2015年のを使っているようでした。

spring-social-twitterはMavenで定義していて、リリース1.1.2を使用しています。

`<dependency> 
       <groupId>org.springframework.social</groupId>
            <artifactId>spring-social-twitter</artifactId>
            <version>1.1.2.RELEASE</version>
</dependency>`

サンプルgradleを使用しているようで以下のようになっています。
gradleってリリース書かないんですね。バージョンわかりません。

`dependencies {
	compile('org.springframework.boot:spring-boot-starter-social-twitter')	
}`

とりあえず最新版にしようと思うのですが、
[spring-social-twitterの公式ページ](http://projects.spring.io/spring-social-twitter/
)を見ても記載が見つからないし、
よく使う[MVNRepository](https://mvnrepository.com/artifact/org.springframework.social/spring-social-twitter)というサイトでも1.1.2が最新版で見つからずあと一歩のところですが、
2時になり平日としては明日のことを考えるとそろそろ限界なので中断しました。

ちなみに、spring-social-twitterの公式ページには1.1.0が最新版と記載があります。
どういうこった！
<img width="356" alt="スクリーンショット 2018-05-29 22.49.48.png" src="https://qiita-image-store.s3.amazonaws.com/0/162167/09d61b40-ce71-367f-730a-aa176b13df33.png">


#問題解消！

翌日、仕事終わりにダメ元で調べてみると、なんと一発で最新リリースの記載があるサイトに辿りつけました！ [MVNRepository](https://mvnrepository.com/artifact/org.springframework.boot/spring-boot-starter-social-twitter/1.5.13.RELEASEr)で前日と同じサイトなのですが、
”spring social twitter maven”　というクエリで検索すると古いバージョンの記載しかないページが検索結果として表示されるのですが、 
"spring boot social twitter maven"と　boot というキーワードをいれることにより、最新のページが検索結果として表示されるようになりました！

Google検索を信用しきっていたので、まさか前者で表示されないサイトが後者で表示されるとは・・・
検索能力がものをいう時代とはこういうことですね。


#まとめ
問題は寝るとなおる！すっきり！！
Qualcomm Atheros の Mini PCI-e WiFiモジュールをESXiでパススルーする

GPUをESXiでパススルーするおはなしはいっぱいあるんだけど、それ以外のPCIデバイスをパススルーする情報って少ないですね。

Qualcomm Atheros のWiFiモジュールをESXiでパススルーする設定。

といっても、1行足すだけ。

```sh:/etc/vmware/passthru.map

  :

# Atheros Wireless
168c 0034 d3d0 false
```

1. ハードウェアのベンダーIDとデバイスIDを確認する
2. ESXi の SSH を有効にしてログインする
3. /etc/vmware/passthru.map を開いて編集する
4. ホストを再起動

passthru.map の行の意味は下記の通り

* 1列目:  
  ベンダーID
* 2列目:  
  デバイスID
* 3列目:  
  Reset Method ( flr, d3d0, link, bridge, default )  
  デバイスをリセットする手法 (よくわからないから[VMWareの解説](https://www.vmware.com/content/dam/digitalmarketing/vmware/en/pdf/techpaper/vsp-4-vmdirectpath-host-technical-note.pdf)を見てくれ!)
* 4列目:  
  Full Passthrough Shareable ( true, false )  
  PCI デバイスをシェアできるか

今回は QCA9565 (AR9565チップセット)を使用しましたが、 Atheros 系は同様にこれでイケるんじゃないかと思う。

他のPCIデバイスでも、仮想マシンがうまく起動できないときは、 Reset Method と fptShareable を組み合わせて試してみれば起動するかもしれないね。

-----

参考ページ

* [virtualization - Troubleshooting ESXi hardware freeze with PCI Passthrough - Server Fault](https://serverfault.com/questions/380478/troubleshooting-esxi-hardware-freeze-with-pci-passthrough)
【Java】シングルトン・クラス（Singleton Class）について

こんにちは^^
都内のIT企業で働いているグエンです。
初めての投稿なんですので、少しドキドキですね。^^
Java SE8 Goldを勉強するにあたって、覚えなければならいものをここでメモします。
早速ですが、シングルトン・クラスについてメモをしたいと思います。
### シングルトンとは
**シングルトン**とは、あるクラスのインスタンスが２つ以上生成されないことを保証するデザイン・パターンの１つです。

ですので、シングルトンは一般に以下に挙げるような指針に従って実装します。
1. private staticフィールドを宣言し、自身の単一のインスタンスを生成して、そのフィールドにセットしする。
⇒動機：インスタンスを１つだけ生成し、常にその１つのインスタンスのみを参照するようにする。
2. コンストラクタをprivateで宣言する。
⇒動機：外部からインスタンスを生成できないようにする（クラス内部でのみインスタンス生成可能）
3. 自身のフィールドにセットされているインスタンスを返すpublic staticメソッドを提供する。
⇒動機：外部からこのクラスのインスタンス参照を取得できるようにする。

### シングルトン・クラスの実装例：
```java:Foo.java
public class Foo {
    private static final Foo foo = new Foo();
    private Foo();
    public static Foo getInstance() {
        return foo;
    }
}
```

### 外部からシングルトン・クラスのインスタンスを取得する。
```java
Foo foo = Foo.getInstance();
```

### 最後に
皆さん、いかがでしょうか？
少しでもシングルトン・クラスについて理解していただければ嬉しいです。^^
では、また次回の投稿で会いましょう！
バイバイ！
000webhostのロゴを消す方法　in wordpress

#000webhostのロゴを消しましょう
独自ドメインを使ってカスタマイズすると広告が出ます。
その消し方はテーマの編集へいきヘッダーへスタイルを編集しましょう。
こちらのリンクが参考になります。
コード
https://gist.github.com/Richienb/92ed3443519f782cbc73143b190b238b

```
img[src*="https://cloud.githubusercontent.com/assets/23024110/20663010/9968df22-b55e-11e6-941d-edbc894c2b78.png"] {
    display: none;}
```
このソースの部分は、ご自身のホームページに表示されているものを使いますので、クロームとかで開いて、右クリック、画像のアドレスをコピーして、貼り付けで良いでしょう。

貼り付ける場所はこちらになります。
cssファイルを外観もところから選んで、挿入しましょう。

000webhostを使いこなして、無料で快適なウェブライフを
プログラム言語 Rust のインストール、セットアップ

少しずつ書いていく。
べつに http://seiga.nicovideo.jp/watch/mg296197?track=ct_episode にも書いたんだが
執筆者は同じなのでパクツイではない。

|       |             |
|-------|-------------|
|使用言語|日本語        |
|OS     |Windows      |
|環境    |コマンドプロンプト|

#インストール

次のWebサイトから……。
https://www.rust-lang.org/ja-JP/install.html

![Gazo](http://warabenture.com/grayscale/img/blog/201805rust/20180529rust1a1.png)

rustup-init.exe をクリックするとダウンロードが始まる。

rustup-init.exe をダウンロードしたら、ファイルをダブルクリックする。

![Gazo](http://warabenture.com/grayscale/img/blog/201805rust/20180529rust2a1.png)

コマンドプロンプトが出てくるので、キーボードの [1]キーを打鍵して、[Enter]キーも打鍵する。

# 書くのがめんどくさくなってきた。

- rustc
- rustdoc

はあんまり使わず、

- cargo new --bin
- cargo build
- cargo run
- cargo doc

をよく使う。　じゃあ　rustc とか rustdoc とか何のために使うのかと言うと
ファイルを１個しか作らないようなプログラムのときに使う。cargo を調べた方がまし。
TravisCIでPythonのテスト時、SyntaxErrorが発生する問題

# 概要
python3.6でTravisCIを使用して、テストを実行した時に謎のSyntaxErrorが発生した問題について説明します。

# SyntaxErrorの発生
ローカルの環境で`python3.6`の`unittest`を使用してテストコードを書いていました。
もちろんローカルでもテストを定期的に実行していました。
実行方法と実行結果は以下です。

```python
python -Wall -m unittest discover -s aetam/tests

.....
----------------------------------------------------------------------
Ran 5 tests in 0.026s

OK
```

何も問題はありません。
私の思惑通りです。
ある程度区切りがついたので、コードをGitHubにPUSH！！
そうです。何も問題はなく、テストが無事通ると思っていました。
その時、まさかあんなことになるとは予想もしていませんでした。

pushしたし、次の作業に移ろうとGitHubを漁っていた時でした。
TravisCIからまさかの`Errored`のメッセージが届きました......！
まさかと思い、TravisCIの管理画面を開きエラーの原因を探しました......。
エラーの記述がありました。以下です。

```python
SyntaxError: Non-ASCII character '\xe9' in file views/login.py on line 37, but no encoding declared; see http://www.python.org/peps/pep-0263.html for details
```
ASCIIじゃない!!??
そりゃそうですよ！
UTF8ですからね！！
(最近はコメントにもあまり日本語を使わないようにはしてたりするんですが、プロジェクトによって日本語を使ったり、難しくて英語では説明しきれない時など限定的に使用することがあります。日本語を使うなという指摘は受け付けません!)

ここで一つ嫌な予感がしました。
まさか......、古のマジックコードを書かなければいけないとか......？

```python
1: # -*- coding: utf-8 -*-
```

エラーが出たファイルの1行目に、マジックコード追加してもう一度pushして見ました。
と、通ってしまいました......。
`Python2系`との互換性のためだったりするのでしょうか？

# 結論
現状判明している解決方法は3つあります。
1. マジックコードで文字コードを明示的に指定する。
2. 英語以外書かない
3. 別のサービスを使用する

プロジェクトで導入するにあたり簡単な選択は1番です。
ですが私はマジックコードなど書きたくなかったので、すぐにコメントを英語に書き換えました。
なぜなら最近のスタンダードなコーディングルール的にはコーディングルールは書かないのが基本だからです。

どうにかならないものでしょうか......?
【golang】dbrでTime型使用時にjstを使いたい

##はじめに
はじめまして、[@choujuku](https://twitter.com/choujuku)です。

食品工場向けSaaS [KAMINASHI](https://kaminashi.jp)ではサーバーサイドをgolangで書いており、データベース関連のライブラリとして[dbr](https://github.com/gocraft/dbr
)を使っています。

dbrでjstを使うとき、特にDBにTime型の値をインサートするときの情報がググってもパッと出てこなかったので備忘録として記載します。


##dbrで値を変換している箇所
dbr内の[dialect/mysql.go](https://github.com/gocraft/dbr/blob/6bc6e0062fb6efaa39981c5b8895b7925c263422/dialect/mysql.go
)でencodeしています。
以下のコードがgolangのTime型を変換している箇所です。
```
func (d mysql) EncodeTime(t time.Time) string {
　　　　return `'` + t.UTC().Format(timeFormat) + `'`
}
```
見事にUTCで変換しています。ここをJSTで変換するようにどうにかしたいわけです。
##対応
今回はこんな感じで独自のstructを定義して対応しました。

```db.go
func open(driver, dsn string, log dbr.EventReceiver) (*dbr.Connection, error) {
	if log == nil {
		log = &dbr.NullEventReceiver{}
	}

	conn, err := sql.Open(driver, dsn)
	if err != nil {
		return nil, err
	}
	d := mysqlExample{}

	return &dbr.Connection{DB: conn, EventReceiver: log, Dialect: d}, nil
}

type mysqlExample struct{}

func (d mysqlExample) QuoteIdent(s string) string {
	return quoteIdent(s, "`")
}

func (d mysqlExample) EncodeString(s string) string {
	buf := new(bytes.Buffer)

	buf.WriteRune('\'')
	// https://dev.mysql.com/doc/refman/5.7/en/string-literals.html
	for i := 0; i < len(s); i++ {
		switch s[i] {
		case 0:
			buf.WriteString(`\0`)
		case '\'':
			buf.WriteString(`\'`)
		case '"':
			buf.WriteString(`\"`)
		case '\b':
			buf.WriteString(`\b`)
		case '\n':
			buf.WriteString(`\n`)
		case '\r':
			buf.WriteString(`\r`)
		case '\t':
			buf.WriteString(`\t`)
		case 26:
			buf.WriteString(`\Z`)
		case '\\':
			buf.WriteString(`\\`)
		default:
			buf.WriteByte(s[i])
		}
	}

	buf.WriteRune('\'')
	return buf.String()
}

func (d mysqlExample) EncodeBool(b bool) string {
	if b {
		return "1"
	}
	return "0"
}

func (d mysqlExample) EncodeTime(t time.Time) string {
	return `'` + t.Format(timeFormat) + `'`
}

func (d mysqlExample) EncodeBytes(b []byte) string {
	return fmt.Sprintf(`0x%x`, b)
}

func (d mysqlExample) Placeholder(_ int) string {
	return "?"
}

const (
	timeFormat = "2006-1-2 15:04:05.000000"
)

func quoteIdent(s, quote string) string {
	part := strings.SplitN(s, ".", 2)
	if len(part) == 2 {
		return quoteIdent(part[0], quote) + "." + quoteIdent(part[1], quote)
	}
	return quote + s + quote
}

```

`EncodeTime(t time.Time)`を独自のdialectを定義することで上書きするような動作にしています。
こう書くことで、アプリ内のTimeZoneが使われるので、UTC以外のTimeZoneを使うことができます。

##終わりに
強引な感じですが、dbrでUTC以外を使いたい時の一つの手として紹介しました。
参考になれば幸いです。
 また、[KAMINASHI](https://kaminashi.jp)を開発しているユリシーズではエンジニア[積極採用中](https://www.wantedly.com/projects/210333)です！
UbuntuでmecabにComeJisyo（医療用語辞書）を追加する（コマンドのみ）

# mecab? ComeJisyo?
- [mecab](http://taku910.github.io/mecab/)とは、日本語を形態素解析してくれるソフトウェアである。
- [ComeJisyo](https://ja.osdn.net/projects/comedic/)とは、形態素解析する際に使用する医療用語に特化した辞書である。mecabから利用可能。

# この記事を書いた理由
- ComeJisyoがWindows前提なのでLinuxに取り込みずらいから
- 全てコマンドで解決したかったが、その記事は（調べた限り）無かったから

# 方法

```
# download
wget --trust-server-names "https://ja.osdn.net/frs/redir.php?m=ymu&f=comedic%2F59898%2FComeJisyoV5-1.zip"

# unzip
unzip ComeJisyoV5-1.zip -d Comejisyo

# utf8
iconv -c -s -f SHIFT_JIS -t UTF-8 Comejisyo/ComeJisyoV5-1.csv > Comejisyo/ComeJisyoV5-1_utf8.csv 

# 不要な行を削除
 head -n -2 Comejisyo/ComeJisyoV5-1_utf8.csv > Comejisyo/ComeJisyoV5-1_utf8_del.csv

# Dictionary作成
/usr/lib/mecab/mecab-dict-index -d /usr/lib/mecab/dic/mecab-ipadic-neologd/ -u comejisyo.dic -f utf-8 -t utf-8 Comejisyo/ComeJisyoV5-1_utf8_del.csv

# 辞書配置（任意の場所）
mkdir /usr/lib/mecab/dic/comejisyo
mv comejisyo.dic /usr/lib/mecab/dic/comejisyo/

# mecabtc
vim /etc/mecabrc

: 下記を追加
userdic = /usr/lib/mecab/dic/comejisyo/comejisyo.dic
```

# 結論

```
# comejisyo http://www.anlp.jp/proceedings/annual_meeting/2012/pdf_dir/C3-7.pdf

# 辞書投入前
echo "脂肪族アミン" | mecab
脂肪    名詞,一般,*,*,*,*,脂肪,シボウ,シボー
族      名詞,接尾,一般,*,*,*,族,ゾク,ゾク
アミン  名詞,固有名詞,一般,*,*,*,amin,アミン,アミン
EOS

# 辞書投入後
echo "脂肪族アミン" | mecab
脂肪族  名詞,一般,*,*,*,*,脂肪族,シボウゾク,シボーゾク,::教育::67467:
アミン  名詞,一般,*,*,*,*,アミン,アミン,アミン,:amine:栄:2:47163:
EOS
```
Yahooの日本語形態素解析APIからajaxを用いてデータを得るコード

#概要
この記事では、Yahoo Japanが提供している[日本語形態素解析](https://developer.yahoo.co.jp/webapi/jlp/ma/v1/parse.html)を用いて、形態素解析データを得るPHPおよびjQueryを紹介しています。

※このAPIを利用するためには、YahooにてアプリケーションIDの登録が必要です。登録は[こちら](http://e.developer.yahoo.co.jp/webservices/register_application)から。

#コード
```sample.php
<?php
$appid = '<あなたのアプリケーションID>'; // <-- ここにあなたのアプリケーションIDを設定してください。
function curl($url) {
    $ch = curl_init();
    curl_setopt($ch, CURLOPT_URL, $url);
    curl_setopt($ch, CURLOPT_HEADER, false);
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
    curl_setopt($ch, CURLOPT_TIMEOUT, 60);
    $xml  = curl_exec($ch);
    curl_close($ch);
    return $xml;
}
/*
    ここから処理
 */
if (isset($_POST['sentence'])) {
    $sentence = mb_convert_encoding($_POST['sentence'], 'utf-8', 'auto');
    $results = "ma,uniq";
    $response = "surface,reading,pos,baseform,feature";

    $url = "http://jlp.yahooapis.jp/MAService/V1/parse";
    $url .= "?appid=".$appid;
    $url .= "&results=".$results;

    $url .= "&sentence=".urlencode($sentence);
    $url .= "&response=".$response;
    echo json_encode(new SimpleXMLElement(curl($url)));
}
?>
```

```js
$.ajax({
	type: "POST",
	url: "sample.php",
	data: {sentence: sentence},
	success: function(data) {
		console.log(data);
	},
	error: function(XMLHttpRequest, textStatus, errorThrown) {
		console.log(XMLHttpRequest, textStatus, errorThrown);
	},
	dataType: "json"
});
```
javascript で文字数カウントをするときに2バイト文字を簡単に正しく扱う

# 文字数のカウント
Webアプリを作っていると、文字数をカウントしたくなることがぼちぼちあります。
そんなとき、
```javascript:count.js
let str = "hello world!";
console.log(str.length);  // 12
```
と言ったように、.length を使ってしまいがちですが、サロゲートペアや絵文字の場合には上手くカウントされません。
```javascript:count.js
let str = "😀𩸽";
console.log(str.length);  // 4 (2じゃありません)
```
仕様で〇〇文字で区切る、とかしてるとバグになります。上の例を3文字で区切ると
```javascript:count.js
let str = "😀𩸽";
console.log(str.slice(0, 3));  // 😀� (サロゲートペアの文字の前半だけになるので文字化けしてしまいます)
```
となります。
#解決方法
頑張って、「この文字コードの範囲はサロゲートペアなので次と連結して・・・」とやればできるのですが、もっと簡単な方法があります。
Array.from です。
```javascript:count.js
let str = "😀𩸽";
console.log(Array.from(str).length)  // 2
for (let i of Array.from(str)) {
    console.log(i);
}
// 😀
// 𩸽
```
便利になりました。
エンジニア向けMacBookのセットアップ

## はじめに
新しいMacBookを買いました！ :tada: :tada: 
開発用にカスタマイズしたので、`最初に行った設定やインストールしたソフト`を公開します。

## 「3 本指のドラッグ」を有効にする
ファイルドラッグ時などにトラックパッドを押し込まずに済むようになります :octopus: 

https://support.apple.com/ja-jp/HT204609

## 英字⇆かな変換のショートカットキーを変更する（USキーボードの場合）
* cmd + space に変更します。
  * 初期のCtrl + spaceはIntelliJを使用時に別のショートカットキーとぶつかってしまうので。

システム環境設定→キーボードから設定可能です。
<img width="672" alt="スクリーンショット 2017-06-18 23.07.06.png" src="https://qiita-image-store.s3.amazonaws.com/0/99874/aafccbf7-d380-da5d-f792-e47cd5995fa9.png">

## ライブ変換を止める
ライブ変換、控えめに言って邪魔なので止めちゃいます。
<img width="244" alt="スクリーンショット 2017-06-18 23.01.18.png" src="https://qiita-image-store.s3.amazonaws.com/0/99874/672f556f-afd0-c782-557c-11adffa4234f.png">

## Google日本語入力を入れる
Google日本語入力は、標準の入力に比べて補完が優秀。

https://www.google.co.jp/ime/

## 無料アプリ関連
### Chrome
言うまでもない定番ブラウザ。
Chromeが使いたいというより、

* 動作確認
* Chromeのプラグイン（React/Reduxのプラグインとか優秀！）

のために使っています。

https://www.google.co.jp/chrome/browser/desktop/index.html

<img width="173" alt="9c451cb7-7ae8-6257-10ab-ac5a3aa924f7.png" src="https://qiita-image-store.s3.amazonaws.com/0/99874/d26fa6d0-8d40-53da-adbd-238f034ba66d.png">

### GIPHY
GIPHYは無料で使えるGIF動画のキャプチャーです。
例えば、こんなGIFが取れるので、UIに関する質問や指摘などをあげます。

![6月-18-2017 23-33-45.gif](https://qiita-image-store.s3.amazonaws.com/0/99874/beb20e01-6b97-baa6-b835-e2c01e91591c.gif)

https://itunes.apple.com/us/app/giphy-capture-the-gif-maker/id668208984

### Skitch
Skitchは非常に秀逸なスクリーンショット＋画像加工アプリです。
とったスクリーンショットをわかりやすいUIですぐに加工できます。
<img width="634" alt="Yahoo_ニュース.png" src="https://qiita-image-store.s3.amazonaws.com/0/99874/510a3c3c-88ab-4a5a-6d76-1731dfb47e11.png">

### Cyberduck
![download-1.jpg](https://qiita-image-store.s3.amazonaws.com/0/99874/a552547a-0ae8-de48-e061-033bf9d1aca1.jpeg)

Mac用の定番FTPクライアントです。
SFTPはもちろん、S3、Google Drive, Dropboxなどにも対応している便利なソフトです。
https://cyberduck.io/

ちなみに…Mac App Storeで買うと有料ですが、上記の公式サイトからだと無料です。
気に入ったら、ぜひ購入してみてください。

## Docker
定番のコンテナ管理ソフトウェア。
さくっとDB立てたいときや、チームで開発環境を作るときに便利。
まだインストールされていない方は、[DockerをMacにインストールする](https://qiita.com/kurkuru/items/127fa99ef5b2f0288b81)で、インストール + 基礎を習得するのが良いかもしれません。

## 有料アプリ関連
### IntelliJ IDEA
![download.jpg](https://qiita-image-store.s3.amazonaws.com/0/99874/4104e785-46e9-338d-b710-c24a3f26e5fb.jpeg)

Java, Ruby, PHP, Go, JavaScript など何でも使える個人的に最強のIDE
https://www.jetbrains.com/idea/

使いやすいなと思っている点は、

* 強力な補完・ジャンプ機能
* 豊富なプラグイン
* DBビューアが見やすい

などです。個人ライセンスだと、1年間で1.5万円ほど。

### ZenHub

最強のカンバンをGitHubに追加してくれるツール
GitHubにもProjectsという機能がありますが、個人的には

* リポジトリを跨いだカンバンの管理ができる
* 見積もり機能（Estimate）がある。
* バーンダウンチャートが使える。
* issueを別リポジトリにコピーもしくは移動できる
* Epicという、親issue的な要素が使える。

などが便利だなと思っています。

1ヶ月、ユーザ数×$5で購入できます。

参考になるページ：[ZenHubとは](https://qiita.com/GeckoTang/items/f75b9a1c20c8e5091147)


## 終わりに
いかがでしたでしょうか。あ、これも入れてたみたいなのがあったら随時追加していきます。

※[@y_tsubuku](https://twitter.com/y_tsubuku)が開発する[yaritori - メール共有システム](https://yaritori.jp/)も、良ければご覧ください :tada:
Laravel5 MySQL8.0 NO_AUTO_CREATE_USERのSQL_MODEエラー対策

[前回](https://qiita.com/ucan-lab/items/3ae911b7e13287a5b917)に引き続き、MySQL8.0の罠がありました。

## エラー

```
$ php artisan migrate
In Connection.php line 664:

  SQLSTATE[42000]: Syntax error or access violation: 1231 Variable 'sql_mode' can't be set to the value of 'NO_AUTO_CREATE_USER' (SQL: sel
  ect * from information_schema.tables where table_schema = microposts and table_name = migrations)


In MySqlConnector.php line 150:

  SQLSTATE[42000]: Syntax error or access violation: 1231 Variable 'sql_mode' can't be set to the value of 'NO_AUTO_CREATE_USER'
```

## 対策

`config/database.php`

```
        'mysql' => [
            'strict' => false,
        ],
```

`strict` を false に変更すればokです。
新しくLaravelインストールしたものはデフォルトでfalseになってる(?)っぽいです。
以前から使ってるLaravelでMySQL8.0にバージョンアップしたときにエラーになりそうです。

## 参考

- https://laracasts.com/discuss/channels/laravel/help-about-mysql-80-problem
- https://dev.mysql.com/doc/refman/8.0/en/mysql-nutshell.html
Flutterでクリップボードにコピーする方法


```dart
// import
import 'package:flutter/services.dart';

// コピーするとき
final data = ClipboardData(text: "hogehoge");
await Clipboard.setData(data);
print("コピーしたよ");

// クリップボードからデータを取得するとき
final data = await Clipboard.getData("text/plain");
print(data.text);
```
iOSアプリのバージョン管理 (KAMINASHIの場合)

##この記事でわかること
・アプリリリース時のバージョンのプロパティについて
・弊社アプリでの各数字の意味合い

[KAMINASHI](https://kaminashi.jp/)を開発しているユリシーズでは[エンジニア絶賛募集中](https://www.wantedly.com/projects/210333)です！

##バージョンを管理しているプロパティ
iOSのアプリバージョンはCFBundleVersionで管理されています。

###CFBundleVersionとは (一部省略)
```
CFBundleVersion specifies the build version number of the bundle, which identifies an iteration of the bundle.
The build version number should be a string comprised of three non-negative,
period-separated integers with the first integer being greater than zero.
The string should only contain numeric (0-9) and period (.) characters.

The meaning of each element is as follows:
* The first number represents the most recent major release and is limited to a maximum length of four digits.
* The second number represents the most recent significant revision and is limited to a maximum length of two digits.
* The third number represents the most recent minor bug fix and is limited to a maximum length of two digits.
```

###訳 (by Google翻訳) 
```
CFBundleVersionは、バンドルのビルドバージョン番号を指定します。バンドルの反復を識別します。
ビルドバージョン番号は、ピリオドで区切られた3つの負でない整数で構成され、最初の整数が0より大きい文字列でなければなりません。
文字列には、数字（0-9）とピリオド（.）のみを含める必要があります。

各数字の意味は次のとおりです。
最初の数字は最新のメジャーリリースを表し、最大4桁の長さに制限されています。
2番目の数字は最新の重要なリビジョンを表し、2桁の最大長に制限されています。
3番目の数字は最新のマイナーなバグ修正を表し、2桁の最大長に制限されています。
```

[参考]
https://developer.apple.com/library/content/documentation/General/Reference/InfoPlistKeyReference/Articles/CoreFoundationKeys.html

##KAMINASHIでのバージョン管理
KAMINASHIの現在のCFBundleVersionは、`1.1.2.0`です。

`1.1`：api側のバージョン
`2`：リリースの度にインクリメント
`0`：通常は0。何らかの事情で再申請した場合にインクリメント

>3つの負でない整数

…細かいことは気にしないでください。
/etc/hostsを直したら「Can not connect to the Service chromedriver」を解消できた件

最近ずっとちゃんと動いてたSeleniumがエラーを吐くようになったのでその調査のメモをば。

## エラー文
```test.py
from selenium import webdriver

driver = webdriver.Chrome()
driver.get('https://www.google.co.jp/')
driver.close()
```
```
Traceback (most recent call last):
  File "<stdin>", line 1, in <module>
  File "/anaconda3/lib/python3.6/site-packages/selenium/webdriver/chrome/webdriver.py", line 68, in __init__
    self.service.start()
  File "/anaconda3/lib/python3.6/site-packages/selenium/webdriver/common/service.py", line 104, in start
    raise WebDriverException("Can not connect to the Service %s" % self.path)
selenium.common.exceptions.WebDriverException: Message: Can not connect to the Service chromedriver
```

`driver = webdriver.Chrome()`のところで落ちていた。
`Can not connect to the Service %s" % self.path`を見た感じでパスかネットワークの問題かなと大まかに目処を立てた。

## 類似事例の収集

[selenium でスクレイピングする際 WebDriverException “Can not connect to the Service chromedriver” がおきる](https://ja.stackoverflow.com/questions/30682/selenium-%E3%81%A7%E3%82%B9%E3%82%AF%E3%83%AC%E3%82%A4%E3%83%94%E3%83%B3%E3%82%B0%E3%81%99%E3%82%8B%E9%9A%9B-webdriverexception-can-not-connect-to-the-service-chromedr)

最新版を落としてインストールしてPATH通してね、という話なんですが自分のところではこれは大丈夫だった。

https://github.com/mozilla/geckodriver/issues/270
`I’m not able to reproduce this with selenium-3.0.0b3 off pip. It looks like geckodriver is starting successfully on the port the Python client is requesting it to, and that the client subsequently times out when attempting to connect on that port.`
色々漁っていたところこちらを発見。
ポートに接続しようとしているもののそこでタイムアウトが起こっている場合があるとのこと。

## /etc/hostsの修正

直近で、Laravelの環境構築でネットワーク周りを少しいじったことを思い出し確認するとlocalhostがコメントアウトされていた。

```/etc/hosts
# 127.0.0.1       localhost
```

このコメントアウトを外すことでちゃんとSelenium動くようになってくれた。
ラズパイ用3.5インチディスプレイでハマりました..

昨年Amazonで買ったラズパイ用の3.5インチディスプレイ(感圧式タッチパネル付き)ですが、
しばらくお蔵入りしていましたが、ふと思い出して手元のラズパイ2と一緒にセットアップしてみることにしました。

購入時はこんなパッケージに入ってました。3.5インチディスプレイもいろいろな種類が出回っているようですが、このディスプレイはLCDコントローラが ILI9486 というのがポイントのようです。

![rpi_3.5_display.jpg](https://qiita-image-store.s3.amazonaws.com/0/83701/2f18ed28-a878-e1a3-63dd-aa025067d5cc.jpeg)

いろいろググってみて、試してみましたが、いずれもうまくいかずそろそろ諦めていたとき、下記のページを見つけました。

[3.5 Inch 480x320 TFT Display with Touch Screen for Raspberry Pi](https://www.elecrow.com/wiki/index.php?title=3.5_Inch_480x320_TFT_Display_with_Touch_Screen_for_Raspberry_Pi)

ダメもとで、上記のページに記載のある下記の3つのコマンドを順序通りに実行したところ、あっさり動きました。

```sh:
% git clone https://github.com/Elecrow-keen/Elecrow-LCD35.git
...
% cd Elecrow-LCD35
% sudo ./Elecrow-LCD35
```

何度、Raspbianのセットアップからやり直したことか。。

というわけで、ILI9486を使った3.5インチディスプレイの導入・設定でハマった方は、上記の手順を一度試してみてはどうでしょうか。
react native "Could not parse the simulator list output"と怒られた時

# react nativeでios sumilotorを起動するとさっきまで普通に起動できたのにいきなり

```
Found Xcode workspace iceperkapp.xcworkspace
dyld: Symbol not found: _SimDeviceBootKeyDisabledJobs
  Referenced from: /Applications/Xcode.app/Contents/Developer/usr/bin/simctl
  Expected in: /Library/Developer/PrivateFrameworks/CoreSimulator.framework/Versions/A/CoreSimulator
 in /Applications/Xcode.app/Contents/Developer/usr/bin/simctl

Could not parse the simulator list output

```

と怒られた


#解決法

x codeがいつの間にアップデートされていてそれが原因だったらしい。x codeを開くと
「新たなコンポーネントを追加しますか」
的な文が出てくるのでそこで　installしてもう一度 run-iosするとすんなり開く。
それにしてもまだまだreact nativeの日本語情報は少ないですね。。。
Ubuntu 16.04 で OpenLDAP でユーザ認証を行う

Linux ミニクラスタのようなものを構築するときに, ユーザとストレージを統一したいですよね.
ユーザだけなら計算機ノード毎にアカウント作って, 公開鍵を各ノードの `authorized_keys` に追加して ssh ログインという手もありますが, NFS でストレージを扱いたいとなるとユーザ管理が必要になります
(gvfs, sshfs という手もあるかもではある)

伝統的にはユーザ管理は NIS, ストレージは NFS かと思います.
ユーザ管理については NIS は古すぎるようで LDAP 推奨のようなので LDAP にします.


LDAP サーバも LDAP クライアントも Ubuntu 16.04 とします.
ローカルのネットワーク内で完結する構成とします(拠点をまたいだ接続はしない)

## LDAP サーバ設定

How To Install and Configure OpenLDAP and phpLDAPadmin on Ubuntu 16.04
https://www.digitalocean.com/community/tutorials/how-to-install-and-configure-openldap-and-phpldapadmin-on-ubuntu-16-04

を参考にセットアップします. 最後の方の Step 4 の TLS/SSL 設定は optional です.

グループとユーザを作っておきます.

ブラウザによるのかもしれませんが, ユーザ追加時, Firefox ではフィールドが自動フィルされてうまく `cn` などを設定できませんでした. うまく設定できないときは, とりあえず一度作成したのち, あとで修正することで対処します.

パスワードについては, コマンドラインで `ldapadd` の場合はハッシュ化必要ですが, phpldapadmin で行う場合はブラウザ側でやってくれるようです(が, 本当にハッシュ化しているかはあやしいところ...? クライアント側の PAM とうまく連携してパスワードは暗号化してやりとりしてくれているのかしら?). `md5` や
`ssha` あたり動くの確認しました.

uid についてはデフォルト設定では 1000 から始まるため, Ubuntu のローカルユーザ UID と被りそうですので, phpldapadmin の config で割り振る uid の番号を 2000 とかに変えておくか, アカウント作成時に uid を変えておくとよいでしょう.

## クライアント設定

https://www.itzgeek.com/how-tos/linux/ubuntu-how-tos/configure-ldap-client-on-ubuntu-16-04-debian-8.html


を参考にセットアップします. 

CUI 設定が出てこない場合は, 

```
$ sudo dpkg-reconfigure ldap-auth-config
```

を呼びます.

今回はユーザは, クライアントからはパスワードを変更できないようにしました. そのためパスワードのハッシュアルゴリズムを選択するところではどれを選んでもよいようです.

LDAP サーバは, 設定の初期では `ldapi:///` になっていますが, ldapi は普通の接続(?)とは異なるようで, `ldapi` だとうまく繋がりません. `ldap://IP_ADDR` で `i` の無い `ldap` + IP アドレス指定にします.

その後, 

`/etc/nsswitch.conf` で, `passwd`, `group`, `shadow` に ldap を追加します.

```
passwd:         compat ldap
group:          compat ldap
shadow:         compat ldap
gshadow:        files
```

nscd をリブートします.

```
$ sudo service nscd restart
```

`getent passwd` で LDAP ユーザがリストアップされているか確認します.

ここで LDAP ユーザが表示されない場合, 設定がうまくいっていません.
一旦 apt のパッケージを入れ直したほうがよいでしょう.

このあたり, 筆者はクライアント側での最初のセットアップがうまくいかずに, 接続がうまくいかずにいろいろ設定ファイルを試行錯誤して, しかりやっぱりうまくいかずに 2 営業日くらい無駄にしてしまいました. 結局のところ原因は, いろいろいじくった /etc/ldap.conf で, 他のサイトで記載されていた RFC 2307 (AD) mapping のセクションを有効にしたためでした(これは Windows 用っぽい?). 

Ubuntu 16.04 の apt だと, pam の設定はだいたいいい感じに設定してくれるので, ホームディレクトリを作る以外は, pam 周りはいじる必要はありませんでした.

LDAP のアカウントで自分自身にログインしてみます(LDAP クライアントには `openssh-server` をすでに入れて ssh ログインできるようにしているとします).

```
$ ssh ldapuser@localhost
```

ログインできたら成功です!

## TODO

* ユーザ側でパスワードの変更ができるようにする.
* 最初にログインしたときにホームディレクトリを作成するようにする(+ ホームディレクトリを NFS マウントする)
* TLS/SSL 通信にしてセキュリティ向上をはかる
* sssd を試す https://qiita.com/s5601026/items/8c5f16a2935ccd7fb305
* NAS(Synology) を LDAP クライアントにして, NFS ストレージ連携をする
* Windows のユーザアカウントも統一化する.
Windows  VPS への初回ログオンで困った話

# 現象
とあるところで Windows VPS を契約しました。
リモートデスクトップ接続しようとしたところ，以下の様なメッセージが表示されログオン出来ません。

```
最初にログオンする前にパスワードを変更する必要があります。
パスワードを更新するか、システム管理者またはテクニカルサポートに問い合わせてください。
```

# 環境
- 接続先: Windows Server 2016 Datacenter
- 接続元: Windows 10 Home

# 解決策
以下のサイトに解決策が幾つか載っていたのですが，いずれも接続先の設定変更が必要。
ログオン出来ないので設定変更することも出来ず，困ってしまいました。
https://blogs.technet.microsoft.com/askcorejp/2015/11/10/windows-server-2012-r2-windows-8-1-1/

上記サイトによると，接続先と接続元の OS の組み合わせで発生するようなので，もしやと思い，スマホ（Android）上のリモートデスクトップアプリ（Microsoft Remote Desktop）から接続してみたところ，パスワード変更画面が表示されて，ログオンすることが出来ました。
pyserial実行時のエラーについて

#python初心者です、宜しくお願いします。
windows10 python3.7へpyserialをインストール行い下記コードを実行しましたが・・・ 

import struct, binascii, serial
s = serial.serial(2, 115200)

> 
== RESTART: C:\Users\aaaa\AppData\Local\Programs\Python\Python37\test1.py ==
Traceback (most recent call last):
  File "C:\Users\aaaa\AppData\Local\Programs\Python\Python37\test1.py", line 3, in <module>
    s = serial.serial(2, 115200)
AttributeError: module 'serial' has no attribute 'serial'

上記エラーが出ます、対処方法をご教授ください。
electronのwebviewとipcで通信する方法

# 開発環境
[electron-vue-typescript-starter](https://github.com/fwouts/electron-vue-typescript-starter)をベースに実装しました。

- electron
- typescript
- vue.js


# 実装方法

## vueコンポーネントファイル

```HogePage.vue
<template>
  <webview 
    src="http://localhost:3000/" 
    partition="persist:hoge"
    :preload="preload"
    autosize
    allowpopups
  />
</template>

<script lang="ts">
import Vue from "vue";

export default Vue.extend({
  name: "hoge-page",
  data () {
    return {
      preload: `file:${require('path').resolve(__dirname, '../path/to/preload.js')}`
    }
  },  
  mounted () {
    const webview: any = document.querySelector('webview')
    webview.addEventListener("ipc-message", (event: any) => {
      console.log("channel: " + event.channel)
    })

    webview.addEventListener('dom-ready', () => {
      webview.openDevTools() // webview側のデベロッパーツールを表示する。うざかったら消していい。
      webview.send("ping")
    })
  }
});
</script>
```

## preloadファイル(javascript)

```preload.js
const {ipcRenderer} = require('electron')

ipcRenderer.on('ping', (e, data) => {
  ipcRenderer.sendToHost('pong');
});

window.onload = function(event) {
  ipcRenderer.sendToHost("onload")
}
```

# 動作確認

デベロッパーツールのログに以下のように出力されれば成功

```
channel: onload
channel: pong
```

# 参考
https://electronjs.org/docs/api/webview-tag
【しずおかアプリ部】活動ログ　第50回

![しずおかアプリ部2.jpg](https://qiita-image-store.s3.amazonaws.com/0/88105/ee800648-fa25-1829-20c3-bad9c2055d35.jpeg)

##■公式サイト##
[http://monolizm.com/shizuoka-app](http://monolizm.com/shizuoka-app)
「Slack」も利用しています。 shizuapp で検索し、ご参加ください。

##◾️参加申し込み##
しずおかアプリ部への参加申し込みは[こちら](https://shizuoka-app.connpass.com/)から

##■タイトル##
第50回 & 懇親会


##■開催日##
２０１８年５月２３日（土）　１６：００～１８：００
２０１８年５月２３日（土）　１８：３０～２２：００ 懇親会


##■参加者##
１6名


##■活動内容（概要）##
・菅原プレゼン「Unity始めるよ 〜初心者向け講座！簡易レースゲーム制作でUnityを覚えよう１〜」
　　　　　　　「Unity始めるよ 〜オクルージョンカリングを試してみる〜」
・部員さん： OculusGOデモンストレーション
・雑談
・懇親会

##■活動内容（詳細）##

【実演・プレゼン】



**・菅原プレゼン　「Unity始めるよ 〜オクルージョンカリングを試してみる〜」**

　オクルージョンカリングとは、
　「建物などの後ろに隠れてカメラに映らないオブジェクトの描画を行わなくする機能」
　のこと。
　描画の負荷を減らして、フレームレートをあげるために使われる。
　Unityではオクルージョンカリングを簡単な操作で扱うことができる。

　ただし、モバイルで扱うときは注意
　カリングの判定はCPU側で行うので、性能の低いモバイル端末のCPUの場合、
　条件によってはCPUがボトルネックとなり、フレームレートを下げてしまう可能性がある。
　物理演算を多用するゲームでは使わない、性能の低い端末はターゲット端末に含めないことも視野に入れ、
　併せて、しっかりと検証を行う必要がある。


　![スクリーンショット 2018-05-29 17.50.40.png](https://qiita-image-store.s3.amazonaws.com/0/88105/c75f8599-87c5-9000-d6ae-865bc2d1c2a6.png)
　リアルタイムでの遮蔽判定は重いので、事前計算を行っておく。
　青い立方体が事前計算で生成された「セル」
　カメラがセルの中にないとオクルージョンカリングが行われないので注意。


　![スクリーンショット 2018-05-29 17.50.24.png](https://qiita-image-store.s3.amazonaws.com/0/88105/eb20d604-64d2-83f0-435e-0089c4b0e26e.png)
　視覚的にオクルージョンカリングの様子を確認できる。

　 [資料](http://monolizm.com/sab/pdf/第50回_プレゼン資料(〜オクルージョンカリングを試してみる〜).pdf)　

<hr>
**・菅原プレゼン　「Unity始めるよ 〜初心者向け講座！簡易レースゲーム制作でUnityを覚えよう１〜」**

　　ゲームを作ったことがない人向けに、考え方、やること、作り方をまとめた。
　　まとめはじめたら、とても１回のプレゼンじゃ収まりきらない内容になってしまったため、
　　何回かに分けて発表する。

　　今回は第１回として、ルール、仕様、設計、フォルダ階層や命名規則をふれた。
　　※一部実装方法についても触れている
　　
　初心者がやってしまいがちなのが、
　「しっかり考えずに実装を初めてしまうこと」
　実装しながら考えると、無駄な作業が増えたり辻褄が合わなくなったり、
　開発の中盤後半にひどい目にあう。
　最初のうちにしっかり考えておけば、思考が深くなり、事前に問題点が見えやすくなる。

　など、開発を進めるにあたっての、手順を簡単にまとめてある。

　![スクリーンショット 2018-05-29 18.48.29.png](https://qiita-image-store.s3.amazonaws.com/0/88105/16ba4a1a-c6d0-e506-d4a6-c66b2f04c070.png)
![スクリーンショット 2018-05-29 18.49.23.png](https://qiita-image-store.s3.amazonaws.com/0/88105/0ce1c882-9f84-984a-001c-01cadce4565d.png)



　 [資料](http://monolizm.com/sab/pdf/第50回_プレゼン資料(〜初心者向け講座！簡易レースゲーム制作でUnityを覚えよう〜).pdf)　



<hr>


**・　雑談**

・OculusGO体験
　部員さんがOculusGOを持って来てくれました。
　軽く、また、配線が全くなく使えるのでストレスが少ない。
　また、ディズプレイの解像度が高いのでドットが目立たず、没入感が高い。
　体験させてもらったが、かなり欲しいデバイスとなった。
　動画サービスにも対応しているので、1人映画館としてもすごく良い。

・Unite報告
　ゲーム分野だけでない活用方法も多くみられた。
　産業分野での人材育成にMR技術が使われていると。

・Unity2018について
　　スクリプタブルレンダーパイプライン
　　EntityComponentSystem
　　シェーダーグラフ
　が特に気になるところ。
　スクリプタブルレンダーパイプラインは触ってみて、次回のプレゼンで発表します。

<hr>


**・懇親会**
　計１０名の参加者で懇親会に行きました。
　やはりこれだけクリエイティブな活動している人が集まると、話の内容が濃いです。
　グラフィッカーとプログラマーの考え方の違いの話題だったり、
　映像系の話、マーケティングの話など、
　講演ができそうな話もたくさんありました。
　アプリ部内だけでは時間の都合で交流があまりできなかった人も、
　この懇親会でかなり仲良くなれたと思います。
　部員さん同士の横の繋がりがもっと増えれば良いなと思います。

　皆様に支えられてあっというまに５０回開催を迎えることができました。
　ありがとうございます。
　皆様がクリエイティブなことをするにあたって、
　アプリ部が良い勉強の場・交流の場になれるよう、
　これからもアプリ部を継続していきます。
　今後ともどうぞよろしくお願いいたします。
SignalR Service 調査メモ(1)

# SignalR Service 調査メモ(1)

SignalR Service が Public Preview になったそうなので調べてみました。
実際に使えるかどうかはおいといてサーバからのリアルタイム配信ってみんな大好き(?)ですから、そのうち役に立つ事があるやもしれません。

ちなみに私自身 SignalR を実際に使用した経験は、WebApps 上の管理画面的なWebアプリで他人の更新が自動的に反映される機能を追加する時に何度か使用した事はあります。

## とりあえず作ってみる

![create.png](https://qiita-image-store.s3.amazonaws.com/0/246831/c50695d9-c701-95ca-6a66-58ed817260f7.png)

Azure ポータルから "SignalR Service" で検索すると作れます。日本リージョンではまだ提供されていないのでとりあえず東南アジアで。
気になったのが Standard だと Unit数の変更が可能な所。Unit数を変更するだけという事は本来 SignalR でスケールする時にバックエンドとして Redis やら ServiceBus やらを立てて自分で設定しなければならない所を SignalR Service だと勝手に色々用意していい感じにやってくれるという事でしょうか？ これはありがたいですね。

![quickstart.png](https://qiita-image-store.s3.amazonaws.com/0/246831/f08cc5d0-f9a0-c240-442b-8b2ea70d9b92.png)


作成後、Quickstart を開くとこんな感じで使えばいいよ〜 って感じのソースが表示される。
ぱっと見普通に ASP.NET で SignalR を使う時に加えて AddAzureSignalR()・UseAzureSignalR() が増えてる所しか違いが見つからないです。
どうやって使用する SignalR Service を選択しているんだろうと思いつつリンクを辿って公式サンプルの[ChatRoom](https://github.com/aspnet/AzureSignalR-samples/tree/master/samples/ChatRoom) を見たら謎は解けました。

```
dotnet restore
dotnet user-secrets set Azure:SignalR:ConnectionString "<your connection string>"
dotnet run
```

シークレットマネージャに SignalR Service の接続文字列を設定しておくと使ってくれる感じなんですね。

## ChatRoomを動かしてみる

![negotiate.png](https://qiita-image-store.s3.amazonaws.com/0/246831/502e24aa-b0da-a9fd-e9d8-82bf78f5d0ca.png)

そのままの流れで ChatRoom サンプルを動かしてみます。
サーバをローカルで立ち上げて http://localhost:5000 を開き、Networkを見るとHubを開きに行った時にCORSで SignalR Service の方に接続に行っているのが見て取れます。

テストページで何かを送信すると SignalR Service の方に投げている事も確認できます。つまり、何か発言すると「ブラウザ → SignalR Service → ChatRoomサーバ」と経由して飛んできて、ChatRoom サーバで投げ返す事により「ChatRoomサーバ → SignalR Service → ブラウザ」と飛んで行っているようです。

## ここまでのまとめ

ChatRoom サンプルを動かした時点では特に変わった事をせずとも SignalR のエンドポイントを Azure上に立てる事ができて、スケールとかする時ちょっと楽になるかなという印象です。ASP.NET で SignalR をホストする時のちょっと上位互換みたいな。

気になっているのが Functions との組み合わせでサーバレスで送信ができるような使い方もできそうな事です。WebApps なしで html だけ開いておけば SignalR で通知が受けれるようなアプリがあれば色々使いでがありそうな気がします。

[RealtimeSignIn](https://github.com/aspnet/AzureSignalR-samples/tree/master/samples/RealtimeSignIn) とか多分そんな感じなので、おいおい中身を調べていきたいと思います。