OmniAICreator/Qiita-1.07M huggingface dataset:
PHP静的解析ツール集phpqaを使ってみる

# 背景とか

レガシーシステムのメンテとかで要改善点を洗い出すために静的解析ツール導入を検討。
PHP5.4から使える[EdgedesignCZ/phpqa](https://github.com/EdgedesignCZ/phpqa)を見つけたので導入してみた。

## 環境
- HostOS:Mac Mojave
- Docker for Mac
- GuestOS:CentOS7.3
- Dockerコンテナ内でPHP5.4 + Composerの環境が作れている前提

## 構築

プロジェクトのコンテナ内で

```
composer require edgedesign/phpqa --dev
```
でも行けるが、使えるものは使いたいので

composer.jsonに以下を記述し

```php5
    "require-dev": {
        "edgedesign/phpqa": "^1.20",
        "friendsofphp/php-cs-fixer": "^2.2",
        "jakub-onderka/php-parallel-lint": "^1.0",
        "vimeo/psalm": "^0.2.66",
        "sensiolabs/security-checker": "^4.1"
    }
```

```
composer install
```

を実行する。

完了したらば以下のコマンドを実行して、静的解析にかける(`hoge/fuga`は任意のディレクトリ)

```
vendor/edgedesign/phpqa/phpqa --analyzedDirs hoge/fuga --report --tools phpcs,phpmd,phpcpd,parallel-lint,phpmetrics,phploc,pdepend
```

こんな感じの結果がでる。エラー多すぎて笑えない。
<img width="1058" alt="スクリーンショット 2019-03-25 15.10.12.png" src="https://qiita-image-store.s3.amazonaws.com/0/133718/61efcfd4-ef79-3c04-3aee-3a4d5b37a1ee.png">

<img width="1190" alt="スクリーンショット 2019-03-25 15.17.22.png" src="https://qiita-image-store.s3.amazonaws.com/0/133718/a5045cfe-bf3a-86b3-7fb3-a865bcad0396.png">

<img width="818" alt="スクリーンショット 2019-03-25 15.18.54.png" src="https://qiita-image-store.s3.amazonaws.com/0/133718/f2c7a03f-a871-d6bc-9359-53e031914baa.png">

<img width="921" alt="スクリーンショット 2019-03-25 15.18.22.png" src="https://qiita-image-store.s3.amazonaws.com/0/133718/0390c579-4713-c614-c48e-484d145ac738.png">

<img width="1268" alt="スクリーンショット 2019-03-25 15.19.44.png" src="https://qiita-image-store.s3.amazonaws.com/0/133718/1feab93e-1fb9-789a-b354-c6ce4d6da3ce.png">

<img width="1181" alt="スクリーンショット 2019-03-25 15.20.25.png" src="https://qiita-image-store.s3.amazonaws.com/0/133718/27a731b9-5ebe-0956-1af6-35a6664a40ee.png">

<img width="1253" alt="スクリーンショット 2019-03-25 15.20.49.png" src="https://qiita-image-store.s3.amazonaws.com/0/133718/7c44b6ac-18c2-7cb7-3c65-96b44cb14e42.png">

`psalm`については読み込むxmlのpathが間違っているので、使う場合はpathを修正してください。下記のリンク参照。
[psalm fails because of missing config file](https://github.com/EdgedesignCZ/phpqa/issues/118)

## 参考

[EdgedesignCZ/phpqa](https://github.com/EdgedesignCZ/phpqa)
[psalm fails because of missing config file](https://github.com/EdgedesignCZ/phpqa/issues/118)
PHP + MySQL でスマホの絵文字を使う

文字コードを utf8mb4 にするとスマホ絵文字が使えるらしい。
まず、テーブルをクリエイトする際に CHARSET を utf8mb4 にする。

```SQL:
CREATE TABLE IF NOT EXISTS (テーブル名) (
  id    char(12) NOT NULL,
　　…
  PRIMARY KEY (id)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
```

PHP から DB を new するときに、"SET NAMES utf8mb4" する。

```PHP:
<?php

 try {
    $pdo = new PDO($dsn, (ユーザー名), (パスワード), array(PDO::MYSQL_ATTR_INIT_COMMAND=>"SET NAMES utf8mb4"));
  } catch (PDOException $e) {
    die("DB接続に失敗しました。");
  }

?>
```

これで、スマホから絵文字を書き込んだり、読みだしたりしたところ、上手く絵文字が表示されました。
ちなみにバージョンは
PHP 5.6
MySQL 5.6
でした。
Google Cloud Build でフロントキャッシュのクリア

前回はGoogle Cloud Buildを使い、WEBフロントコードのビルドの自動化を紹介しました。
今回は本番環境で運用するにあたり、フロント側のキャッシュクリア機構の追加を行いましたので紹介させていただきます。

## やること
- GCSをマルチリージョンで運用しているため、各リージョンのキャッシュも考慮に入れる
- Cloud CDN のキャッシュをクリアする
- Cloud CDN のキャッシュクリアは10分以上かかることがあり、CloudBuildがタイムアウトしてしまうため非同期にする

## デプロイ設定

```cloudbuild.yaml
 --- ビルド部分は省略 ---

# push build files to storage
- name: 'gcr.io/cloud-builders/gsutil'
  args: ['-m', '-h', 'Cache-Control\:public,max-age=30', 'rsync', '-d', '-r', 'build', '$_TARGET_STRAGE']

# wait 35 sec for clearing cache time
- name: 'gcr.io/cloud-builders/yarn:node-8.11.0'
  entrypoint: 'bash'
  args:
  - '-c'
  - |
    sleep 35

# delete CDN cache
- name: 'gcr.io/cloud-builders/gcloud'
  args: ['compute', 'url-maps', 'invalidate-cdn-cache', '$_CDN_NAME', '--path', '/*', '--async']
```


```push build files to storage```部分で```rsync```を行う際に```Cache-Control\:public,max-age=30```を追加しています。
これにより、GCSで各リージョンにコピーされたファイルのキャッシュを30秒に制限しています。

```wait 35 sec for clearing cache time```で35秒間waitしてキャッシュクリア期間をおいています。

```delete CDN cache```でCDNキャッシュのクリアを行なっています。```--async```オプションを追加することにより非同期で実行してCloudBuildがタイムアウトしないようにしています。

## まとめ
CloudBuildのタイムアウト設定ができるようになっていますが、設定できるのは「CloudBuild全体のタイムアウト設定」と「各ステップのタイムアウト設定」になります。
各ステップの最大タイムアウト設定は10分で、CDNキャッシュクリアには10分を超えることがあるためタイムアウト設定は使えませんでした。
そのため、今回のような設定を行なっています。
[Unity]VideoPlayerの再生をawaitする拡張メソッド

UniRxに依存しますが

# コード
```C#:VideoPlayerExtensions.cs
public static async UniTask PlayAsync(this VideoPlayer videoPlayer)
{
    videoPlayer.Play();
    
    // WaitForFirstFrameが有効の場合最初の数フレームはフラグが立たないため
    // 再生フラグが立つまで待つ
    if (videoPlayer.waitForFirstFrame)
        await UniTask.WaitUntil(() => videoPlayer.isPlaying);
    await UniTask.WaitWhile(() => videoPlayer.isPlaying);
}
```

# 使い方
```C#:VideoPlayController.cs
public class VideoPlayController : MonoBehaviour
{
    [SerializeField]
    private VideoPlayer _videoPlayer;

    // Start is called before the first frame update
    async void Start()
    {
        Debug.Log("再生開始");
        await _videoPlayer.PlayAsync();
        Debug.Log("再生終了");
    }
}
```
JavaScriptでCSSのクラスの値を変更する

JavaScriptでCSSのクラスの値を変更するサンプルです。

通常JavaScriptでCSSの値を変更するには

```javascript
var el = document.getElementById('id名');   // 要素を指定
el.style.color = "#ff0000";                 // 値を入れる
```

上みたいに　__要素.style.プロパティ = 値;__　のようにしますが、

クラスの値を変更する場合は
__CSSルール.style.プロパティ = 値;__　のようにします。

要素の代わりに__CSSルール__を指定すればいい、ということです。

##CSSルールとは
__CSSルール__というのは、styleタグなどに次のようなCSSが書かれている場合

```css
.outer{
	display:flex;
	margin:20px;
}

.inner{
	width:112px;
	height:60px;
	border:1px solid #aaa;
}

.bgred{
	background-color:#f00;
}
.bgblue{
	background-color:#00f;
}
```

__セレクタ{プロパティ:値; ～}__ のブロックが __CSSルール__になります。
上記のCSSには、「.outer, .inner, .bgred, .bgblue」をセレクタとした４つのCSSルールがあるということです。

##CSSルールの見つけ方
CSSルールの見つけ方ですが、要素の場合と違って getElementByIdのような簡単に指定できるメソッドはないようなので、stylesheet(内部的な)からCSSのセレクタを目印にしてクラスが設定されているCSSルールを探します。

.bgblueをセレクタとしている CSSルールを見つけるには次のようにします。

```javascript
var targetClass = getRuleBySelector('.bgblue');

// 指定セレクタのCSSルールを取得する
// 呼び出し例　getRuleBySelector(".inner1")	seleにCSSセレクタ
function getRuleBySelector(sele){
	var i, j, sheets, rules, rule = null;

	// stylesheetのリストを取得
	sheets = document.styleSheets;
	for(i=0; i<sheets.length; i++){
		// そのstylesheetが持つCSSルールのリストを取得
		rules = sheets[i].cssRules;
		for(j=0; j<rules.length; j++){
			// セレクタが一致するか調べる
			if(sele === rules[j].selectorText){
				rule = rules[j];
				break;
			}
		}
	}
	return rule;
}
```

短いプログラムなので大体わかると思いますが、ポイントは __selectorText__プロパティで CSSルールからセレクタを取得して、一致したらその CSSルールを返すというところです。

ちなみに、外部サーバーからスタイルシートを読み込んでいる場合は、
rules = sheets[i].cssRules;
あたりでエラーが出ると思います。必要な方はここでエラー処理を行ってください。

##サンプルソース

実際に動くサンプルとして、「マウスホイールを回すと bgblueクラスが設定されたボックスの背景色が変化する」というのを置いておきます。

```html
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>クラス操作てすと</title>
<style>
.outer{
	display:flex;
	margin:20px;
}

.inner{
	width:112px;
	height:60px;
	border:1px solid #aaa;
}

.bgred{
	background-color:#f00;
}
.bgblue{
	background-color:#00f;
}
</style>
</head>
<body>
ホイールを回すと bgblueクラスの背景色が変わる
<div class="outer">
 <div class="inner bgblue"></div>
 <div class="inner bgred"></div>
 <div class="inner bgblue"></div>
</div>

<script>

var targetClass = getRuleBySelector('.bgblue');

// ホイールで色を変更
document.addEventListener('wheel', function(e){
	var delta = (e.deltaY > 0) ? 1:-1;
	chgColor(delta);
});

function chgColor(delta){
	if(typeof chgColor.val === 'undefined')
		chgColor.val = 240;
	chgColor.val += delta*10;
	targetClass.style.backgroundColor = 'hsl('+chgColor.val+', 100%, 50%)';
}

// 指定セレクタのCSSルールを取得する
// 呼び出し例　getRuleBySelector(".inner1")	seleにCSSセレクタ
function getRuleBySelector(sele){
	var i, j, sheets, rules, rule = null;

	// stylesheetのリストを取得
	sheets = document.styleSheets;
	for(i=0; i<sheets.length; i++){
		// そのstylesheetが持つCSSルールのリストを取得
		rules = sheets[i].cssRules;
		for(j=0; j<rules.length; j++){
			// セレクタが一致するか調べる
			if(sele === rules[j].selectorText){
				rule = rules[j];
				break;
			}
		}
	}
	return rule;
}

</script>
</body>
</html>
```

##参考にさせていただいたサイト
>[uhyohyo.net JavaScript初級者から中級者になろう 第五章　CSSの操作](https://uhyohyo.net/javascript/5_1.html)

##あとがき
CSSルールにアクセスして CSSプロパティの値を変更するという方法は、セレクタが一致すればいいので、クラスだけでなく擬似要素や擬似クラスでも同様な方法で値の変更が可能です。
C++ Declarations and Definitions

C++ N3797
http://www.open-std.org/JTC1/sc22/wg21/docs/papers/2013/n3797.pdf

3.1 Declarations and definitions

p.33
>A declaration is a definition unless it declares a function without specifying the function’s body (8.4), it contains the extern specifier (7.1.1) or a linkage-specification25 (7.5) and neither an initializer nor a function- body, it declares a static data member in a class definition (9.2, 9.4), it is a class name declaration (9.1), it is an opaque-enum-declaration (7.2), it is a template-parameter (14.1), it is a parameter-declaration (8.3.5) in a function declarator that is not the declarator of a function-definition, or it is a typedef declaration (7.1.3), an alias-declaration (7.1.3), a using-declaration (7.3.3), a static_assert-declaration (Clause 7), an attribute- declaration (Clause 7), an empty-declaration (Clause 7), or a using-directive (7.3.4).

[ Example: all but one of the following are definitions:

> declares static data member y

宣言は長々と書いている。
定義は例示だけ。

そのうちの一つが宣言だという。

どう理解すればいいのだろうか。

### 最後までおよみいただきありがとうございました。
いいね　💚、フォローをお願いします。
####  Thank you very much for reading to the last sentence.
Please press the like icon 💚　and follow me for your happy life.
Ruby On Rails - ②Scaffold

# Scaffold使ってみる

## Blogプロジェクト生成
<img width="775" alt="スクリーンショット 2019-03-24 10.57.03.png" src="https://qiita-image-store.s3.amazonaws.com/0/108475/96676f8b-5625-9bb8-1f1e-0686c1856fc9.png">

## Scaffoldコマンド
```
$ rails generate scaffold モデル名 カラム名1:データ型1 カラム名2:データ型 2 …
```

簡単なブログを作って見ます。Terminalから以下のコマンドを実行

```
$ rails generate scaffold blog title:string blog:text write_date: datetime
```
データ型

|  | mysql | sqlite | postgresql |
|:--|:--|:--|:--|
| :binary | bolb | bolb | bytea |
| :boolean | tinyint(1) | boolean | boolean |
| :date | date | date | date |
| :datetime | datetime | datetime | timestamp |
| :decimal | decimal | decimal | decimal |
| :float | float | float | float |
| :integer | int(11) | integer | integer |
| :string | varchar(255) | varchar(255) | character varying(256) |
| :text | text | text | text |
| :time | time | datetime | time |
| :timestamp | datetime | datetime | timestamp |


ソースが自動的に生成される

```
Running via Spring preloader in process 17329
      invoke  active_record
      create    db/migrate/20190324031749_create_blogs.rb
      create    app/models/blog.rb
      invoke    test_unit
      create      test/models/blog_test.rb
      create      test/fixtures/blogs.yml
      invoke  resource_route
       route    resources :blogs
      invoke  scaffold_controller
      create    app/controllers/blogs_controller.rb
      invoke    erb
      create      app/views/blogs
      create      app/views/blogs/index.html.erb
      create      app/views/blogs/edit.html.erb
      create      app/views/blogs/show.html.erb
      create      app/views/blogs/new.html.erb
      create      app/views/blogs/_form.html.erb
      invoke    test_unit
      create      test/controllers/blogs_controller_test.rb
      create      test/system/blogs_test.rb
      invoke    helper
      create      app/helpers/blogs_helper.rb
      invoke      test_unit
      invoke    jbuilder
      create      app/views/blogs/index.json.jbuilder
      create      app/views/blogs/show.json.jbuilder
      create      app/views/blogs/_blog.json.jbuilder
      invoke  assets
      invoke    coffee
      create      app/assets/javascripts/blogs.coffee
      invoke    scss
      create      app/assets/stylesheets/blogs.scss
      invoke  scss
      create    app/assets/stylesheets/scaffolds.scss
```

migrate実行

```
rails db:migrate

== 20190324031749 CreateBlogs: migrating ======================================
-- create_table(:blogs)
   -> 0.0013s
== 20190324031749 CreateBlogs: migrated (0.0014s) =============================

```
Rails4.2 -> 5.2 バージョンアップした話

Ruby on Railsはバージョン依存の影響を受け易いなという印象を持っているのですが、自分たちが作っているアプリケーションでも導入したいGemのバージョンとの相性を考慮して最新にする必要があると判断してバージョンを上げることにしました。
表題の通り4.2から5.2です。Deplicatedとかなっているものは容赦なくなくなったり、今まで動作上厳格を求めてなかったものが厳しくなるというのが主な違いでしょうか。とりあえずGem上のバージョンだけ上げて、 `bundle install` したら全く動かなくて冷や汗かくみたいなところを繰り返してなんとか移行を完了させました。
以下その内容です。全てではありませんがポイントだけかいつまんでご紹介します。参考になれば幸いです。
#進め方
4.2 → 5.0 → 5.1 → 5.2 のように段階的に上げよというのがRails的なオススメのようですが、以下を読みつつ一気に上げるのもできるんじゃないかと思ったりです。動かなけりゃどうするか確認するのは一緒だし。
ということでGemfileを大胆に変更して `bundle install` とか `bundle update` してエラーが出なくなるまでバージョンを調整かけるのを最初に行います。
並行して `rails app:update` でconfigファイルの刷新を行います。操作間違えると今まであるファイルが一瞬にして消えてしまうのでバックアップもしくはgitで過去データを取っておいて差分比較しながら入れ替えたconfigファイルを直していきます。
その後は個別に `rails s` で動作確認して挙動のおかしい箇所を直す感じです。

#Gemfile

```gemgile
gem 'rails', '5.2.2' #単純に最新版にUP
gem 'mysql2', '>= 0.4.4' #このバージョンにしないと動かない
gem 'rmagick', '2.16.0'　#最新は３．０．０だけど動かないので旧バージョンに戻す必要あり
```

あとはバージョン固定しているものは全部解除

#Model
関連付けが存在しない場合、belongs_toでバリデーションエラーが発生することになったので、外部キーが設定されない可能性がある場合は

```
belongs_to :user, optional: true
```

みたいな感じにしておきます。また、Modelの継承元がApplicationRecordになるので

```
class Event < ApplicationRecord
```

というふうに書き換えます。これに対応するように以下のクラスも作成します。

```
class ApplicationRecord < ActiveRecord::Base
  self.abstract_class = true
end
```

##Enum
Enumの定義も厳格になったぽく定義内容と実際のDBのテーブルの定義に乖離があると中身がnilになってしまうのでずれてないか確認する必要あります。

```
class InsertScript < ApplicationRecord
  enum prev_or_next: {"prev": 1, "next": 2}
```
ちなみに私はこれでハマったのでもう定義ごと削除しました。

#Controller
before_filter が完全に廃止された臭いのでbefore_actionに書き換えます。

```
-  before_filter :set_locale
+  before_action :set_locale
```

##OmniAuth
個人的には若干怪しいので書くべきか悩みましたが、OmniAuthもenv["omniauth.params"]["from"]のような環境変数でFacebookなどのサードパーティからのデータが取得できたものが、きちんとrequest.envと書かないといけなくなったようです。

```
-            session[:redirect_after_fb_login] = env["omniauth.params"]["from"] if env["omniauth.params"].present? && env["omniauth.params"]["from"].present?
+            session[:redirect_after_fb_login] = request.env["omniauth.params"]["from"] if request.env["omniauth.params"].present? && request.env["omniauth.params"]["from"].present?
```

OmniAuthのコールバックを書いている箇所はこのように修正する必要があります。


# Config Update
Config配下のファイルをまとめて5.2用にリプレースしてくれるツールがあるのでこれを使います。

```
rails app:update
```

これを流すと以下のファイルが書き換わります。

```
bin/bundle
bin/setup
bin/update
config/application.rb
config/boot.rb
config/cable.yml
config/environments/development.rb
config/environments/production.rb
config/environments/test.rb
config/puma.rb
```

上書きの際には確認をしてくるのでいきなり消えたりはしませんが、必ずバックアップして以前の情報も参照できるようにしてください。

#その他・まとめ
あとは動作確認しながら出たら都度潰す感じなのですが、一旦ここまで対処して動かすと以前と同じように＆気持ちパフォーマンスが上がった気がします。本記事がお役に立てれば嬉しいです。
バリデーションで使用する正規表現の読み方


Form等のバリデーションで使用する正規表現、多くの場合は
Google等でコピペをしてくれば終わりなのですが、
少し読めるようになっておくと、間違い等にも気付きやすくなるかなと思い、
簡単なルールだけまとめてみました。

<h2>ルール（メタキャラクタ）</h2>

| ルール　　　　　  　　　　　　|   意味　　　　　　　　 |   
|:-----------------|:------------------|
| ^ |　文の始め |               
| ＄ |　文の終わり |              
| . |任意の1文字 |                
| [大括弧囲み] | いづれか1文字 |                  
| -(マイナス) |範囲 |  
|[　^　]（大括弧＋^）|指定クラスの否定
|  (縦線)  |または　　　　|
| * |直前の１文字の０回以上の繰り返し|
| + |直前の１文字の１回以上の繰り返し|
| ? |直前の文字の０回または１回だけの登場を表現
| ( )（小括弧）| 一つのまとまり、グループ |
| \ |メタキャラクタの意味の打ち消し|

またperlでは以下も使えます。

| ルール　　　　　　　|   意味　　　　　　　　 |   
|:-----------------|:------------------|
|\s　|空白文字１文字|
|\w　|英数字または「_」のうち１文字|
|\d　|数字１文字|

<h2>具体例</h2>

^abc　　の場合は、文頭がabcいづれかを指します。

[a-c][abc]　は、同じ意味で、半角のaからcまでのいづれか1文字とマッチします。

abc+　　は、 abcの1回以上の繰り返しにマッチするため,ab にはマッチしません。
 　　　　　abc abcc abccc などにマッチします。

abc*　　は、 abcの0回以上の繰り返しにマッチするため
　　　　　　ab abc abcc abccc abccccなどにマッチします

abc?　　は、 １回だけを表現するため、ab abc にしかマッチしません

「^0-9」　は、[]で半角数字以外の任意の１文字にマッチ、^でクラスの否定なので
　　　　　「半角数字以外の1文字」とマッチします。abcや漢字やひらがなもマッチします。

(abc)+　は、abcをグループとし、１回以上の繰り返しにマッチするため
　　　　　 abc abcabc abcabcabc などとマッチします。



<h2>実践編（数字）</h2>

少しわかりづらいので
バリデーションでよく使うものを見ていきましょう。

<h3>全て数値（半角）</h3>

```
/^[0-9]+$/
```
文頭から半角数字の0-９までのいづれか1文字(^[0-9]）を
１回以上の繰り返しで文末まで（+$）となるため、
全て半角の数字にマッチします。


<h3>全て数値（全角,半角）</h3>

```
/^[0-9０-９]+$/
```

全角と半角の両方の数字をマッチさせたい場合は
[]のなかに全角と半角の全ての数字を入れ（[0-90ー９]）
文頭（^）から文末($)まで1文字ずつ繰り返し行うこと(+)でマッチできます。


<h3>半角アルファベット（大文字・小文字・数値）</h3>

```
 /^[a-zA-Z0-9]+$/
```

さらに半角アルファベットも加えたい場合はこのようになります。

<h3>電話番号(ハイフンなし10桁)</h3>

```
/^\d{10}$/
```
数字１文字を10文字分（\d{10}）という形になります。


<h3>e-mailの場合</h3>

```
/^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/
```

いきなり難しくなったって？
そんなことはありません。

```
/^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+　
　@[a-zA-Z0-9-]+　
　(?:\.[a-zA-Z0-9-]+)*$/
```

このように３つに分解することができ、
この意味正規表現の意味は、「何かしらの文字**＠**英数字**.**英数字」です。

最初の[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+は全ての文字を表し、
@以降は、英数字の繰り返し（[a-zA-Z0-9-]+）
.以降は、英数字の繰り返し（[a-zA-Z0-9-]+）を（？：）でクループ化し、＊＄で文末まで指定しただけです。

.を入力する際には、打ち消しとして
バックスラッシュ\を入れる必要があるので（\.）複雑に見えてしまうんですね。


<h2>まとめ</h2>
正規表現の見方について、まとめてみましたが、
実際には、様々な数字や文字が入ることもあるので、
下記サイトのようなもので、最終チェックをした方がよさそうです。


https://regexper.com/#%2F%5E%5Ba-zA-Z0-9.!%23%24%25%26'*%2B%2F%3D%3F%5E_%60%7B%7C%7D~-%5D%2B%40%5Ba-zA-Z0-9-%5D%2B%28%3F%3A%5C.%5Ba-zA-Z0-9-%5D%2B%29*%24%2F
nuxtでreset CSSを記述する場所がわからなかった話


#reset.css記述したけど反映されない…
**コメントいただいたのでこちらの記事の修正版書きました**
https://qiita.com/nuxt_suco/items/862edb681a4fd3ddcc23

自分で試行錯誤してて、vueファイルを読み込むからcss単一ファイルのアプローチが
もしかしてダメなのかな、、、(そんなことない気もしてます)
でもどしていいかわからなかったので
Twitterのフォロワーさんにヘルプしてみました
それで勉強になったことを今回は書きます

#ディレクトリー構造を理解したらスッキリした

pagesディレクトリーだけを今までいじってたので、困らなかったのですが
nuxt始めたばかりというのもあり、全くわからず進んでました(すごい良くない)

ディレクトリ構造についてはこちらの公式を見るとわかりやすいです
https://ja.nuxtjs.org/guide/directory-structure/

# nuxtのディレクトリー構造

```.
├── assets
├── components 
│   └── AppLogo.vue
├── layouts    
│   └── default.vue
├── middleware
├── nuxt.config.js
├── pages     
│   └── index.vue
├── plugins
├── static
│   ├── favicon.ico
│   └── ticket_vending_machine.jpg
└── store      
```

# layoutのdefault.vueが標準で読み込まれてる

```
<template>
  <div>
    <nuxt/> # (pages配下に書いたやつは</nuxt>に呼び出される)
  </div>
</template>
```

# default.vueにreset.cssの記述をしたらいいのか!

```html
<style>

// # ここまでの元から書かれてるCSSは省略してます

/* http://meyerweb.com/eric/tools/css/reset/
v2.0 | 20110126
License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
a{
text-decoration: none;
}
address{
font-style: normal;
}

</style>
````

**見事反映されました！！！！！！！！！！！！！！！！！！！**
今後は、componentsディレクトリーとも仲良くしたいです！
また何か学んだら書きにきます！


# 今回参考にしたリンク先
[nuxtのディレクトリー構造について]
https://ja.nuxtjs.org/guide/directory-structure/
[nuxtのlayoutディレクトリーについて]
https://ja.nuxtjs.org/guide/views#%E3%83%AC%E3%82%A4%E3%82%A2%E3%82%A6%E3%83%88
[reset.css選定の時に参考にしたサイト]
http://shiru-web.com/2017/04/21/01-26/
C# LINQでMAX値を保持する行のみ抽出

タイトルのある通りLINQである配列から枝番のMAX値の行だけを取り出したくて以下のコードを記述しました。

全件取得よりもレスポンスが悪化したので何かもっといい案がないか検討中です。

元のデータは

```json

{apiresponse:
  {
    XX:XX....
    idatas :
      {
        r_no:101
        XX:XX....
        sdatas: 
          {
            r_no:101
            r_no:1
          },
          {
            r_no:101
            r_no:2
          }
      },{
        r_no:102
        XX:XX....
        sdatas: 
          {...}
  }
}

```
このような階層のJSONになっており
やりたいことはSQLでいうと

```sql

SELECT
  a.r_no   --PK1
  ,a.r_no2 --PK2
  ,a.s_dt
  ,.......
FROM
  datas a
  INNER JOIN ON 
    (
      SELECT
        r_no
        ,MAX(r_no2) r_no2
      FROM
        datas
      GROUP BY 
        r_no
    ) b
    ON a.r_no = b.r_no
    AND a.r_no2 = b.r_no2

```


これを何とかLINQでできないかと検討しました。

```csharp

//外部APIの呼び出し
            var apiResponse = (await XXXAsync(XXX, YYY));

            var sdatas = apiResponse.idatas
                .Select(s =>
                    {
                        var max = s.sdatas.Max(m => m.r_no2);
                        var maxdata = s.sdatas.First(f => f.r_no2 == max);

                        return new ResponseSdata()
                        {
                            r_no = maxdata.r_no1,
                            r_no2 = maxdata.r_no2,
                            s_dt = maxdata.s_dt,
                            s_name = maxdata.s_dt,
                            c_dt = maxdata.c_dt,
                            c_person = maxdata.c_person,
                            c_memo = maxdata.c_memo,
                            s_m_cd = maxdata.s_m_cd
                        };

                    }
                );

```

※3/26 更新：ご指摘いただいた内容で修正しました。プログラムもすっきりし、かつパフォーマンスも改善されました。
UnityのキャラのPrefabをTPoseにする

Unityで作業中、知らない内にモデルがTPoseじゃなくなってた事がありました。
デフォルトで変な姿勢をされちゃうとCollision設定とかしづらいですのでTposeに戻したい!
という事で自分のやり方です。
![Before.png](https://qiita-image-store.s3.amazonaws.com/0/142334/7a351c4f-5e84-06ff-1f6d-a9d67fbb63f1.png)
ライセンス表記：© Unity Technologies Japan/UCL

そもそもPrefabの姿勢が変わってしまう原因はおそらく、アニメーション実行中にPrefabの更新をしてしまってその時のアニメーションの姿勢に上書きになってしまっているからだと思われます。
なので元に戻すにはTposeのアニメーションを実行してPrefabを再度更新すればよい、という事になります。


VRChat SDKにちょうどtpose-new.fbxというアニメーションデータがあるのでインポートして利用します。
VRChat SDKのDLはこちら(ユーザー登録してログイン)
https://www.vrchat.net/home/login

以下のDownLoad UnityからDL
![vrc.png](https://qiita-image-store.s3.amazonaws.com/0/142334/9b202c5c-a79f-48a0-712e-31320aced08a.png)

そしてインポート
![VRCImport.png](https://qiita-image-store.s3.amazonaws.com/0/142334/df51c010-1828-7b46-e7fe-930afca2af04.png)


Animatorにtpose-newをドラッグ&ドロップでセット
![tpose_new.png](https://qiita-image-store.s3.amazonaws.com/0/142334/4fa2886f-584b-1979-b65d-a743ac883ea4.png)

シーンを再生して、再生中にPrefabのApplyを押す
![vrc.png](https://qiita-image-store.s3.amazonaws.com/0/142334/9402147d-012a-bef0-3acc-1fd560787042.png)

Tposeに戻りました
![tpose.png](https://qiita-image-store.s3.amazonaws.com/0/142334/496ccbf1-c9f2-96a8-f116-ee29d3dc76c8.png)
bundle exec rspec spec/が急に動かなくなった時の対処法

## 現象

```
$ bundle exec rspec spec/controllers/hoge_controller_spec.rb
```
といつも通りテストを走らせようとしたところ

```
bundler: failed to load command: rspec (/Users/user-name/project-name/vendor/bundle/ruby/2.3.0/bin/rspec)
```
と言われてしまった。

テストが通ってるかは自動テスト側でもわかるけど、不便なので直す方法がないか検索してみました。

## 試してみたこと1

```
$ bin/rake db:migrate RAILS_ENV=test
```
をしてねとエラーメッセージに書いてあるので素直にやってみました。

結果は失敗。（特にエラーの内容は変わらず）

## 試してみたこと2（これで解決）

最近結構DB周りをいじる開発が多かったので、もしかしたらDBの不整合が起きてしまったのか？と疑い
一旦DBをresetしてから再度migrationするようにしてみました。

```
$ bundle exec rake db:migrate:reset
```

上記のコードでDBを一旦リセットして

```
$ bundle exec rake db:migrate
```

で無事にテストの検証ができるようになりました。

よかったよかった。
JuliaでGLM(使える選択肢)

[Julia の GLM (v1.1.1) パッケージ](http://juliastats.github.io/GLM.jl/stable/)で使える一般化線形モデルの分布モデルとリンク関数と、推定したモデルに対して使える関数を列挙する。[前記事](https://qiita.com/piccolist/items/072393f84fff4d6ef172)の補足である。

# モデリングに際して
自分の持ってるデータに GLM を適用するにあたって、
1. 分布モデル：モデリングしたい目的関数の値の型と範囲に合うもの
2. リンク関数：データをそれで変換したら線形になりそうなもの、
をそれぞれ選んで、組み合わせられるようなら glm() で指定してモデリングする。今一つピンと来ない時は、試せる組み合わせを全部試す。

# 使い方

```Julia
using GLM, RDatasets

dat = RDatasets.dataset("datasets", "iris")             # R の iris データ
mod = glm(@formula(SepalLength ~ SepalWidth * Species), # 目的変数と説明変数
          dat,                                          # データ
          Normal(),                                     # 分布モデル
          IdentityLink())                               # リンク関数
```

# 使える分布モデル
目的関数の値の型と範囲に合い、かつ分布の様子をうまく表せそうなものを選ぶ。

|分布モデル|関数名|目的変数|備考|ありがちな組み合わせ|
|:----|:----|:----|:----|:----|
|ベルヌーイ分布|Bernoulli()|0か1の二値||LogitLink|
|二項分布|Binomial()|0か1の二値||LogitLink|
|ガンマ分布|Gamma()|非負実数||InverseLink|
|正規分布|Normal()|全ての実数||IdentityLink|
|ポアソン分布|Poisson()|非負整数|目的変数の期待値 = 分散|LogLink|
|負の二項分布|NegativeBinomial(θ)|非負整数|期待値 < 分散|LogLink|

負の二項分布を使いたいがθの値をどうしていいかわからないというときは、glm() の代わりにθの値も推定する negbin() を使う。

# 使えるリンク関数
リンク関数の選択肢はこんな感じ。もしかしたら「対象となる分布」には Julia では使えないものも混ざっているかもしれないが、GLMパッケージのバージョンアップで対応するかもしれない。

|リンク関数$f(y)$|目的変数$y$|対象となる分布|備考|
|:----|:----|:----|:----|
|CauchitLink()|0か1の二値|二項分布||
|CloglogLink()|$0<y<1$|二項分布|$f(y)=\log(-\log(1-y))$|
|IdentityLink()|全ての実数|ポアソン、ガンマ、正規|変換しない $f(y) = y$|
|InverseLink()|非零の実数|ガンマ、正規|$f(y) = 1/y$|
|InverseSquareLink()|非零の実数|逆正規分布|$f(y) = 1/y^2$|
|LogitLink()|0か1の二値|ベルヌーイ、二項|ロジスティックの逆関数|
|LogLink()|非負の実数、整数|二項、ポアソン、ガンマ、正規|$f(y) = \log(y)$|
|NegativeBinomialLink()|非負で上限のある整数|負の二項分布|$f(y)=\log(y/(y+θ))$、θは指定する|
|ProbitLink()|非負実数|二項分布|正規分布の累積分布関数の逆関数|
|SqrtLink()|非負実数|ポアソン|$f(y)=\sqrt{y}$|

# モデルができたら
得られたモデルに対して使える関数には以下のようなものがある。モデルの情報を取り出したり、モデルをもとに計算したりする。

|関数||
|:--|:--|
|coef()|線形予測子の係数を返す|
|deviance()|モデルの逸脱度を返す|
|dof_residual()|残差の自由度を返す|
|glm()|一般化線形モデルを当てはめて返す|
|lm()|一般線形モデルを当てはめて返す|
|stderror()|モデルの各係数の標準誤差を返す|
|vcov()|モデルの分散共分散行列を返す|
|predict()|モデルから目的変数の予測値を計算して返す|

また、得られたモデルのオブジェクト内にいくつかフィールドがある。上の関数では見られない値も、フィールドを直接参照したらわかる。glmfit.jl 内で GwtslmResp 構造体に定義されている。モデルのオブジェクトを mod とすると、たとえば逸脱度残差には mod.model.rr.wrkwt でアクセスできる。

|フィールド|意味|型|
|:--|:--|:--|
|y|目的変数値|FPVector|
|d|分布モデル|UnivariateDistribution|
|devresid|逸脱度残差|FPVector|
|eta|線形予測子の値|FPVector|
|mu|予測値（モデルが予測する分布の期待値）|FPVector|
|offset|線形予測子に加えるオフセット|FPVector|
|wrkwt|最終的に得られた重み|FPVector|
|wrkresid|最終的に得られたモデルの残差|FPVector|
非Homebrewなrbenvで最新のRubyがインストールできない場合

## Gitでインストールしたrbenvで新しいRubyが入れられないよ!!
```
ruby-build: definition not found: 2.5.3

The following versions contain `2.5.3' in the name:
  rbx-2.5.3

See all available versions with `rbenv install --list'.

If the version you need is missing, try upgrading ruby-build:

  cd /home/rkun/.rbenv/plugins/ruby-build && git pull && cd -
```
こう言われたんだよね。

## 新Rubyをインストールするにはrbenvのプラグイン`ruby-build`をアップデート
解決策はエラーメッセージの最後に書いてます。
`cd /home/rkun/.rbenv/plugins/ruby-build && git pull && cd -`
chart.jsプラグインZoomで時系列データのmaxとminを制限する方法

# 問題
chart.jsの公式プラグインで、チャートのズームアップ・ズームダウンを実現するZoom and pan pluginですが、時系列データ(type:"time")の場合、maxとminを指定してもそれ以上の領域が表示されてしまいます。
できればこれを制限して、maxとmin範囲外のものは表示しないようにしたい。

# 解決法1
解決する方法は二つあります。
一つはスクロールボタンではなく、ドラッグによる拡大表示を有効にする方法。
具体的には以下のようにパンの`enable`を`false`、ズームの`enable`と`drag`を`true`にする

```javascript
zoom: {
    enabled: true,
    drag: true,
    mode: "x",
    rangeMin: {
        x: 3600000
    },
    rangeMax: {
        x: ((new Date(data[3].timestamp).getTime()) - (new Date(data[0].timestamp).getTime())) + offset
    }
},
scales: {
    xAxes: [{
        type: "time",
        time: {
            min: new Date(data[0].timestamp).getTime(),
            max: new Date(data[3].timestamp).getTime()
        }      
    }]
}
```

これでドラッグで拡大、ダブルクリックで拡大解除ができると思います。
参考: [How to set time scale zoom in ChartJS?](https://stackoverflow.com/questions/53118166/how-to-set-time-scale-zoom-in-chartjs)

# 解決法2
解決法2は、chartjs-plugin-zoom.js自体を書き換える方法です。
おそらくGithubで公開されているソースはツール(たぶん gulp)などでminifyする前のものですが、
問題の箇所としては`zoomNumericalScale()`関数を書き換えればいいです。
たとえば`minDelta`は最小値の変更数を保存される変数で、これがゼロ以下の場合は拡大されます。つまり`minDelta`の総合計がゼロ以下なら拡大、ゼロ以上ならmaxを超えた縮小がされるということです。

……言葉にするとややっこしいので、minifyされたままの状態で書き換えるなら以下のように書き換えてください。コードを読む方が分かりやすいかと思います。
(以下のコードはjavascriptの整形ツールで一度展開したコードです)

変更前

```javascript
  function u(o, e, t, n) {
    var a = o.max - o.min,
      i = a * (e - 1),
      m = o.isHorizontal() ? t.x : t.y,
      r = (o.getValueForPixel(m) - o.min) / a,
      l = i * r,
      u = i * (1 - r);

    o.options.ticks.min = c(n, o.min + l)
    o.options.ticks.max = s(n, o.max - u)
  }
```

変更後

```javascript
  var old_l=0;
  var old_u=0;
  function u(o, e, t, n) {
    var a = o.max - o.min,
      i = a * (e - 1),
      m = o.isHorizontal() ? t.x : t.y,
      r = (o.getValueForPixel(m) - o.min) / a,
      l = i * r,
      u = i * (1 - r);
      old_l += l;
      old_u += u;
      if (old_l < 0) {old_l = l=0;}
      if (old_u < 0) {old_u = u=0;}

    o.options.ticks.min = c(n, o.min + l)
    o.options.ticks.max = s(n, o.max - u)
  }
```

シンプルにグローバル変数を加えて、minDeltaとmaxDeltaのそれぞれの総計を記憶しています。
これで範囲を超えずに拡大と縮小ができます。
RPA削減時間の増大方法

###なぜ数時間も削減できるのか？
RPAを進めていく中で削減時間の営業謳い文句と実態が乖離しているように感じる。
自動化してもそんなに時間削れない。
頑張ったけど秒単位でしか削れない。

実際にRPAしたことにより、手作業に比べて15秒も削れました。
:fearful:だからなんなんだ・・・そのRPAに1時間かけたら大赤字にしか見えない

###攻撃力アップ魔法を唱える
アルテリオス計算式 攻撃力 ― 防御力 ＝ダメージ

ダメージを与えるにはつまり攻撃力を高める必要がある。
RPAの攻撃力アップ魔法の計算式は概ね以下の通り

```math
\frac{1日の削減時間[秒]}{3600}　　　　 × 年間営業日(242日)　＝　削減時間(1年間)
```
年間営業日は各社違うので実態に合わせる必要あり。多ければ多いほどMPの消費は大きいが威力は増大する。

```math
\frac{削減時間15秒}{3600}　 × 年間営業日(242日)　＝ 1.00833...[時]\\
```

タイムアタックの刻みが時間単位にまで化けました。
公務員想定の242日なら60秒削減で約4時間削減に!!

###結論
秒単位でも削ることで結果的にはいいことある
バグでも使わないとそんなにならないと思っていたがそうでもない。
これから導入を検討する人は例え1分しか短縮しなくても泣かないこと
rails 備忘録

#rails 備忘録
##メソッド
`initialize`
User.newを実行すると自動的に呼び出される

##Session

sessionとは主にログイン機能に使用されるもので、ログイン状態を持続させるためにある。

sessionがないとページを移動するたびにログインし直さなければならない。

Railsにはあらかじめセッションを実装するために便利なメソッドが用意されている。

セッションの情報はRails標準では、ブラウザ側のCookieに保存されている。

##helper メソッド
Viewをシンプルに書くためのものであり、関数のようなもの。
Railsが標準で用意しているものもあるが、自分で作ることも出来る。

##migration
migrationとはSQLを書かなくてもデータベース内にテーブルを作成することができる機能
migrationファイル内に書かれた内容をActiveRecordが自動的にSQLに翻訳してくれる。
翻訳する時に使うコマンドが
`rails db:migrate`
であり、一度正常に実行されたファイルは実行されない。
php-master-changes 2019-03-24

今日は不要なエディタ用の設定行の削除、Travis 用のビルド設定で、--enable-wddx を削除する修正、tokenizer が最近のコミットでおかしくなっていた問題の修正、CREDITS を削除して README へ移動する修正、autoconf 等のバージョンチェックを行うスクリプトのリファクタリングがあった！

# 2019-03-24
## petk: [ci skip] Remove text editor modelines
- https://github.com/php/php-src/commit/f63829852e5512789ba0048403864708ed782390
- [7.4~]
- エディタ用の設定行を削除
- [2 月にも消していた](https://qiita.com/sj-i/items/a5690a083b5754c30dc7#petk-remove-local-variables)奴の残り

## Girgias: Remove enable-wddx from Travis compile as it WDDX has been unbundled as of PHP 7.4
- https://github.com/php/php-src/commit/6b362e063c0adbe5405c28f641bfe264a6ef3efb
- [7.4~]
- Travis 用のビルド設定で、--enable-wddx を削除（7.4 から[バンドルから外された](https://qiita.com/sj-i/items/37525ff034429abfc0b7#cmb69-unbundle-extwddx)ので）

## guilliamxavier: Fix tokenizer_data_gen.sh for non-posix bison
- https://github.com/php/php-src/commit/516d27775d0b548fcbb35ec05e77131f932069c0
- [7.4~]
- ext/tokenizer で、tokenizer_data_gen.sh を修正
- [PR:3977](https://github.com/php/php-src/pull/3977)
- [先日の bison の -y 外し](https://qiita.com/sj-i/items/37525ff034429abfc0b7#petk-upgrade-deprecated-directives-and-use-non-posix-bison)で必要になった修正

## petk: [ci skip] Move CREDITS from root to README
- https://github.com/php/php-src/commit/092ebd032cf06d8d78e69f83aa6bc0e4c2072612
- [7.4~]
- 公式へリンク張るだけだった CREDITS を削除して README へ言及を移動

## petk: Enhance Autoconf version checking
- https://github.com/php/php-src/commit/8b94042c470ceb83432a169f7df042f508c1c400
- [7.4~]
- autoconf 等のバージョンチェックを行う buildcheck.sh をリファクタリングし、ドキュメントを足し、プロジェクトルート以外から呼べるよう修正
rails new したらやることリスト。Heroku, Bootstrap 4, gitignore

## Gemfile

### 上の方の sqlite3 削除

```ruby
# gem 'sqlite3'
```

ローカルのみの開発の場合は削除せずに、`gem 'sqlite3', '~> 1.3.6'` に書き換えるだけでいい。

### development 環境に sqilte3 追加。バージョン指定忘れずに！！！

heroku 対策
heroku は sqlite3 使えないので。

```ruby
group :development, :test do
  ...
  gem 'sqlite3', '~> 1.3.6'
end
```

### production 環境に pg 追加

heroku 対策

```ruby
group :production do
  ...
  gem 'pg'
end
```

### development 環境に rb-readline 追加

`Library not loaded` 対策

```ruby
group :development do
  ...
  gem 'rb-readline'
end
```

##### 参考記事
[rails c 時の Library not loaded: /usr/local/opt/readline/lib/libreadline.7.dylib (LoadError) 解決方法](https://qiita.com/alohaoe/items/9b20a6b549c80991ef21)

## Bootstrap 4

### 公式ページ見るのが確実 && 早い

[Bootstrap 公式](https://getbootstrap.com/docs/4.3/components/alerts/)
[Bootstrap gem 公式](https://github.com/twbs/bootstrap-rubygem#bootstrap-ruby-gem--)
[sprockets-rails 公式](https://github.com/rails/sprockets-rails#installation)

## .gitignore 編集

[gitignore.io](https://www.gitignore.io/)が便利

`.gitignore` が表示されてない場合はターミナルから `ls -a` して `.gitignore` を押下して編集。
Mysqlにinsert文を使ってデータを入力する方法


Mysqlにinsert文を使ってデータを挿入する方法について書いていこうと思います。

##1.テーブル名を確認しよう

```
 show tables;
```

上記のshow tablesを実行するとデータベースの内容が表示されます。

```
+---------------------+
| Tables_in_greenhorn |
+---------------------+
| admin_users         |
| answers             |
| daily_reports       |
| item_categories     |
| items               |
| migrations          |
| password_resets     |
| questions           |
| rent_infos          |
| stores              |
| tag_categories      |
| user_infos          |
| users               |
| work_schedules      |
+---------------------+
```

##2.テーブル名を選択しよう

```
insert into テーブル名(カラム名1,カラム名2,カラム名3...) values('カラムに対応する値1','カラムに対応する値2','カラムに対応する値3');
```

で特定のテーブルにデータを入力することができます。

user_infosというテーブルにデータを挿入したい場合、下記のように書くことができます。

```
insert into user_infos(first_name, last_name, email, sex, hire_date, store_id)  values('sasaff','rr', 'ssaasha','男','2018-07-17 00:00:00','2');
```

よく間違える点として値にシングルクオーテーションをつけ忘れると以下のようなエラーが出てくるので気をつけた方がいいでしょう。

```
 Unknown column '入力した値' in 'field list'
```

シングルクオーテーションマークをつければ以下のように正常にデータが入力されましたというレスポンスが返ってきます。

```
Query OK, 1 row affected (0.00 sec)
```

このようにinsert文を使ってデータを入力することができます。
LaravelそっくりなPython製WebフレームワークMasonite 2.1.23 がリリースされました


Masonite 2.1.23 が[リリース](https://github.com/MasoniteFramework/core/blob/2.1/CHANGELOG.md)されました。

[Cors middleware](https://docs.masoniteproject.com/security/headers#cors9)が追加されました。

[@ line statements](https://docs.masoniteproject.com/the-basics/views#view-syntax)が追加されました。
Xamarin.FormsでMessagingCenterのSubscribeとUnsubscribeの注意点

# Subscribeは累積する
Xamarin.Formsにはわりと気軽に画面間でデータ（オブジェクト）のやりとりができる`MessagingCenter`というものがあります。
これは静的クラスでデータを受け取りたい側で`Subscribe`メソッドで受け取る準備（購読）をし、送りたい側で`Send`メソッドでデータを送れば、購読先でデータを受け取ることができるので、とても便利です。

さて、この`MessagingCenter.Subscribe`メソッドですが、呼び出すたびに`購読`が累積していきます。
例えば、以下のように2回購読したとしましょう。
これはメッセージが届いたらダイアログを表示させるだけのものです。

```csharp
        public MainPage()
        {
            InitializeComponent();

            MessagingCenter.Subscribe<MainPage, string>(this, "Greeting", (sender, msg) => {
                DisplayAlert("Message1", msg+"1", "OK");
            });

            MessagingCenter.Subscribe<MainPage, string>(this, "Greeting", (sender, msg) => {
                DisplayAlert("Message2", msg+"2", "OK");
            });

        }
```

で、例えば以下のようにボタンが押されたタイミングで`Send`メソッドでメッセージを送ると、2回ダイアログが表示されます。

```csharp
        private void Button_Clicked(object sender, EventArgs e)
        {
            MessagingCenter.Send<MainPage, string>(this, "Greeting", "Hello");
        }
```

それは正しい動作なのですが、`Subscribe`を累積したくない場合は`Unsubscribe`して購読を解除する必要があります。

# 購読解除するときの注意点
ざっくりいうと、購読を適切に解除するには`Unsubscribe`メソッドを用いるのですが、ここで注意が必要なことは型引数と引数が解除したい購読と同じであることです。

```csharp
public static void Unsubscribe<TSender,TArgs> (object subscriber, string message) where TSender : class;
```

例えば上の例で言えば、以下の購読を解除したい場合、

```csharp
            MessagingCenter.Subscribe<MainPage, string>(this, "Greeting", (sender, msg) => {
                DisplayAlert("Message1", msg+"1", "OK");
            });
```

購読解除は以下のようになります。

```csharp
            MessagingCenter.Unsubscribe<MainPage, string>(this, "Greeting");
```

しかし、ここでもう一つ要注意なのが`subscriber`引数です。
[公式のドキュメント](https://docs.microsoft.com/ja-jp/dotnet/api/xamarin.forms.messagingcenter.unsubscribe?view=xamarin-forms)では`Subscribe`でも`Unsubscribe`でも以下のように書かれているため、さしあたり`this`にしていると思います。

```
パラメーター
subscriber
Object
メッセージをサブスクライブしているオブジェクト。 通常、サブスクライブしているオブジェクト内で使用される this キーワードによって指定されます。
```

多くの場合これは正しく機能するのですが、プログラムによっては`this`が毎回異なる場合があり、解除したい購読を正しく指定できずにどんどん購読が累積していくことになります。
例えば、毎回`new`されるオブジェクトの中で購読や解除をしようとする場合です。

`subscriber`引数には、変化しないインスタンスを指定する必要があります。
`this`が変化しないインスタンスであればそれを使用すればよいし、そうでなければ変化しないインスタンスを用意（例えばシングルトンなオブジェクト）してそれを使用する必要があるようです。


# ちなみに
`Xamarin.Forms 4.0`（現時点ではPreview）には新しいコンテナの`Shell`がありますが、これをプロジェクトテンプレートから作成すると、このテンプレートで作成されるプロジェクトは購読の解除がうまくできずに累積してしまいます。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/245438/a1699df1-67dd-716f-e526-4e5b672f493a.png)

`ItemsViewModel`クラスで以下のように購読と解除を行うように変更するとうまくいきます。

```csharp
        public ItemsViewModel()
        {
            Title = "Browse";
            Items = new ObservableCollection<Item>();
            LoadItemsCommand = new Command(async () => await ExecuteLoadItemsCommand());

            MessagingCenter.Unsubscribe<NewItemPage,Item>(MessagingCenter.Instance, "AddItem");
            MessagingCenter.Subscribe<NewItemPage, Item>(MessagingCenter.Instance, "AddItem", async (obj, item) =>
            {
                var newItem = item as Item;
                Items.Add(newItem);
                await DataStore.AddItemAsync(newItem);
            });
        }
```
direnvとdotenvと仲良くする

みなさん、direnvやdotenvつかってますか？
僕は受託開発をしたり自社サービス開発をしたりでどっちもよくつかいます。

- dotenv
    - Docker
    - アプリケーション
- direnv
    - AWSのCredentials
    - serverless.yml

みたいな感じでちょこちょこ混在するので、direnvはdotenvからロードするようにしたりしてます。

```sh:.envrc
dotenv
```

こんな感じで `dotenv` って書くとdirenvが `.env` ファイルをロードしてくれるので基本的にはこうしてます。
ちなみにパスを書くことでロードするファイルを変更できたりもします。

```sh:.envrc
dotenv ./.env.production
```

ここで課題なんですが、direnvに依存した生活を送っているとどうにもステージの切り替えに難儀したりします。
現在がローカル開発環境用の `.env` を読み込んでいる状態だとします。

```sh
# デプロイしたい環境の環境変数を読み込む
$ source .env.production

# デプロイコマンド（これはNode）
$ npm deploy

# direnvの状態を戻す
$ direnv reload
```

こんな感じのものをpackage.jsonのscriptsに書いておくことで対応すればいいんじゃね、って思いつきました。
まだ試してないけど絶対動きます。
ABC122 C - GeT AC(300点)

#問題概要
[問題のリンク](https://atcoder.jp/contests/abc122/tasks/abc122_c)

$A$, $C$, $G$, $T$ からなる長さ $N$ の文字列 $S$ が与えられます。
文字列$S$に以下の操作を$Q$回行え。

整数 $l_i,r_i (1≤l_i<r_i≤N)$ が与えられる。
$S$の先頭から $l_i$ 文字目から $r_i$ 文字目までの (両端含む) 部分文字列を考える。この文字列に <font color="Red">AC</font>は部分文字列として何回現れるか出力せよ。


#制約条件
- $2 \leqq N \leqq 10^5$
- $1 \leqq Q \leqq 10^5$
- $S$は長さ$N$の文字列である。
- $S$の各文字は $A$, $C$, $G$, $T$ のいずれかである。
- $1 \leqq l_i < r_i \leqq N$

#考えたこと
文字列$S$から、$S[l-1]$から$S[r-1]$までを切り取り、判定していこうと思ったがこの場合計算量が$0(N^2)$で最大$O(10^{10})$になってしまう。圧倒的TLE。

なので$O(N)$に収めないといけない。

文字列$S$が与えられた時点で、$AC$の数が決まっているため、文字列$S$において、0~N文字目までのACの出現回数の累積和$t[i]$をとっていく。
あとは$t[r]-t[l]$が答えとなる。


#解答
```c.cs
using System;
using System.Linq;

class Program
{
    static void Main(string[] args) {
        int[] a = Console.ReadLine().Split().Select(int.Parse).ToArray();
        int n = a[0];
        int q = a[1];
        char[] s = Console.ReadLine().ToCharArray();
        for (int i = 0; i < n-1; i ++) {
            if (s[i]=='A' && s[i+1]=='C') s[i] = 'a';
        }
        int[] t = new int[n];
        t[0] = 0;
        for (int i = 0; i < n-1; i ++) {
            if (s[i]=='a') t[i+1] = t[i]+1;
            else t[i+1] = t[i];
        }
        for(int i = 0; i < q; i ++) {
            int[] b = Console.ReadLine().Split().Select(int.Parse).ToArray();
            int l = b[0]-1;
            int r = b[1]-1;
            Console.WriteLine(t[r]-t[l]);
        }
    }
}
```
自作スライダーにページネーションをつけたいのですが・・

自作でスライダーを作り、ページネーションを追加したいのですが、どうもうまくいかず。。。
下記のコードにどう追加したらいいのか教えてくださいT_T

スライダー部分は下記になります。

	//slider
	var slideWidth = $('.slide').outerWidth(),
	slideHeight = $('.slide').height(),
	slideNum = $('.slide').length,
	slideSetWidth = slideWidth * slideNum;
	$('.slideSet').css('width', slideSetWidth);	
	$('.slider').css('height', slideHeight);

	$(window).on('load resize', function(){
		slideWidth = $('.slide').outerWidth(),
		slideHeight = $('.slide').height(),
		slideNum = $('.slide').length,
		slideSetWidth = slideWidth * slideNum;
		$('.slideSet').css('width', slideSetWidth);	
		$('.slider').css('height', slideHeight);
	});
	var size = 0;
	var xwidth = $('div.slider').width();
	var slideCurrent = 0;	

	var sliding = function(){
		if( slideCurrent < 0 ){
			slideCurrent = slideNum - 1;

		}else if( slideCurrent > slideNum - 1 ){
			slideCurrent = 0;
		}
		$('.slide_nav').find('li a').removeClass('active');
		$('.slide_nav li a').eq(slideNum).addClass('flex-active');

		$('.slideSet').stop().animate({
			left: slideCurrent * -100 +'vw'
		});
	}
	setInterval(function(){
		slideCurrent++;
		sliding();
	},8000);

	$('.slider_prev').click(function(){
		slideCurrent--;
		sliding();
	});

	$('.slider_next').click(function(){
		slideCurrent++;
		sliding();
	});

ページネーション自動追加は下記です。

  // ページネーション追加
  var html = '<li class="nav1"><a class="active">1</a></li>';
  for (var i=2; i<=slideNum; i++) {
  	html += '<li class="nav'+slideNum+'"><a>'+slideNum+'</a></li>';
  };
  $('.slide_nav').append(html);



よろしくお願いいたします！
ラズベリーパイの消費電力っってどうなの？？

#ラズパイの消費電力を計測してみた

ラズパイを使う上で２４時間つけっぱなしやサーバー用途として使う人も多いはず。
となるときになるのが消費電力です。
なので今回は、ラズパイの消費電力についてまとめてみます。


###・用意したもの
・RaspberryPi ModelB
・DCDCコンバータ　３A（降圧）
<img src="https://qiita-image-store.s3.amazonaws.com/0/375392/a88d13b6-f867-be93-75ef-52e74e8a22bd.jpeg" alt="写真" width="193" height="130">
↑こちらの都合で用意しました。
・ACアダプタ（12V2A）５Vの電源でもいいです。
・デジタル電圧電流計
<img src="https://qiita-image-store.s3.amazonaws.com/0/375392/5bbbe8f3-ae93-85b6-9231-a438962b63a3.jpeg" alt="写真" width="193" height="130">
・ピンヘッダ用ジャンパ線（あると便利）

###Let's make!
まずはACアダプタを改造します。
はじめに先っぽのコネクタとか端子は切り落として、導線だけにしてください。
あとは皮膜を向いて線をむき出しにすればOK

次にDCDCコンバータの調整？です。
これは大須で1000円で売ってました。
最大出力３Aなのでラズパイにも対応です。
同じようなやつが秋月電子とかで売ってると思います。
こういうやつね↓
http://akizukidenshi.com/catalog/g/gK-05437/

端子ターミナルの入力側に先程改造したACアダプタの線をさしてドライバで締めます。
＋ーを間違えると壊れますｗ
出力側にテスターを接続してから、ACアダプタを差します。
基板上のボリュームを回してだいたい５V〜5.1Vの間で調整してください。

今回購入したものは電圧メーター付きでとても使いやすかったです。


次に電圧電流計の接続です。
これも秋月とかで売ってますね。今回使用したのは貰い物です。
電流計のアンペア数は10Aでいいです。100Aとかありますがそんなに要りません

このキットは色々種類があるので解説しづらいです。
要点としては
・メーター電源はDCDCから供給
・電流計の前に負荷（ラズパイ）をつなぐ←まれにこれだとだめなものもあるので注意

キットの取説とか見ながら接続してください。

一応ですが秋月のこの商品の場合の接続法を書いておきます
http://akizukidenshi.com/catalog/g/gM-09738/

この商品はGND内部接続なので気をつけないとショートします。

１.メーター電源はラズパイと同じ電源（５V）
※電源の細い黒線は使わないのでカット
２.メーターの前にラズパイを接続（説明のPDFどおりに）
といった感じです。

今回作ったものは最終的にこうなりました
<img src="https://qiita-image-store.s3.amazonaws.com/0/375392/6254a30b-fc1c-e7d5-a747-7b865cf68e19.jpeg" alt="写真" width="300" height="200">


一番左のコネクタがGPIOに刺さる汎用コネクタとなっています。
コネクタじゃなくてピンヘッダ用のジャンパ線でいいですが

接続するGPIOの場所は、ラズパイを手に持ち右側にUSB、LANポート
手前にHDMIの向きで左上のピンの１，２個目が５Vの入力、3個目がGNDです。
絶対に極性を間違えないように注意です。


##結果
アイドル時（デスクトップ）で0.3A
負荷マックスで１Aギリ超えない程度
ネットサーフィン時でマックス0.5〜0.6A
YouTube動画（1080p視聴）でマックス0.7〜0.8A

この数字に5をかければ消費電力です。
アイドルで1.5W
負荷かけても５Wならかなりエコですね。

このまま検証していて気づいたのですが、
負荷をかけると一気に消費電力が上がって意外と一瞬で下がります。

瞬間的に1A超えることもあります。
なのでスマホの充電器（1A）だと落ちるのですね...

##謎？？？

これだと2.5Aも要るのかと思った人も多いはず。
ネットで調べてみるとこんな情報があり、

システム用で1.2A
USBサポートで1.3Aが割り当てられているとのこと

なのでどんだけ負荷かけても1.2Aは超えません。
ただしUSB機器を使えばかなり増えます。

・やってみたことその1
スマホの充電

iPhone８で検証しましたが約0.5A上昇しました。この状態で負荷マックスにしたら1.5Aいきました。

その2
　USBメモリを差しまくる
割と電気食うUSBメモリを4つ差してみました。
結果は0.4A上昇。
書き込みとかやりまくったら0.6Aくらい行くときもありました。

なのでその点も踏まえて2.5Aということがわかります。

##まとめ
ラズパイはエコ。

おまけ
2.5Aも要らない
最低1.5Aでイケる
（個人の見解です）

※2019/3/28追記
使用したラズパイの種類を明記しました
Nextcloudで使えるREST API一覧

毎度、ググっても出てこない小ネタを取り扱っております。
本記事は個人的な見解であり、筆者の所属するいかなる団体にも関係ございません。

# 1. はじめに
Nextcloudを個人的に使っている分には困ることはあまりないと思いますが、企業で使い始めたり、何かソリューションとして動かしたい場合には自動化したいですよね。
しかし、その為にNextcloudのアプリケーション(以下アプリ)を作り込んだりすると、Nextcloudのバージョンアップで対応できなくなったり、動かなくなったりする事も考えられます。
そういう事を避けるためには、Nextcloudのフレームワークに依存しないで自動化できた方が後々便利だったりします。そういうときのためにAPIを使って疎結合しておくというのはよい方法だと思います。

そこで、Nextcloudが標準で備えているAPIを各種ご紹介しておきます。

# 2. Nextcloud API

## 1. ユーザー管理API
ユーザーとグループとアプリを管理できるAPIです。
ユーザーリストや個別のユーザー情報を取得できます。また、グループを追加してグループへユーザーを所属させることも可能です。グループからユーザーリストやユーザーから所属グループを取り出すこともできます。ユーザーをグループ管理者に割り当てることもできるようになりました。

https://docs.nextcloud.com/server/latest/admin_manual/configuration_user/user_provisioning_api.html

## 2. WebDAVクライアントAPI

主にWebDAVに関するAPIです。ファイルのアップロード・ダウンロードが可能です。Nextcloudで拡張されているゴミ箱や履歴についても表示できるAPIがあり、いくつかファイルに関する検索も可能です。

https://docs.nextcloud.com/server/latest/developer_manual/client_apis/WebDAV/index.html

## 3. ファイル共有API

古くからあるAPIですが、ファイル・フォルダーの共有と解除、URL共有のURL発行ができます。共有先を指定したり、共有ファイルの権限(編集や削除)を指定します。最近は、クラウド連携(別のNextcloudとの連携)での共有も可能なりました。

https://docs.nextcloud.com/server/latest/developer_manual/client_apis/OCS/ocs-share-api.html

## 4. LDAP設定API
LDAP設定を追加、編集、削除できるAPIです。あまり、ユースケースを思いつきませんが、ログインフィルターやグループフィルターを頻繁に修正する事がある場合は便利かもしれません。

https://docs.nextcloud.com/server/latest/admin_manual/configuration_user/user_auth_ldap_api.html

## 5. Notification API
Webブラウザー上の画面で通知ポップアップを出す機能のAPIです。元々、Notification というアプリがありますが、その機能の拡張になります。このアプリはモバイルアプリとも連携していて、このNotification APIで通知した場合モバイルアプリ側でも通知がPushで送信されたものを受信できます。ファイルActivityとは違う機能です。

https://github.com/nextcloud/notifications/blob/master/docs/ocs-endpoint-v2.md

# 3. まとめ
NextcloudはownCloud時代から企業ニーズに応えて発展してきて、APIも充実してきました。やはり、外部システムとの連携というのは何かGlueを使ってプログラミングレスで動かせると便利なのでAPIが必要だと思います。

できればいいなと思っている機能は、Nextcloudのタグ機能のタグの追加削除を外部からAPI経由で追加する機能です。
タイミングがあれば、Nextcloudにリクエストしてみたいと思います。

# 4. 参考URL

Nextcloud API一覧 | Nextcloud日本公式サイト

https://nextcloud.stylez.co.jp/api
Nginx起動時に重複している設定がないのに「"xxx" directive is duplicate」と言われるときに確認すること

## 現象
Nginx起動時に重複している設定がないのに次のように怒られてNginxが立ち上がらない場合があります。

```
-- Unit nginx.service has begun starting up.
Mar 25 00:26:37 hoge nginx[1742]: nginx: [emerg] "proxy_buffer_size" directive is duplicate in /etc/nginx/conf.d/rproxy.conf:9
Mar 25 00:26:37 hoge nginx[1742]: nginx: configuration file /etc/nginx/nginx.conf test failed
Mar 25 00:26:37 hoge systemd[1]: nginx.service: Control process exited, code=exited status=1
Mar 25 00:26:37 hoge systemd[1]: nginx.service: Failed with result 'exit-code'.
Mar 25 00:26:37 hoge systemd[1]: Failed to start A high performance web server and a reverse proxy server.
-- Subject: Unit nginx.service has failed
-- Defined-By: systemd
-- Support: http://www.ubuntu.com/support
```

Grepで重複した設定項目があるか確認しても、重複が見当たりません・・・。

```
# grep -R "proxy_buffer_size" /etc/nginx/*
./conf.d/rproxy.conf:proxy_buffer_size       1m;
```

## 原因と対応
includeが重複していることでこのような問題が起こる場合があります。
以下の例の場合、```include /etc/nginx/conf.d/*.conf;``` が重複しています。
2行記載されているinclude設定のうち、1つを削除することで本問題は解決します。

```
##
# Virtual Host Configs
##

include /etc/nginx/conf.d/*.conf;
include /etc/nginx/sites-enabled/*;
include /etc/nginx/conf.d/*.conf;
```
Paiza エンジニアが死滅した世界　B問題「砂漠の公園」テストコード

# エンジニア死滅
https://paiza.jp/botchi/challenges/botchi_b_2002

文字通りのテストコード
入力値を手元に持ってきたときに、空白を含んでいたのをそのまま実行してしまい、ひとつめ以降のテストが出来なかったのに気付かないまま、ずっと悩んでいたことが今回のハイライト

# 問題文
>この公園ではある競技の大会がよく開催されていました。各試合結果の記録が見つかりましたが、どのチームが優勝したかの記録は欠損しています。 
そこで各試合結果から優勝チームを調べるプログラムを作成することにしました。
大会は勝ち点方式の総当り戦で行います。勝つと2点、引き分けで1点、負けると0点勝ち点が増えます。 
すべての試合が終わったあと、勝ち点が一番多いチームが優勝です。
大会の参加人数と、試合結果が入力されたときに、何番目のチームが勝ち点いくつの何勝何敗何引き分けで優勝したか出力するプログラムを書いてください。

出力
>何番目のチームが優勝したかを表す数字 s、優勝したチームの勝ち点 t、勝った回数 W、引き分けた回数 D、敗けた回数 L をスペース区切りで出力

優勝者は必ず一人

# テストコード
```砂漠の公園_spec.rb
require 'spec_helper'

RSpec.describe Desert_park do
  describe '何番目のチームが勝ち点いくつの何勝何敗何引き分けで優勝したか' do
    it '例一' do
      result = Desert_park.new.competition(match_results: 3, the_number_of_participants: '-DLD-DWD-')
      expect(result).to eq '3 3 1 1 0'
    end

    it '例２' do
      result = Desert_park.new.competition(
      # チーム数
      match_results: 10,
      # トーナメント表を一つの文字列にしました
      the_number_of_participants: '-WLDWWDWWWL-WDWWWLWWWL-LWWLWWDDDW-WWDWWWLLLL-LLLWWLLLLW-WLLLDLWDWL-WLWLWLLWWL-WWLLLLLWWL-WLLDLLWLLL-'
)
      expect(result).to eq '4 15 6 3 0'
    end
  end
end
```

# テスト対象
勝ったチームの番号と、勝ち点を出したい。
さらに悪趣味なことに、勝ち負け引き分けの数も出力しろとのこと。

```砂漠の公園.rb
class Desert_park

    def initialize
        @max_team_name = 0      #一番多く得点取ったチームの番号
        @max_victory_point = 0  #そのとき一番多いポイント
        @result = ''            #勝敗の文字列を入れておいて後でその数を取り出して出力
    end

    def competition(match_results:, the_number_of_participants:)
      tema_name = 1
      team = ''
      victory_point = 0
      the_number_of_participants.split('').each_with_index do |result, index|
        index += 1
          if result == "W"
            team += result
            victory_point += 2
          elsif result == "D"
            team += result
            victory_point += 1
          elsif result == "L"
            team += result
          end

          if index % match_results == 0 && index >= match_results
            if @max_victory_point < victory_point
              @max_team_name = tema_name
              @max_victory_point = victory_point
              @result = team
              team = ''
              victory_point = 0
              tema_name += 1
            else
              team = ''
              victory_point = 0
              tema_name += 1
            end
          end
      end
      "#{@max_team_name} #{@max_victory_point} #{@result.count('W')} #{@result.count('D')} #{@result.count('L')}"
    end
end
```


見てくれてありがとう
最近、初音ミクに、どハマりしました。

## 最後に
変数への説明にコメントつけてしまっていることに気づきました