OmniAICreator/Qiita-1.07M huggingface dataset:
Yokohama.rb #103 の実装例

問題の名前 : マスクしても同じ数
問題 : http://nabetani.sakura.ne.jp/yokohamarb/103mask/
実装リンク集 : https://qiita.com/Nabetani/items/35e83eb39fed3c75d586

で。

地味な問題。

Yokohama.rb なので、ruby による実装例：

```ruby
# frozen_string_literal: true

require "minitest/autorun"
require "json"

class MaskedNumbers
  def initialize(mask)
    @mask = mask
    @digits = @mask.digits(2)
    @count = @mask.to_s(2).gsub("0", "" ).to_i(2)
  end

  private 
  def expand(i)
    d0 = i.digits(2)
    d = @digits.map{ |e| e==1 ? (d0.shift||0) : 0 }
    d.reverse.join.to_i(2)
  end

  public
  def first(n)
    (1..@count).take(n).map{ |i| expand(i) }
  end

  def last(n)
    @count.downto(1).take(n).map{ |i| expand(i) }.reverse
  end
end

def solve( src )
  m = MaskedNumbers.new(src.to_i(16))
  nums = m.first(15+1)
  if 15<nums.size
    [nums.take(13).join(","), m.last(2).join(",")].join(",...,")
  else
    nums.join(",")
  end
end

if ! ARGV[0] || ! File.exist?( ARGV[0] )
  raise "you should specify json file as ARGV[0]"
end

class TestYokohamaRb103 < Minitest::Test
  json_string = File.open( ARGV[0], &:read )
  data = JSON.parse( json_string, symbolize_names:true )
  data[:test_data].each do | number:, src:, expected: |
    define_method( :"test_#{number}" ) do
      actual = solve(src)
      assert_equal( expected, actual )
    end
  end
end
```

Minitest の経験がないので、Minitest としてこれが正解なのかどうかよくわからない。

それはさておき。

例えば mask が2進数で `10001001` なら、mask 適合な数は、mask の`1` がある場所にしか1がない数。つまり、2×2×2=8 通り...かと思いきや、0 を含めないので 7通りしかない。
パターンとしては、2進数の `001` 〜 `111` に対応する。
であれば、`001`〜`111` を数え上げ、
2進数の `xyz` を 2進数の `x000y00z` に変換する関数があれば、それでよい。それが `MaskedNumbers#expand` 。

expand さえできれば、あとは 1〜16 を expand して、15個までしか作れなかったらそれを `join` して終了。

16個以上ある場合。
マスク適合な数は ( 2**(2進数表示の1の数) -1 ) 個だとわかるので、末尾をとることもできる。
あとは `join(",")` したものを `join(",...,")` すればよい。

というもの。
SwiftのDelegateの解説記事を読んでも理解できなかった。だから自分で解釈しなおした。

# TL;DR
`Delegate`とは、**『こういう時にこうしたい』という処理のうち、『こういう時』を先にまとめてくれているもの**です。

# はじめに
`Delegate`の解説記事をいくつか読んだ。
実装を元に処理を委任する、されるなどの説明がなされていたが、正直わからなかった。
さらに、初学者であるため見間違いかもしれないが、実装の方法を逆にしている記事などもあった。

**考えているうちに、処理を委任する、される、という考え方が自分に合ってなかったことがわかった。**

本記事は、このような様々なDelegateの解説記事を読んでも謎が残ったままの人のための記事です。

# つまりDelegateをどう解釈するのか
**『こういう時にこうしたい』という処理のうち、『こういう時』を先にまとめてくれているもの。**

処理を委任する側、される側、そしてプロトコルという言い方はわかりにくい。
僕は最初、委任する側を`View Controller`などに書いていくのかと思っていた。逆だった。
多分、「委任する」という言い方が悪かったのだと思う。

例えば`UITableviewDelegate`について考え、
『Swiftのstoryboardから`UITableView`をある画面にセットし、`ViewController.swift`に`UITableView`の参照を渡した』
状態を現状だとする。


(実際はtableViewCellが絡む話だが、一旦Tableviewに内包されていると仮定して話を進めると、)
これに対して、Delegateがない状態で『あるセルをタップした時、ある処理を行いたい』と考える。すると、

```swift
if (セルをタップ) {
  選択された列 = ~
  選択された列を元にした処理
  ...
```

大体こんな感じの処理を書くことになるだろう。
そしてさらに『あるセルの選択状態を解除した時、ある処理を行いたい』
などの処理をどんどん書いていくことになるだろう。

するとどうなるか。コードが混沌となる。
具体的には、どのメソッドがどの時にどう発火するのかなどがわからなくなる、などが挙げられるだろう。
そうすることによって、**コードとしての一貫性をうみにくく、汚いコードとなってしまう。**

**だから、『こういう時こうしたい』のうち、『こういう時』のみを取り出して先に定義してくれているのが、ViewControllerなどで継承している`delegate`である。**
サンプルコードなどを写経した人ならわかると思うが、自動補完では下の画像のような多くのメソッドが並ぶであろう。
これらのメソッドの引数が『こういう時』を表している。

![スクリーンショット 2019-06-15 19.29.40.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/190157/d33415b2-c0f0-713b-d9f5-760980ce456a.png)

ここまで理解できればもう大体は理解できたも同然で、次に、
『さらにコードを見やすくするためにはどうするか』を考える。すると、上の画像にあるように、
『引数だけが違っていて、メソッド名が同じ』なら、どのイベントで何が発火するのかが一目でわかるようになる。

だから、`viewDidLoad`の中に、 `tableView.delegate=self`として、『自分が実際の処理を担当しますよー』ということ、つまり**tableViewメソッドの第一引数である`tableView`には、この`ViewController`クラスにある`UITableView`インスタンスが入りますよーということを表明している**。

おそらくこれを、『委任される側』と表現してるのであろうが、どっちかというと自分から『取ってきている』ように思えるので、理解が難しかったのだと思う。

# おわりに

私は委任する、されるというよりも、**抽象だとか『この時』をまとめる**などの方が概念的に理解しやすかったので、書いてみた。
おそらく、私自身Swiftの言語仕様すらまだ危うい状態なので、細かい点で間違っている部分はあると思いますが、大枠は掴んでいただければと思います。
ZendFramework メモ (2)  

# 目的
業務効率化

# ゴール
ZendFramework(以下ZF) を使ってphtmlとcss、jsが使えるまで

# 対象
業務でZFがすぐにでも使いたい

# ZF1 のおさらい
## phtmlとCSS, JSの連携
### アクションコントローラ [application/controllers/IndexController.php] 
```PHP
<?php
require_once 'Zend/Controller/Action.php';

class IndexController extends Zend_Controller_Action
{
    public function init()
    {
        $this->view->setEncoding('sjis');
        $this->view->title = 'タイトル';
        $this->_helper->layout->setLayout('layout01'); // レイアウトスクリプト指定
        $this->_helper->layout->header = $this->view->render('index/header.phtml');
    }
    public function indexAction()
    {
        // index/index.phtmlの内容は、レイアウトスクリプト側から
        // $this->layout()->contentで値参照できるようになります
    }
    public function changelayoutAction()
    {
        // index/changelayout.phtmlの内容は、レイアウトスクリプト側から
        // $this->layout()->contentで値参照できるようになります

        $this->_helper->layout->setLayout('layout02'); // レイアウトを変える

        // レイアウトスクリプト側から$this->layout()->contentで参照される値を
        // index/content02.phtmlの内容に切り替える
        $this->render('content02');
    }
}
```
「$this->_helper->layout」とすることでフロントコントローラで作成したレイアウトオブジェクトにいきなりアクセスできるようになっています。
これはアクションヘルパーが助けてくれているのでできることですが、もし別の方法でレイアウトオブジェクトを取得するとしたら

```PHP

$layout = Zend_Layout::getMvcInstance();
```
を使うことになる。

### ビュースクリプト [application/views/scripts/index/index.phtml] 

```HTML 
<div class="content">indexアクションのコンテンツ</div>
```
この内容が丸々レイアウトスクリプトのメンバ変数「$this->layout()->content」位置に置き換えられることになります。

下参考リンクへ


# デバッグ実行について

1: ビルドインサーバー起動

```PHP
$php -S 192.168.0.0:8080 -t public/
```
2: ブラウザでURLを叩く
3: [1]で叩くと正常、異常などの内容が見れる

## 補足
-t で DocumentRoot を指定
デフォルトではコマンドを実行したカレントディレクトリが DocumentRoot になります。「-t」を付けると任意のディレクトリを DocumentRoot に変更できます。

### ビルトインサーバの利点
手軽るにブラウザ確認できる

新たに環境構築が必要な場面で Apache に VirtualHost を追加したりせずともビルトインサーバを使えば、すぐに任意のディレクトを DocumentRoot にして Web サーバを起動することができます。

### ビルトインサーバ停止
Ctrl-C を押す


# 参考
1: zendframework layout 使い方
[https://codezine.jp/article/detail/3339](https://codezine.jp/article/detail/3339)
[http://doremi.s206.xrea.com/zend/ref/zend_layout.html](http://doremi.s206.xrea.com/zend/ref/zend_layout.html)
[https://blogs.yahoo.co.jp/dk521123/24269539.html](https://blogs.yahoo.co.jp/dk521123/24269539.html)
[http://pentan.info/php/zend_fw/view.html](http://pentan.info/php/zend_fw/view.html)

2: composer インストール （ZF2から利用）
[https://weblabo.oscasierra.net/php-composer-centos-install/]
(https://weblabo.oscasierra.net/php-composer-centos-install/)

3: zend framework インストール 
[https://framework.zend.com/downloads/skeleton-app](https://framework.zend.com/downloads/skeleton-app)

# 次回
ZF2について
Yokohama.rb #103 の問題

第103回 yokohama.rb ( https://yokohamarb.doorkeeper.jp/events/91907 )で問題を出しています。

問題は「マスクしても同じ数」という名前で、詳細は
http://nabetani.sakura.ne.jp/yokohamarb/103mask/
です。

実装ができた方はこちらのコメント欄からリンクを張っていただくと見つけやすくて助かります。

似たような問題をもっと解きたいという方は、
https://nabetani.hatenadiary.com/entry/yhpg_list
に別のイベントで出していた問題のリンク集がありますので、そちらをご覧になると良いと思います。
Tiny YOLOとYOLOv3-tinyに関する僅かな情報

#目的
ここに記載するのは、すごくわずかな情報です。
「Tiny YOLO」とか「YOLO Tiny」という言葉を聞くことがあるが、ご存じのとおり、一種類でないです。
念のため、本家darknetの記載を確認した。

#「Tiny YOLO」と「YOLOv3-tiny」
おそらく、本家の開発者は、それほど、言葉を使い分けているわけではないと思うが、
darknetのサイトでの記載では、以下のようになっている。

（出典： https://pjreddie.com/darknet/yolo/  )


<img width="412" alt="tiny.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/342207/8262152a-fa95-5fa4-18c1-06da3f8bb6c1.png">


　↑↑　上記にあるように、少なくとも２つある。YOLOv2でのtinyと、YOLOv3でのtiny。
前者が「Tiny YOLO」、後者が「YOLOv3-tiny」という名称で記載されている。
これは、ここで、そう書き違えているだけかも？？？（こだわりがあるとは思えない。）

|モデル|Convolutionのレイヤ数|備考|
|:---:|:---:|:---:|
|YOLOv2|18|※1|
|Tiny YOLO|7|※1|
|YOLOv3|52|※1|
|YOLOv3-tiny|7|※1|
※1 資料上は、もう1層多いことになっている。cfgファイルで数えるとこの表の数字になる。
　　数え方を1つ、ワタシが間違えている可能性大。


#まとめ
「Tiny YOLO」と「YOLOv3-tiny」、少なくともtinyものが２つある。
いずれのtinyも、Convolutionのレイヤ数が、かなり少ないです。
逆に、YOLOv3のConvolutionのレイヤ数はかなり多いです（50以上）。

#この項までの記載でわかっていなかったこと *
（*この項は、すべて、2020/4/6以降の追記）

・「数え方を1つ、ワタシが間違えている可能性大」（上記抜粋）
⇒どうも、**(全)結合層とかも数えるのが、**普通だということがわかっていなかったよう。

・**darknet-53が意味する範囲と、yolov3等のyolov3全体が意味する範囲**がわかっていなかったよう。

#darknet-53の層数の数え方　* 
（*この項は、すべて、2020/4/6以降の追記）

**論文の図の右側に、赤い文字で、層数を数えた結果を示す。**
Convolutional **52層**に、結合層1層で、**計53層**。

引用元：https://pjreddie.com/media/files/papers/YOLOv3.pdf
<img width="346" alt="darknet-53.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/342207/c990ecec-55c3-adab-1c7c-a40b8900d46d.png">

# darknet-53とyolov3の違い *
（*この項は、すべて、2020/4/6以降の追記）

darknet-53自体は、通常の物体認識のネットワークになっているのでは？
yolov3という場合には、下図のように、darknet-53をベースとして、もう少し、ごちゃごちゃした
ネットワークがついている。

（引用元：https://towardsdatascience.com/yolo-v3-object-detection-53fb7d3bfe6b）
<img width="641" alt="yolo_network.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/342207/18726055-7ae7-df55-5dbd-15c322135e68.png">

※↑　yolov3などの論文には、このようなわかりやすいネットワークの図はありません。

#関連論文 *
（*この項は、すべて、2020/4/6以降の追記）
https://arxiv.org/pdf/1506.02640.pdf
https://pjreddie.com/media/files/papers/YOLOv3.pdf

#関連（本人）

[DNNのモデル毎の処理量(GOP)をまとめる](https://qiita.com/enoughspacefor/items/83a9eac69f6209daf424)

[良書 「GPUを支える技術　超並列ハードウェアの快進撃[技術基礎]」を読む](https://qiita.com/enoughspacefor/items/31e9461b6a07b484b643)

[文献『From Model to FPGA: Software-Hardware Co-Design for Efficient Neural Network Acceleration』を読む](https://qiita.com/enoughspacefor/items/7de477dc3c1a50d36f2e)

#今後
適宜、情報を足します。
コメントなどあれば、お願いします。:candy:
今日の学び20190615。仮説(107)

# 学び１　大事なことはやっていること
ある作業判定の場面で、
＊＊＊がない
＊＊＊が伝わっていない
など否定的な側面しか見ない、役に立たない人たちがいた。

つぼっちが、
だれかがどうにか手をまわして対応していればいいんじゃない。
って助言してた。

ものを作っている責任を持っている人は、大事なことがよくみえているなと思った。

何かがないこと、何かをしらせてないことなんかどうでもいい。

何かがあること、うまくいっていることが大事。

大事なことをみなくて、どうでもよいことばっかり議論している人たちは、自分のやっていること自体が無駄だと自覚をしていない。
# 学び２　プロセスモデルは関係ない
社会事象は、どんなプロセスモデルであっても、視点が違うだけで、関係ない。

1980年代に最初に国際会議に出た際に、
どんなモデルを使っても、
能力のあるアセッサなら同じことを発見する。

というアセッサの能力だけに依存することを教えてもらった。
その後、その命題に矛盾する事象に遭遇したことはない。

能力のない人は、モデルの違いにこだわることは経験則。
# 学び３　質問の仕方
「お二人は姉妹ですか？」

女性の２人が似ていて、親子かなと思ったら、まず質問する方法。

答えが欲しい場合に、その答えが一番得やすい質問するのが基本。
# 学び４　優先順位（一番欲しいものだけに言及）
注文した料理が帰りがけに来ていなかったものがある。

あれが来てない、これが来てないとあげつらうのは無駄。

その時点で、一番欲しいものをまず欲しいという。

優先順位をつけるのは、技術者の基本。

何が正しいかを主張するのは役に立たない人。
# 学び５　心理ではなく行動
誰が、何をどう考えている。
誰の言っていることは間違いとか。

人の心理に関することをあげつらうのは無駄。

その人がどういうコードを書いたかだけが大事。

>「白いネコでも黒いネコでもネズミを取ってくるのがいいネコだ」
http://www.awahei.com/hitorigoto/sin-tyuugoku.htm

Ethernet 記事一覧　Ethernet(0)
https://qiita.com/kaizen_nagoya/items/88d35e99f74aefc98794

Wireshark 一覧 wireshark(0)、Ethernet(48) 
https://qiita.com/kaizen_nagoya/items/fbed841f61875c4731d0

線網（Wi-Fi）空中線(antenna)(0) 記事一覧(118/300目標)
https://qiita.com/kaizen_nagoya/items/5e5464ac2b24bd4cd001

C++ Support(0)　
https://qiita.com/kaizen_nagoya/items/8720d26f762369a80514

Coding Rules(0) C Secure , MISRA and so on
https://qiita.com/kaizen_nagoya/items/400725644a8a0e90fbb0

Autosar Guidelines C++14 example code compile list(1-169)
https://qiita.com/kaizen_nagoya/items/8ccbf6675c3494d57a76

Error一覧(C/C++, python, bash...) Error(0)
https://qiita.com/kaizen_nagoya/items/48b6cbc8d68eae2c42b8

なぜdockerで機械学習するか 書籍・ソース一覧作成中 (目標100)
https://qiita.com/kaizen_nagoya/items/ddd12477544bf5ba85e2

言語処理100本ノックをdockerで。python覚えるのに最適。:10+12
https://qiita.com/kaizen_nagoya/items/7e7eb7c543e0c18438c4

プログラムちょい替え（0）一覧:4件
https://qiita.com/kaizen_nagoya/items/296d87ef4bfd516bc394

一覧の一覧( The directory of directories of mine.) Qiita(100)
https://qiita.com/kaizen_nagoya/items/7eb0e006543886138f39

プログラマが知っていると良い「公序良俗」
https://qiita.com/kaizen_nagoya/items/9fe7c0dfac2fbd77a945

小川清最終講義、小川清最終講義（再）計画, Ethernet(100) 英語(100) 安全(100)
https://qiita.com/kaizen_nagoya/items/e2df642e3951

行動主義は実践主義の基本。アメリカだけでなく中国の発展もこの原理かも。
### 文書履歴(document history)
ver. 0.01 初稿 20190615
ver. 0.02 標題追記 20190623
### 最後までおよみいただきありがとうございました。
いいね　💚、フォローをお願いします。
Thank you very much for reading to the last sentence.
Please press the like icon 💚　and follow me for your happy life.
UnityのプロファイラのGPU Usageで「GPU profiling is not supported by the graphics card driver. ～」とエラーが出たときの対処法

##概要

![GPUerror2.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/254028/02b6dde5-591a-5681-3031-35ff2baabc1a.jpeg)

UnityのプロファイラでGPUの処理負荷を確認しようとして、GPU Usageを開いたときに、
「GPU profiling is not supported by the graphics card driver. Please update to a newer version if available.」
と出て、グラフが表示されなかったときの対処法です。
＃今回、私はUnity2019.1.6f1で起こりましたが、それ以前のバージョンでも同様にこのエラーは発生するようです。

##対処法

エラーに書かれている通りにGPUのドライバーを最新にしたのに、まだエラーが出続けてしまう、というときは、
Player Settings の Other Settings のところにある
Graphics Jobs(Experimental)* のチェックボックスを確認して、ここをオフにします。
（Unity2019.1.6.f1のプロジェクトをHDRPで作成すると、ここのチェックボックスはデフォルトでオンになっています）

![GPUerror__3.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/254028/5920ec6f-1800-bad8-69bf-1c358e4c70ac.jpeg)

私の場合、これでちゃんとプロファイラの「GPU Usage」が見られるようになりました。
![GPUerror_.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/254028/08b0ad34-0c16-c1d8-4a1d-c31eb8488c30.jpeg)



##最後に
Unityのマニュアルの「GPU プロファイラー」のページを見ると、その件については書かれているのですが、
（そこの部分の文章だけ何故か英語のまま。。2019/6/15現在）
エラーメッセージで指示されている内容と実際の対処法が異なっているので、ここに覚え書きとして残しておきました。

https://docs.unity3d.com/ja/current/Manual/ProfilerGPU.html
![GPU Profiler_.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/254028/bf47bd01-2f52-ba25-11f0-6063d186d951.jpeg)
ActiveRecord で Validation 実行前にエラーを記録できるモジュールを作った

モデルクラス内でサービスクラスを利用する際にサービスクラスで発生したエラーをどうビューにまで持っていくのが一番いいのかなーと考えた

## 状況説明

下記の様なモデルがある時

```ruby:app/models/person.rb
class Person < ApplicationRecord
  def complex_logic
    Person::ComplexLogicService.call(self)
  end
end
```
complex_logic は複雑で、外部APIなどにも接続する必要があるためその処理をサービスクラス`Person::ComplexLogicService` に外出ししている。

その `Person::ComplexLogicService` で `fail` することがあるとする。

```ruby:app/services/person/complex_logic_service.rb
class Person::ComplexLogicService
  def self.call(person)
    fail ArgumentError, "既に退会しているユーザーに複雑な処理は行えません" unless person.active?
  end
end
```

`Person#complex_logic` はビューからも呼ばれる処理なので、`fail` しては困るのでエラー処理を加える。

```ruby:app/models/person.rb
class Person < ApplicationRecord
  def complex_logic
    Person::ComplexLogicService.call(self)
  rescue ArgumentError => err
    errors.add(:base, err.message)
  end
end
```

たが、このままではコントローラークラスで`#save`をした時に、Validation が実行されて`#errors`の内容がリセットされてしまうので、エラーにならない。

そもそもValidationはモデルの状態変化に応じて`#valid?`,`#invalid?`出来る様になっているため、`#errors`は直前の`#valid?`の結果しか保持しない仕様。

## 解決策

と言うことで、エラー内容を一旦別のインスタンス変数に格納し、Validation 実行時にそのエラー内容を`#errors.add`するモジュールを Concern で作成した。

```ruby:app/models/concerns/static_error.rb
# モデルの状態に関連しない Validation Error エラーを発生させるために使用します。
#
# @note エラー内容はデータベースには保存されないため、{#reload} などを行うと消えます。
# @note include すると下記のメソッド、インスタンス変数が追加されます
#   - @static_errors
#   - add_static_error
#   - clear_static_error
#   - check_static_errors (private)
#
# @example
#   class Model < ApplicationRecord
#     include StaticError
#   end
#   model = Model.new
#   model.add_static_error(:base, "このモデルは保存できません")
#   model.valid? #=> false
#   model.errors.messages #=> {:base=>["このモデルは保存できません"]}
module StaticError
  extend ActiveSupport::Concern

  included do
    validate :check_static_errors
  end

  # @overload add_static_error(attribute, message = :invalid, options = {})
  #   @param attribute [Symbol]
  #   @param message [Symbol]
  #   @param options [Hash]
  def add_static_error(*args)
    @static_errors = [] if @static_errors.nil?
    @static_errors << args

    true
  end

  # {#add_static_error} で追加されたエラー内容を削除します
  def clear_static_error
    @static_errors = nil
  end

  private

  def check_static_errors
    @static_errors&.each do |error|
      errors.add(*error)
    end
  end
end
```

実際使用する場合はこんな感じ

```ruby:app/models/person.rb
class Person < ApplicationRecord
  include StaticError

  def complex_logic
    Person::ComplexLogicService.call(self)
  rescue ArgumentError => err
    add_static_error(:base, err.message)
  end
end
```

これで `#valid?`を何度実行しても`false`が返り、`save!` した場合には `ActiveRecord::RecordInvalid` が発生するので、ビュー以外のバッチ処理などで実行した場合もちゃんとエラーになる。

ただ、通常の Validation と動きが変わるので、乱用するとエラーが解消できず困って`#clear_static_error` を乱用する様なことになる可能性もあるので、ご利用は計画的に。

## 参考文献

* [active recordでvalidation前にerrors\.addしていてもvalid?の結果がfalseにならない \- Qiita](https://qiita.com/takady/items/c0c57001026313791833)
Vimでウィンドウを出るときに明かりを消す

バクダンくんだよ。
最近のVimのアップデートのおかげで簡単に非アクティブウィンドウを暗くすることができたから紹介するよ。

こんなかんじ↓
![qiita.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/42867/3d292978-01be-87b0-e919-8cb545e86f8e.gif)


# 解説

Vimでは通常のテキストや背景は[`Normal`](https://vim-jp.org/vimdoc-ja/syntax.html#hl-Normal)ハイライトグループが決定しているよ。
ハイライトグループは全ウィンドウで共有なので、今まで通常のテキストや背景は全ウィンドウで同じ色が使われていたけど、最近のアップデート（[8.1.1391](https://github.com/vim/vim/commit/4d784b21d14fc66e98a2b07f70343cdd4acd62aa)）でウィンドウごとに`Normal`の代わりに使うハイライトグループを指定できる[`'wincolor'`](https://vim-jp.org/vimdoc-ja/options.html#'wincolor')オプションが追加されたよ。

`'wincolor'`は元々ポップアップウィンドウの背景を指定するために作られたオプションっぽいけど、普通のウィンドウでも普通に使えるので、以下のような設定をvimrcに書くだけでカレントウィンドウ以外を暗くすることができちゃうのだ。

```vim
" 色はお使いのカラースキームに合わせて変えてちょ
autocmd ColorScheme * highlight NormalNC guifg=#a0a0a0 guibg=#121212
autocmd WinEnter,BufWinEnter * setlocal wincolor=
autocmd WinLeave * setlocal wincolor=NormalNC
```

みんなも部屋を出るときは明かりを消して節電しよう。


# なお

* terminalウィンドウには効かないよ。
* ハイライトされている文字の色は変わらないよ。
* 一応今までも同じようなことを（半ば強引に）実現するプラグイン（[vim-diminactive](https://github.com/blueyed/vim-diminactive)）はあったみたい。
* Neovimは`NormalNC`を指定するだけでできちゃうよ。なんだって？
[Rails]Vue インスタンス内で js ファイルを読み込みたい

`Webpacker`と`yarn`と`slim`を利用。
普通にやるとこんな感じでエラーがでる。

```
Templates should only be responsible for mapping the state to the UI. Avoid placing tags with side-effects in your templates, such as <script>, as they will not be parsed.
```

`vue-script2`を使うと簡単にできる。


- `vue-script2`をインストール

```bash
yarn add vue-script2
```

- `javascript/packs`下に`js`ファイルを置く

```javascript/packs/hello.js
console.log("hello")
```

- `<script2>`タグを使って呼び出し

```layout/application.html.slim
- path = asset_pack_path 'hello.js'
script2 src="#{path}"
```
[Python3]正弦波画像を表示するプログラム

# はじめに
正弦縞画像はコントラスト感度の測定といった知覚実験のテスト刺激として用いられる。画像ソフトで作成することもできるが、プログラムで実装した方が画像の周波数等を計算しやすく便利であると考えられる。そこで、本記事では正弦縞画像を作成するプログラムを掲載する。正弦縞画像を作成するプログラムに関しては、私個人が検索した限りでは情報量が少なかったため、この投稿が役に立てば幸いである。

# ソースコード

以下に作成したソースコードを示す. 日本語で手順を簡単に示す
１：サイン波を描画する. このとき振幅を255とするのがポイント.
２：この時点ではマイナス値が出てしまうので, 底上げをする(offset).
３：こうしてできたサイン波の縦軸の値を画素値とする.
以上である. 出力は以下となる. 例えばコントラスト感度を計測したい場合は, 下のプログラムで周波数を変えれば良い.
<img width="350" alt="SinImage.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/285948/1b000bba-4285-0267-77cf-1c9cbef86fcd.png">

```python
import numpy as np
import matplotlib.pyplot as plt
from PIL import Image

#キャンバス生成
Width  = 512
Height = 512
img = Image.new("RGB", (Width, Height))

#各パラメータの定義
Amp    = 255.0        #振幅
T      = 32.0       #周期
f      = 1.0 / 32.0 #周波数
sec    = 1          #サンプリング時間
f_s    = 1000       #サンプリング周波数
offset = 255        #sin波を0から255の間で描画するため.

#輝度値
Brightness=[]
for t in np.arange(f_s * sec):
    y = Amp * np.sin(2.0 * np.pi * f * t) + offset
    y = y / 2
    Brightness.append(y)

#出力画像の設定.
plt.grid(True)
plt.xlabel('t', fontsize = 15)
plt.ylabel('Brightness', fontsize = 15)
plt.plot(Brightness[0:100], color = 'red')
plt.show()

#画素の書き換え.
for x in range(Width):
    for y in range(Height):

        #putpixcelの引数が整数のみなので,四捨五入して整数化した.
        r = int(round(Brightness[x]))
        g = int(round(Brightness[x]))
        b = int(round(Brightness[x]))

        img.putpixel((x,y),(r,g,b))

#正弦縞画像の表示
plt.imshow(img)
plt.tick_params(labelbottom=False, labelleft=False, labelright=False, labeltop=False)
plt.tick_params(bottom=False, left=False, right=False, top=False)
plt.savefig('SinImage.png', bbox_inches="tight",dpi=300)
plt.show()
```
Map#computeIfAbsentでいろいろ混乱した話

Map#computeIfAbsentはJava8で追加されたメソッドで、かれこれ５年も経ってるのに、知ったのは１年ほど前でした。

```java
V computeIfAbsent(K key, Function<? super K,? extends V> mappingFunction)
```
keyに該当する値が存在しない場合は、mappingFunctionが呼び出され、その戻り値がMapに格納されて返却してくれます。

## ConcurrentHashMap
あるWebシステムでデータをキャッシュする処理を実装するにあたり疑問が湧きました。

```java
private Map<String, String> cache = new ConcurrentHashMap<>()

public String get(String id) {
  return cache.computeIfAbsent(key, key -> {
    if (/* キーに該当する外部ファイルが存在する */) {
      // ファイルを読み込んで返却
      return readData;
    }
    // 該当するファイルがない
    return null;
  });
}
```
ConcurrentHashMapは値にnullが持てないのに、nullを返却して大丈夫なんだろうか?
ということでテストコードで実験してみました。

```java
Map<String, String> map = new ConcurrentHashMap<>();
String ret = map.computeIfAbsent("test", key -> null);
System.out.println(ret);
```
実行結果は例外が発生することもなく、戻り値はnullでした。
これは[Javadoc](https://docs.oracle.com/javase/jp/8/docs/api/java/util/concurrent/ConcurrentHashMap.html#computeIfAbsent-K-java.util.function.Function-)にもちゃんと書いてありましたね。。。

```
指定されたキーがまだ値に関連付けられていない場合、指定されたマッピング関数を使用してその値の計算を試行し、
nullでない場合はそれをこのマップに入力します。
```

## Kotlin
見ての通り上記はJavaで書いてますが、システム開発も序盤なのでKotlinにコードを書き換えたところコンパイルエラーになりました。Kotlinのバージョンは1.3.31です。

```kotlin
val cache = ConcurrentHashMap<String, String>()

fun get(id: String): String? {
  return cache.computeIfAbsent(id) {
    if (/* キーに該当する外部ファイルが存在する */) {
      // ファイルを読み込んで返却
      return readData;
    }
    return null; // エラー! Kotlin: Null can not be a value of a non-null type String
  }
}
```

KotlinのAPIリファレンスによると[Map.get](https://kotlinlang.org/api/latest/jvm/stdlib/kotlin.collections/-map/get.html)は

```kotlin
operator fun get(key: K): V?
```
とVがnull許容にしてくれているけど、mappingFunctionの戻り値はVのままのようです。
回避策として

```kotlin
val ret: String? = map.computeIfAbsent("test") { null!! }
```
のように!!を付ければコンパイルエラーは解決するものの、実行時にkotlin.KotlinNullPointerExceptionが発生する始末。。。orz

解決策としては

```kotlin
val map = ConcurrentHashMap<String, String?>()
val ret: String? = map.computeIfAbsent("test") { null }
```
**Vを最初からnull許容で宣言する**ぐらいしか判りませんでした。
でも、これだとgetの戻り値がString??なんて変な型にならないかと心配したら流石にそんなこともなく、String?にしたことで今の所不便も見つかってないので、これで正解なのかなぁ。
CentOS7 に Nvidia

自作PCにGPUを装着。
OSがGPUを認識したか確認する。

```
$ lspci
...
01:00.0 VGA compatible controller: NVIDIA Corporation TU102 [GeForce RTX 2080 Ti] (rev a1)
01:00.1 Audio device: NVIDIA Corporation Device 10f7 (rev a1)
01:00.2 USB controller: NVIDIA Corporation Device 1ad6 (rev a1)
01:00.3 Serial bus controller [0c80]: NVIDIA Corporation Device 1ad7 (rev a1)
02:00.0 PCI bridge: PLX Technology, Inc. PEX8112 x1 Lane PCI Express-to-PCI Bridge (rev aa)
03:0c.0 Communication controller: Interface Corp Device 1235 (rev 02)
04:00.0 PCI bridge: PLX Technology, Inc. PEX8112 x1 Lane PCI Express-to-PCI Bridge (rev aa)
05:0c.0 Unassigned class [ff00]: Interface Corp Device 0b61 (rev 02)
07:00.0 PCI bridge: PLX Technology, Inc. PEX8112 x1 Lane PCI Express-to-PCI Bridge (rev aa)
08:0c.0 Unassigned class [ff00]: Interface Corp Device 0e1d (rev 01)
09:00.0 PCI bridge: PLX Technology, Inc. PEX8112 x1 Lane PCI Express-to-PCI Bridge (rev aa)
0a:0c.0 Unassigned class [ff00]: Interface Corp Device 18b1 (rev 01)
```

NVIDIA GeForce RTX 2080 Ti(および、拡張ボード)が認識された。

https://developer.nvidia.com/cuda-downloads?target_os=Linux&target_arch=x86_64&target_distro=CentOS&target_version=7&target_type=runfilelocal

からツールキットをダウンロード。

同じ要領でcuDNNをダウンロード。

tensorflowのcpu版と、gpu版で速度を較べてみる。

```
$ virtualenv --system-site-packages ~/venvs/tensorflow
$ source ~/venvs/tensorflow/bin/activate
$ pip3 install --upgrade tensorflow==2.0.0-beta1
$ time python mnist_cnn.py
...
Test loss: 0.671588164806366
Test accuracy: 0.8431

real	5m22.082s
user	3m17.256s
sys	1m45.836s
```

```
$ virtualenv --system-site-packages ~/venvs/tensorflow-gpu
$ source ~/venvs/tensorflow-gpu/bin/activate
$ pip3 install --upgrade tensorflow-gpu==2.0.0-beta1
$ time python mnist_cnn.py
...
Test loss: 0.8348264614105224
Test accuracy: 0.8277

real	0m46.723s
user	0m32.622s
sys	0m3.193s
```

#### 参考リンク
- https://qiita.com/kazetof/items/941c3463ac452b496d59
- https://qiita.com/kkk627/items/9ab959421804341f215e
- https://takemikami.com/2017/05/15/CentOS7CUDAkerastensorflow.html
- https://attonblog.blogspot.com/2017/12/centos7-cuda-9.html
- https://blog.amedama.jp/entry/2017/03/13/123742
TeraTermのファイル転送で「No such file or directory」と怒られたとき

# やりたいこと
SSH接続しているサーバーからwindowsマシンのローカルにファイルをDLしたい

# 状況
windowsのTeraTermからホストAにSSH接続している。

なお、サーバーの構成上踏み台ホストとしてホストXをかませているので「windows → ホストX → ホストA」の順番で接続している。

ほしいファイルはホストAにある。

# 発生しているエラー
[TeraTermで効率良くファイル転送](https://qiita.com/go-to/items/409e32116213bdf4b1ce)
↑の記事を参考にサーバーからWindowsクライアントにファイルを落とそうとした。
以下は記事からの引用。

>1.TeraTermのメニューの「ファイル(F)」→「SSH SCP」を選択
>2.「TTSSH: Secure File Copy」ウィンドウの下部に、以下のように入力 
>From: 転送したいLinux上のファイルパスを入力 
>To: 保存したいWindows上のパスを入力
>3.「Receive」ボタンをクリック

しかし、エラー。

*No such file or directory*


？？？？？

# 原因と解決策
**踏み台としてホストXを使っていることが話をややこしくしていました。**

ホストAにあるファイルをWindowsクライアントに落としたい場合、一度ホストAからホストXに`scp`でコピーしてからでないといけないのです。

なので、ホストXにいる状態で

```terminal
$ scp /pass/to/file/you/want/@hostA /pass/to/hostX
```

でファイルを「ホストA→ホストX（踏み台）」ににコピーする。

そのあと、先程引用した手順で「ホストX（踏み台）→windowsクライアント」にコピー。
（ここもscpでコマンドからコピーしてもいい）

めでたしめでたし。

Happy ever after.
MacでRubyの環境構築（Homebrew、rbenv）

# はじめに
新しくMacを購入し、Rubyの環境構築を行ったため、メモとして残しておきます。

# Homebrewとrbenv
Homebrewとはパッケージ管理システムのことで、いろいろなパッケージを簡単にインストール等できるようです。
[wikipedia](https://ja.wikipedia.org/wiki/Homebrew_(%E3%83%91%E3%83%83%E3%82%B1%E3%83%BC%E3%82%B8%E7%AE%A1%E7%90%86%E3%82%B7%E3%82%B9%E3%83%86%E3%83%A0))

rbenvとはRubyのバージョン管理ツールで、複数のRubyのバージョンを管理できます。
インストール手順等は以下のサイトに書かれています。
[rbenv](https://github.com/rbenv/rbenv)

# Command Line Toolsのインストール
Homebrewをインストールするために必要なCommand Line Toolsをインストールします。
（インストールされていない場合、Homebrewのインストール内で自動でしてくれるらしいのですが、私は先にインストールしました。）
ストアからXcodeをインストールすれば大丈夫です。

以下のコマンドでバージョンが確認できます。

```
xcodebuild -version
```

# Homebrewのインストール
[macOS 用パッケージマネージャー — Homebrew](https://brew.sh/index_ja.html)
上記のサイト内に書かれているコマンドをターミナルで実行します。

```
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
```

途中で、パスワードが聞かれた場合は、PCにログインしているユーザーのパスワードを入力します。

あとは自動でインストールを行います。

インストールされたかの確認は、以下のコマンドを実行します。
バージョンが表示されたら成功です。

```
brew -v
```

# rbenvのインストール
以下のコマンドを実行します。

```
brew install rbenv
```
インストールが完了したら、以下のコマンドを実行します。

```
rbenv init
```

```
# Load rbenv automatically by appending
# the following to ~/.bash_profile:

eval "$(rbenv init -)"
```

上記のeval〜の一行をホームディレクトリ下の「.bash_profile」ファイルに追記します。
finderで上記のファイルが見つからない場合は、「command+shift+.」を押して隠しファイルを表示します。
追記後にターミナルを再起動するとインストール完了です。
以下のコマンドで確認します。

```
curl -fsSL https://github.com/rbenv/rbenv-installer/raw/master/bin/rbenv-doctor | bash
```
以下のような表示が出ればOKです。

```
Checking for `rbenv' in PATH: /usr/local/bin/rbenv
Checking for rbenv shims in PATH: OK
Checking `rbenv install' support: /usr/local/bin/rbenv-install (ruby-build 20190423)
Counting installed Ruby versions: 1 versions
Checking RubyGems settings: OK
Auditing installed plugins: OK
```

# Rubyのインストール

### Rubyのインストール
以下のコマンドで任意のバージョンのRubyをインストールします。

```
rbenv install "バージョン名"
例：rbenv install 2.5.0
```
インストール後は、以下のコマンドを実行します。

```
rbenv rehash
```
インストール可能なバージョンは以下のコマンドで確認できます。

```
rbenv install -l
```

アンインストールも同様にできます。

```
rbenv uninstall "バージョン名"
例：rbenv uninstall 2.5.0
```

### Rubyの切り替え
以下のコマンドで現在インストールされているRubyが確認できます。

```
rbenv versions
```
以下のように表示され、「*」が付いているものが現在使用されています。

```
* system (set by /Users/"ユーザー名"/.rbenv/version)
  2.5.0
```
以下のコマンドで使用するバージョンを切り替えます。

```
rbenv global "バージョン名"
例：rbenv global 2.5.0
```

```
  system
* 2.5.0 (set by /Users/"ユーザー名"/.rbenv/version)
```

以下のコマンドでRubyのバージョンが確認できます。

```
ruby -v
```
contact form 7 にPOSTで値を渡す

最近の業務の5%くらいは、WordPressで構築されたサイトのバグ修正とか機能追加をやっています。
Contact Form 7 に値を渡す際に、URLパラメーターとして値を渡す記事はたくさんあるのですが、POSTで渡す記事がちゃんとなかったのでメモがてら残します。

```PHP:single.php
// 例えば、single.phpとかに以下を書く
<form action="contact form 7で構築したページのURL" method="post" name="form1">
    <input type="hidden" name="hogehoge" value="渡す値">
    <a href="javascript:form1.submit()">fugafuga</a>
</form>
```

```PHP:function.php
// function.phpに以下を書く
  function my_form_tag_filter($tag){
    if (!is_array($tag)){
      return $tag;
    }

    if(isset($_POST['hogehoge'])){
    $name = $tag['name'];
    if($name == 'hogehoge')
      $tag['values'] = (array) $_POST['hogehoge'];
    }

    return $tag;
  }
  add_filter('wpcf7_form_tag', 'my_form_tag_filter');
```

```
// Contact Form 7内の設定で、以下で取得
[text* hogehoge default:post class:readonly readonly]
```
`hogehoge`と`default:post`以外は、用途に合わせて変更してください。


### 参考
[『ContactForm7』GET/POSTでデータ送受信のメソッド的なもの](https://erimaki-house.com/contactform7-get-post/)
webpacker で asset のパス(path)だけほしい

```erb
<%= asset_pack_path 'calendar.css' %>
# => "/packs/calendar-1016838bab065ae1e122.css"
```

ソースコードは`webpacker`ライブラリのここ。`lib/webpacker/helper.rb`
[GitHub - rails/webpacker: Use Webpack to manage app-like JavaScript modules in Rails](https://github.com/rails/webpacker)
AWS Summit 2019参加セッションリスト

# AWS Summit Tokyo 2019 参加/閲覧セッション

https://aws.amazon.com/jp/summits/tokyo-2019/

# 1日目

### 基調講演
デジタル変革の最前線で選ばれ続けるクラウドへ
～デジタライゼーション時代のカスタマーサクセス～

Amazon Web Service 長崎さん
三菱電機　朝日さん
シナモン　平野さん
ニフティ　前島さん
10時
https://qiita.com/shinonuk/items/6454a23f7b87888ead52

### クラウドで回す監視と運用PDCA
テクニカルアカウントマネージャー 石川さん
12時 A1-01
https://qiita.com/shinonuk/items/f0509ba7a35418a239e7

### AWS環境における脅威検知と対応
ソリューションアーキテクト 藤倉さん
13時 A1-02

### Edge Servicesを利用したDDos防御の構成
ソリューションアーキテクト 中谷さん
14時 B1-03


### ネットワークデザインパターンDeep Dive
ソリューションアーキテクト 益子さん
15時 B1-04


2日目
---

### AWSで実現する攻めのモニタリング
クラウドサポートエンジニア 関山さん
10時 A2-01

### ZOZO Researchの研究活動を支えるSagemaker利用
ZOZOテクノロジーズ 光野さん、中村さん 
12時 J2-03 

### Kubenetes 監視のベストプラクティスを伝授！
ZOZOTOWNの成功レシピより
New Relic 日吉さん
ZOZOテクノロジーズ 鶴見さん
13時


+ New Relic Kubernetes Cluster Explorer


### Architecting for the Cloud 2019
クラウドにおけるアーキテクチャの設計原則
ソリューションアーキテクト　荒木さん
17時 B2-08


3日目
---

### 基調講演
Marco Argenti - Amazon Web Service
宮崎 秋弘さん - パナソニック
島田 幸輝さん - SyntheticGestalt
名村 卓さん - メルカリ


### カブドットコム証券様登壇事例
Amazon Web Service　コンサルタント 辻本さん
カブドットコム証券　宮本さん
12時 D3-01 


### 【初級】AWS コンテナサービス入門
Amazon Web Service　ソリューションアーキテクト 原さん
12時 C3-01 (ストリーミング)


### 【初級】いまから始めるサーバレスアプリケーション
ソリューションアーキテクト　清水さん
13時 C3-02


### Kubernetes on AWS（Amazon EKS実践入門）
ソリューションアーキテクト　河野さん 
13時 A3-02 (ストリーミング)


### サービスメッシュは本当に必要なのか、何を解決するのか
ソリューションアーキテクト　原さん
14時 A3-03


### Amazon SageMakerで実現する大規模データのための分散学習とワークフロー
プリンシパルデータサイエンティスト Sunilさん
15時 D3-04


### Amazon RDS におけるパフォーマンス最適化とパフォーマンス管理
ソリューションアーキテクト　新久保さん
15時 B3-04 (ストリーミング)


### 【初級】クラウド大規模移行の始め方 ～成功の秘訣は企画・評価・立案フェーズにあり～
コンサルタント　黒田さん
16時 C3-05


### めざせ！サーバレスプロフェッショナル
ソリューションアーキテクト　清水さん
16時 A3-05 (ストリーミング)


### クラウドネイティブなモダンアプリケーション開発を始めよう！クラウドネイティブ設計とデプロイメントパターン
ソリューションアーキテクト 福井さん
17時 A3-06


### Going Deep on Amazon Aurora with MySQL Compatibility
ソリューションアーキテクト 桑野さん
17時 B3-06 (ストリーミング)


<br>

# AWS Summit Osaka 2019 閲覧セッション

https://aws.amazon.com/jp/summits/osaka-2019/

### めざせ！サーバレスプロフェッショナル
Amazon Web Service 川嶋さん
13時 A-02
※２回目

### IoT Well Architected
Amazon Web Service 辻さん
14時 A-03


### SAP Intelligent Enterprizeを実現するためのAWSサービス活用
Amazon Web Service 河原さん
15時 A-04


### Kubernetes on AWS(Amazon EKS実践入門)
Amazon Web Service 河野さん
16時 A-05
※２回目

---

メモから作成できそうなものから
記事作成して学びます！
dein.vimを入れてみる

# はじめに

NeoBundleよりdein.vimにした方がいいんじゃないかという噂を耳にしたので入れてみる
(作者が言ってるみたい)


# 早速入れる

## dein.vimをcloneしてくる

```bash

$ mkdir -p ~/.vim/dein/repos/github.com/Shougo/dein.vim
$ git clone https://github.com/Shougo/dein.vim.git \
    ~/.vim/dein/repos/github.com/Shougo/dein.vim
```

## .vimrcを修正

```vim
if &compatible
  set nocompatible
endif
set runtimepath+=~/.vim/dein/repos/github.com/Shougo/dein.vim

call dein#begin(expand('~/.vim/dein'))

call dein#add('Shougo/dein.vim')
call dein#add('Shougo/vimproc.vim', {'build': 'make'})
call dein#add('Shougo/neocomplete.vim')
call dein#add('Shougo/neomru.vim')
call dein#add('Shougo/neosnippet')
call dein#add('Shougo/unite.vim')

call dein#end()

if dein#check_install()
    call dein#install()
endif
```

check_installって部分で、
pluginを追加したら自動でインストールしてくれるようにしてます。

# 参考

[dein.vimを使ってみる](https://qiita.com/yoza/items/2f8bd33a18225754f346)
[Swift] シンプルなクイズアプリのサンプルコード

# 概要
シンプルなクイズアプリのサンプルコードです。
クイズ形式のアプリは1つ作れば、ジャンルやカテゴリを変更してアプリを量産し易いですね。

- 環境
  - Xcode 10.2.1
  - Swift 5

- 特徴
  - 設問テキスト内に選択肢を含むシンプルなパターン
  - 正解、不正解時にサウンド
  - 経過時間のタイマー
  - 結果画面で正解率と時間を表示


# 結果
|<img src="https://github.com/menomoto/Quiz/raw/master/quiz/quiz.gif" width="256">|
|:-:|

# github
https://github.com/menomoto/englishQuiz/tree/master/englishQuiz

# 備考
- 今回はとりあえず動くものを作っています
- 次回は設問と選択肢を分けるパターンを作ります
要素のテキストノードをテキストの順番通りリストにする

# 結論
```javascript
function textNodes(node) {
	const _textnodes = (childNodes) => {
		if (childNodes.length <= 0) return []
		return Array.from(childNodes)
			.map(e => (e instanceof Text ? e : _textnodes(e.childNodes)))
			.flat()
	}
	return { node: node, textNodes: _textnodes(node.childNodes) }
}
```
微妙にどこをどうするのか悩んだ。

# 結果
<img width="333" alt="スクリーンショット 2019-06-15 18.05.11.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/330547/5e813f16-2a95-7939-a61a-d5f500d87ad7.png">
割と上手く行った
[失敗] WindowsでSSH環境を作る ～OpenSSH編～

## はじめに
Macを使う場合困ることはないのですが、私の環境ではWindowsも多く環境ごとに操作感を統一したいのでクライアントにOpenSSHを使います。 

と思ったのですが、**結論から書くとWindows7,8はコマンドラインで入力した場合、
以下がイケてない結果**に。。。:sob:
　・ビープ音がいちいち鳴る
　・コマンド実行後、いちいちEnter入力が必要
　・viがまともに使えない

ということで今使っている通り [Secure Shell App](https://chrome.google.com/webstore/detail/secure-shell-app/pnhechapfaindjhompbnflcldabbghjo) もしくは [RLogin](http://nanno.dip.jp/softlib/man/rlogin/) のままで。
何か良い方法があるのかな？

### 本記事は以下の環境等を使用しております。
| ターゲット環境 | Version |
|:---|:---|
| Windows | 7(64bit), 8(64bit), 10(64bit) |


## OpenSSH for Windows
Window10の場合開発者モードでSSH有効化やFall Creators Update以降であれば標準搭載されたのでアプリ機能の追加から導入することができますが私の作業環境はWin7,8環境もまだあるので今回はGitHub側のものでセットアップします。

### ダウンロード
| アプリケーション | Version |
|:---|:---|
| [OpenSSH For Windows](https://github.com/PowerShell/Win32-OpenSSH/releases)| v7.7.2.0p1-Beta [^1] |


[リリースページ](https://github.com/PowerShell/Win32-OpenSSH/releases)からインストールするバージョンをダウンロードします。
![Win-ssh-001.JPG](https://qiita-image-store.s3.amazonaws.com/0/269640/2aa9a5d3-337a-a9c9-ce17-dd14a9568183.jpeg)

### セットアップ
任意の場所に解凍して環境変数へ登録すれば完了です。

↓こんな感じ↓
![Win-ssh-002.JPG](https://qiita-image-store.s3.amazonaws.com/0/269640/61f0fd41-e9f9-5641-5aa1-4efbcf4a6102.jpeg)
![Win-ssh-003.JPG](https://qiita-image-store.s3.amazonaws.com/0/269640/bea9f51a-8f5f-297a-a59e-531fd857a6f0.jpeg)

### 起動確認
1. 必要[^2]:であれば「C:\\Users\\<ユーザー名>\\.ssh」に秘密鍵(pem等)を配置

2. [Win] + [r] でファイル名を指定して実行して「cmd」を入力

3. 以下コマンドを実行 

```
cd C:\Users\<ユーザー名>
ssh -i .\.ssh\<秘密鍵>.pem <接続先のユーザー名>@<IP or ドメイン>
```



[^1]: いくつかBugFixが入っているので最新版を指定していますが、安定版を使う場合はbetaがついていないバージョンを選択してください。

[^2]: 鍵認証の場合、権限次第では「WARNING: UNPROTECTED PRIVATE KEY FILE! 」エラーとなるので「1.」の設定が必要
C101PA(arm64 chromebook)上のvscodeでremote developmentを試したい

# やりたいこと
- `C101PA`で最新の`vscode`を使用して`remote development`を試したい

# 結論
なんかエラーで繋げなかった。
まぁ`sshfs`と`ssh`でいいかと思い断念した。

# 環境
- chromebook: ASUS C101PA
- mac mini

# 参考サイト
1. https://www.reddit.com/r/Crostini/wiki/howto/install-vscode
1. https://github.com/Microsoft/vscode/wiki/How-to-Contribute#build-and-run-from-source

# やったこと
1. `vscode` `1.34`のビルド＆インストール
    ビルド済みで公開されているパッケージだと`1.32`なので`remote development`が使えないため

2. `remote development`の設定
    こっちが本命

## 1.`vscode`のビルド
参考サイトの内容をのままです。

1. `.zshrc`に以下を追記
  
    ```sh:.zshrc
    # Use the default C / C++ compilers,
    # because some makefiles default to CC:=gcc:
    export CC=/usr/bin/cc
    export CXX=/usr/bin/c++
    ```
  
2. 必要なパッケージをインストール
  
    ``` sh
    sudo apt install -y libsecret-1-dev git python2.7 clang make libx11-dev libxkbfile-dev fakeroot rpm
    ```

1. `nodejs`のインストール
  `nodebrew`を使いたかったけどとうまく動かせずめげたので`nvm`を使用しました

    ```sh
    git clone git://github.com/creationix/nvm.git ~/.nvm
    ```
  `.zshrc`に以下を追記  
  
    ```sh:.zshrc
    source ~/.nvm/nvm.sh
    ```
  `nodejs`をインストール。バージョンは`10.15.3`にしました。 
 
    ```sh
    nvm install 10.15.3
    ```
  `yarn`をインストール

    ```sh
    npm i -g yarn
    ```
  
1. `vscode`のソースを取得
  `vscode` を shallow cloneします
 
    ```sh
    git clone https://github.com/Microsoft/vscode.git --depth=1
    cd vscode
    ```
  ビルド時のメモリ使用を制限したり、いろいろパッチを適用します(詳細は参考サイト参照)

    ```sh
    sed -i 's|require("gulp-sourcemaps");|{write:()=>gulpUtil.noop(),init:()=>gulpUtil.noop()};|' build/lib/optimize.js
    sed -i 's|--max_old_space_size=[0-9]\+|--max_old_space_size=1700|' package.json
    sed -i 's|yarnInstall..test/smoke|// &|' build/npm/postinstall.js
    ```

1. `vscode`をビルド
  30分くらいかかる

    ```sh
    yarn && yarn run gulp vscode-linux-arm64-min && yarn run gulp vscode-linux-arm64-build-deb
    ````

1. `vscode`をインストール
  ビルドした`vscode`をインストールします

    ```sh
    sudo apt install -y ./.build/linux/deb/arm64/deb/code-oss_*_arm64.deb
    ```

1. `vscode`を起動
  以下のコマンドで、起動します

    ```sh
    code-oss
    ```

## 2.`remote development`の設定
1. `remote development`を追加
  ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/415304/6e1fd8a0-5cad-f19f-2611-113f74de1f27.png)

2. `mac mini`に接続
  1. 左側のツールバーに追加されたアイコンを選択。
  1. `mac mini`を右クリック(たぶん`.ssh/config`が読み込まれてる。)
  2. `Connect to Host〜`をクリック
  ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/415304/a31a2b93-45ed-3220-eabc-2bd1fee4afa0.png)

3. エラーで接続できず断念
  ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/415304/d7cbf343-5ab4-0543-8a15-ab130ed8e473.png)
Linux、Windows、MacOsの違いについて 

こんにちは！
インターン先でプログラミング勉強中の国際関係学部3回生です。
今回はカリキュラムで「Windows」「Mac Os」「Linux」の違いやOSについて書く機会があったので、なるべく真剣にご紹介したいと思います。

##OS（オペレーティングシステム）とは
まずOSの定義をWikipediaから引用してご紹介すると以下の通りです。

「オペレーティングシステム（Operating System, OS）は、コンピュータにおいて、ハードウェアを機能毎に抽象化したインターフェースを利用者またはアプリケーションソフトウェアに提供するコンピュータプログラムである。」

とこんな感じです。
具体的なところでいうと、普段パソコンを使うときに、マウスやキーボードを使用すると思いますが、こういったものから入力された情報を伝えたりしています。
こういったOSがあるからこそ、私たちは快適かつ簡単にパソコンやスマートフォンを使えているというわけです。

では、もしもOSがパソコンに導入されていなければどうなるのでしょうか。
もしも、OSがなければ、パソコンは文字通り「**鉄の箱**」になり下がります。
キーボードをたたいても画面は真っ黒、もちろんマウスのカーソルも存在しません。
ここから、私たちがパソコンを使えているのはOSのおかげであるということがわかります。

そして、OSはこういったパソコンの基本的操作に関連しているソフトウェアなので**基本ソフトウェア**と呼ばれています。
また、Windowsを使っている方であればおなじみの「Word」や「Excel」は**応用ソフトウェア**または、アプリケーションと呼ばれています。

##Linux、Windows、MacOsの違いについて
ここではそれぞれのOSの違いについて紹介します！

###・Windows
まずWindowsからご紹介します。
Windowsはパソコンで使用されているOSの中で、世界でのユーザー数が一番多いOSです。
一般的には「Windows」がインストールされたパソコンのことをWindowsと呼びます。
Windowsには様々なバージョンがありますので、総称してWindowsと呼ぶようになったようです。
WindowsはMicrosoft社が開発したOSであるが、基本的にソフトウェアのみを手掛けています。
そのため、富士通やSONYなどのハードウェアにMicrosoft社のWindowsソフトウェアを乗っける形をとっています。

###・MacOs
MacはApple社が開発したコンピューターのブランド名です。
そして、ハードウェアからソフトウェアまでApple社が管理しています。
ここが、Macの特徴です。
さっきご紹介した通り、Windowsは基本的にMicrosoft社が開発したハードウェアに乗っけることが多いですが、Apple社はハードウェアからソフトウェアまで自社で手掛けています。
またMacOsはユーザーフレンドリーで知られており、とてもグラフィカルで、デザインと操作感がアプリケーションを通して共通しているため統一性のある操作が可能になります。

###・Linux
Linuxは無料で、中身もいじることのできるオープンソースのOSです。
Linuxは無料であるがために急速に拡大が進んでおり、企業のサーバーとして使用されていることが多いです。
Linuxには大変多くの種類が存在していますが、その中でも一般の方が利用したり、インストールしたりできる形にしたものを「**ディストリビューション**」と呼ぶそうです。

##まとめ
今回はOSの違いや定義についてご紹介しました。
ほとんどサイトに載っている情報を使わせていただきました(笑)
ただ、僕もWindowsしか使ったことがなかったので、新たな発見が多くあり情報収集や実際に書いていて楽しかったです。
またこれからもこういった記事を載っけていこうと思います！
最後まで読んでいただきありがとうございました！！！

##参考サイト
[ざっくりとOSの種類まとめました【初心者向けに簡単解説！】](https://eng-entrance.com/programming-os)
[OSとは何か？役割から主要OSまで基本を解説【PC初心者必見】](https://tech-camp.in/note/pickup/1013/)
[今さら聞けない！OSとは何か？〜基礎の基礎を学ぼう〜](https://www.sejuku.net/blog/6084#Windows)
Docker で alpine を使ってみた

## はじめに
alpine使うことが増えてきたので
備忘録がてら投稿(重要な点のみ記載してます)

## 環境
本記事は以下の環境等を使用しております。

| 環境 | Version |
|:-----|:--------|
| Windows | 10(64bit) |
| Ubuntu | 18.04LTS(64bit) |

## 前準備 
[Windows：Docker環境が使用可能であること](https://qiita.com/osugizmo/items/81cc3581e8b40189c470)

## alpineコンテナを起動する
```shell:terminal
# 簡略版
# コンテナの起動
docker run --name temp_alpine394 -itd alpine:3.9.4 /bin/sh
```

```shell:terminal
# 通常版
# コンテナイメージの取得
docker pull alpine:3.9.4
# 取得したイメージの一覧表示
docker images
# コンテナの起動
docker run -itd <image id> /bin/sh
```

## コンテナに接続
```shell:terminal
# 簡略版
# コンテナに接続
docker exec -it temp_alpine394 /bin/sh
```

```shell:terminal
# 通常版
# コンテナの確認
docker ps -a
# コンテナに接続
docker exec -it <container id | container name> /bin/sh

※docker attach <container id | container name> を
　使用することも可能ですがattachした場合exitで
　コンテナ終了してしまう＋接続は別プロセスが好ましいと考えるので
　私はexecを使います
```

## インストール済みのパッケージを更新、表示
```shell:terminal
apk update
apk upgrade
apk info
```

## 最後に
まずはalpineの起動まで。
これをベースに色々試していこうかな。
App Store Connectへのアプリのアップロードは成功するのに、直後に ITMS-90035: Invalid Signature でバイナリが無効にされてしまう問題

# 要約
私達の場合、APFSのファイルシステムのMacで、アプリの画像音声リソースのファイル名に日本語の特定の文字 (詳細には「び」「パ」など、濁音、破裂音を表すひらがな、カタカナ等) を使っていたのが原因だった。HFS+でフォーマットした外部ディスクに一度日本語のファイル名が入ったファイル一式を移し、それらを再びMacに戻してから、再度アプリをアーカイブし、アップロードすることで問題が解決した (以下解決までの経過を詳しく記述)。


# 困ったこと: Code Signingには問題なさそうなのに、何度やってもアップロード後バイナリが無効にされてしまう

CertificateやProvisioning Profileを何度確認しても問題なさそうなのに、それでもアプリをアップロード後に ITMS-90035: Invalid Signature のエラーでバイナリが無効にされてしまい本当にこまった。

# AppleのTechnical Notes/QAを確認

Troubleshooting Failed Signature Verification
https://developer.apple.com/library/archive/technotes/tn2318/_index.html#//apple_ref/doc/uid/DTS40013777-CH1-TNTAG38

上記Tech NotesにあったCode Signingのチェックツールを走らせても問題なし。
ただ、Code Signingの不備以外の理由、たとえば、アプリ名(.ipaファイルの名前)に"?"などの特殊文字がはいっていても、このInvalid Signatureエラーではねられるということが書いてあった。当該アプリには特殊文字は使われていなかったのであてはまらなかったが、Code Signingの問題以外でリジェクトされることが分かったのは大きな前進。

Resolving the Invalid Signature binary rejection
https://developer.apple.com/library/archive/qa/qa1510/_index.html

アプリ名の特殊文字以外にも、Dot Files (HFS+でフォーマットしたディスク以外から、zipしないでもってきたXCodeのプロジェクトで生じる "._" からはじまる名前のファイル) が問題を起こすと書いてあった。指示通り、この問題を解決するというdot_cleanというユーティリティーをTerminalからXcodeプロジェクトの各ディレクトリに対して走らせたりもしたが、問題は解決しなかった。


# 日本語ファイル名の画像音声リソースを取り除くとうまくいった(ええ…)

プロジェクトで使われているファイル名があやしいという仮説から、試しに日本語ファイル名が使われている画像および音声リソースを全て取り除いた後にプロジェクトをクリーン、再アーカイブしてからアップロードすると、ついにうまくいった。しかし管理上、リソースのファイル名に日本語を使えないのは大変不便。やっぱりこまった。

[追記]問題が発生するのは、ファイルに日本語の特定の文字 (「び」「パ」など、濁音/破裂音を表すひらがな、カタカナ等) が含まれている時のようだ。

# 日本語のファイル名を変えることなく、アップロードに成功

Apple Developer Forums - Re: Appstore Deployment keeps Failing(Sealed Resource missing or invalid)
https://forums.developer.apple.com/message/365325#365325

このフォーラムで、db3dさんによる

"Copying the offending files to a HFS+ disk image and back to APFS solved the issue."

という記述を発見。そのとおり、Disk UtilityのEraseから外付けUSBドライブをHFS+(Mac OS Extended Journaled)にフォーマットし、そこに日本語ファイル名のリソース一式がはいったディレクトリを移動、その後すぐMacの元の場所にもどしてから、Xcodeのプロジェクトを再度アーカイブ、アップロードしたら、なんとうまくいった。

しかもデフォルトではGitでファイル名の差分はまったくでない。同じくdb3dさんの記述で、

"... where a command ('git config --replace-all core.precomposeunicode false') allowed Git to handle the changed files. "

とあったので、指示のとおりにコマンドを走らせGitのconfigを変更したところ、ファイル名の差分が確認できるようになったようだ。

結局運用がちょっと難しくなるので、可能ならばリソース名等々はいまのところAlphaNumeric(とアンダースコア等)以外は避けたほうが安全なのかもしれない。Appleへのバグ報告もされている(私もDupeする予定)が、是非早くなおしてほしい問題だと思う。

#思えば

iOS 10.3のリリース時、APFSのUnicode正規化問題で大変苦労した思い出があった。

Windowsからコピーされた、濁音、破裂音を表すひらがな、カタカナが入ったファイルが認識されなくなるという問題が、APFSが導入された直後のiOS 10.3で発生し、アプリの修正対応に苦慮した (現在は修正されている)。

Forumでも指摘されているが、本問題はどうやらこのUnicode正規化問題の影響のように思える（App Store Connectのサーバーは、HFS+のファイルシステムで動いている？)。

参考: APFSで再燃したNFD問題
https://qiita.com/dankogai/items/6564a5a92288dd2a35d7

ネットでエキスパートの方々が知見を共有してくれたおかげで解決できたのを覚えている。

#教訓
エラーコードやエラーメッセージを常に信用してはいけない
fontawesomeをPCやデスクトップアプリで使う｜2019

#環境
macosでのやり方を書きます。

#fontawesome4をダウンロード
https://fontawesome.com/v4.7.0/get-started/?utm_source=fontawesome4.7

ダウンロード解凍したフォルダから
font-awesome-4.7.0　→　fonts →　FontAwesome.otfをダブルクリック
小ウィンドウが立ち上がるのでフォントをインストールをクリックします。

#使い方
https://fontawesome.com/v4.7.0/cheatsheet/

こちらのページのアイコン上で右クリック→コピー
イラストレータなどのファイル上でペースト
はてなマークが表示されたら
そのはてなマークが選択された状態で
フォントをFontawesomeにするとアイコンが表示されます。

#fontawesome5以降だと使えなかった
https://fontawesome.com/

有料プランなら使えるのかもしれません。
※使っている方いたら使い方を教えていただけると嬉しいです。
controllerで存在確認しながら保存する

# やりたいこと

postとtagを別でsaveするが両方値がないとどちらも保存したくない

# コード

```post.controller.rb
  def create
    if current_user
      @post = Post.new(title:params[:title],des:params[:des],user_id:current_user.id)
      if params[:tag_name].present? && @post.save
        tag_list = params[:tag_name].split(",")
        @post.save_posts(tag_list)
      else
        flash[:alert] = "投稿できませんでした"
      end
      redirect_to("/")
    else
      flash[:alert] = "ログイン、新規登録をしないと投稿できません"
      redirect_to("/users/sign_in")
    end
  end
```

validation聞かせたい場合、本来はmodelにvalidatesをかくべきなんだろうけど上記のようにpost.saveした後にtagを別で保存する場合、tagのmodelでvalidatesを書いてもpostのsaveが実行されてしまう。

tagが入力されてない場合にpostも保存されたくないのでparams[:tag_name].present?で存在確認して&&条件で@post.saveをおこなった。
Javaのmainメソッドがstaticであることをお嘆きのあなたに

# 動機

ちょっとした動作確認で、mainメソッドから簡単なプログラムを書くことってありますよね。
今時はJShellがあるので、そういう機会もあまりないのかもしれないですが。（どっちやねん）

ともかく、mainメソッドはstaticなので何かと面倒、なんとかしたい、という場合の話。

# やること

mainメソッドで自分自身のインスタンスを作って、インスタンスメソッドを実行すればいいです。

```java:Main.java
public class Main {
    public static void main(String[] args) {
        new Main().execute();
    }
}

public void execute() {
    ...
}
```

# 余談

競技プログラミングの場合だと、mainメソッドに事前処理事後処理と実装用のインスタンスメソッドの呼び出しを記述したテンプレートを用意すると何かと捗ります。

例えば私は[こういうテンプレート](https://github.com/mdstoy/atcoder/blob/master/src/Main.java#L6-L19)を作ってます。

```java:テンプレート抜粋
public class Main {
    public static void main(String[] args) {
        PrintWriter out = new PrintWriter(System.out);
        InputStreamScanner in = new InputStreamScanner(System.in);
        new Main().solve(in, out);
        out.flush();
    }

    private void solve(InputStreamScanner in, PrintWriter out) {
        in.nextInt();

        out.println();
    }
// （以下自作Scannerの実装）
```

この辺は人によっていろいろな流儀があるので、いろんな競プロerのソースコードを参考にするといいと思います。
クロムブックの開発者モードの使い方

開発者モードへ切り替える方法はこちらの方法の通りにしました。
[ChromeBookを開発者モードにする方法]
(https://shimota.app/chromebook_to_developmode/)
切り替えができたら、次のようにします。
1) Ctrl + Alt + t
2) shell
3) cat /etc/os-release

```text
crosh> shell
chronos@localhost / $ cat /etc/os-release
BUILD_ID=11895.118.0
NAME=Chrome OS
ID_LIKE=chromiumos
GOOGLE_CRASH_ID=ChromeOS
VERSION_ID=74
BUG_REPORT_URL=https://crbug.com/new
VERSION=74
HOME_URL=https://www.chromium.org/chromium-os
ID=chromeos
```

次に [Chromebrew](https://github.com/skycocker/chromebrew) をインストールします。

```bash
curl -Ls git.io/vddgY | bash
```

続いて python3 をインストールします。

```bash
crew install python3
```

インストールの確認

```bash
$ python3 --version
Python 3.7.1
```
Attiny85 でオーディオピッチシフターを作る

# やりたいこと
マイクで録った音に連動して、ウーファーを動かしたい。
中音域の音でも、ウーファーを振動させるようにするため、１オクターブ下げる。
ウーファーに入力される中高音域とノイズを除去するために、LPFを通す。

#必要なもの
* マイク
* スピーカ（ウーファー）
* Digispark Attiny85 開発ボード
    * https://www.amazon.co.jp/dp/B0154PL3QA/ref=cm_sw_em_r_mt_dp_U_cWLbDb1V2E8V8

* など　
これを参考に：
https://blog.adafruit.com/2017/03/15/attiny85-real-time-audio-pitch-shifter/


# セットアップ
* Arduino上で、'Preferences'-> Additional Boards Manager URLs にURLをコピペする.Windowsの場合は、ファイル→環境設定

```
http://digistump.com/package_digistump_index.json
```
Toolsで以下の様に設定。
<img width="673" alt="Screen Shot 2019-06-16 at 2.04.06.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/102681/e0e4b002-1e2a-1b2a-a3aa-939e798ab27f.png">

* Macの場合のみ？ USB Hub経由じゃないとデバイスを認識せずエラーとなる。
* uploadボタンを押下後６０秒以内に、ATtiny を挿入
* なぜか途中で失敗するが、Deviceをつないだまま、再度Uploadボタンを押すとうまく行った

# コード
## リファレンスコードのビルド
* http://www.technoblogy.com/list?1L5V
* これをコピペして焼き込み成功

## １オクターブ下げる
上記のコードと異なり、今回作りたいのは、ざっくり１オクターブ下げるものを作りたい。
てことで、OCR0Aを変更し、決め打ちに。

``` c
  // OCR0A = 55;                             // 17.9kHz interrupt
  OCR0A = 28; // 約1オクターブ下げる
```

また、ボタンの割り込みをコメントアウト

``` c

//// Pin change interrupt adjusts shift
//ISR (PCINT0_vect) {
//  int Buttons = PINB;
//  if ((Buttons & 0x01) == 0) OCR0A++;
//  else if ((Buttons & 0x04) == 0) OCR0A--;
//}
//////////// 中略 //////
  // Set up buttons on PB0 and PB2
  // pinMode(0, INPUT_PULLUP);
  // pinMode(2, INPUT_PULLUP);
  // PCMSK = 1<<PINB0 | 1<<PINB2;            // Pin change interrupts on PB0 and PB2
  // GIMSK = GIMSK | 1<<PCIE;                // Enable pin change interrupt
```
## ローパスフィルタを作る
簡単な一次のLPFを作り、不要な音を除外

``` c

volatile uint16_t alpha = 10;
volatile uint16_t alpha_max = 255;
volatile uint8_t previous_output = 0;

uint8_t lpf (uint8_t input){
  uint8_t output = alpha * input / alpha_max  + (alpha_max - alpha) * previous_output / alpha_max;
  previous_output = output;
  return output;
}
```

そして、DACにわたす値をLPF通過後の値にする。

``` c
  OCR1A = lpf(Buffer[ReadPtr]);
```

# 参考
https://www.instructables.com/id/How-to-Setup-DigiSprak-Attiny85-Board/
Nuxtを使ったコンポーネント間の通信EventBus。知らなかったのでメモ記事

## 前提
#### 環境
* Nuxt.js(v.2.8.1)

#### 動機
layoutで処理した結果をnuxtタグ（各ページのコンテンツ）に渡したかった。
何か良い方法は無いか探したところ、下記にてとても有用な記事を見つけたので、記事にしました。
[[Nuxt.js] EventBusを使ってコンポーネント間で通信する](https://www.sukerou.com/2019/01/nuxtjs-eventbus.html)

## 簡単に使い方を
#### 概略
* nuxtにはすでに**$nuxt**というグローバル・Vueオブジェクトがある
* $nuxtにはどこからもアクセス可能
* Vueオブジェクトなので、**\$emit | \$on | \$off**が使える！

#### 今回使った例
発信側：

```vue:default.vue
<template lang="pug">
 <header>
  <button @click="onClick">click</button>
 </header>
 <nuxt>
 <footer></footer>
</template>
<script>
 methods: {
  onClick() {
   // グローバルなオブジェクトにエミット
   this.$nuxt.$emit('rootClick')
  }
 }
</script>
```

受信側：

```vue:page.vue
<template lang="pug">
 <div class="content">
  <h1>page</h1>
 </div>
</template>
<script>
 mounted() {
  // グローバルなオブジェクトにハンドラ追加
  this.$nuxt.$on('rootClick', onRootClick)
 },
 beforeDestroy() {
  // ちゃんと後処理
  this.$nuxt.$off('rootClick')
 },
 methods: {
  onRootClick() {
   // header無いのボタンがクリックされました！
  }
 }
</script>
```
#### 良いと思ったところ
* 密結合にならないのがやっぱり良いと思いました。emit側は投げっぱなしで良い。
* これを知るまではstoreをブリッジしたりしてましたが、簡単なやりとりだけのためにstoreを使うのがどうもなーと思っていたので、簡単に書けるのがとても良いと思いました。


## 詳しくは記事元を是非
[[Nuxt.js] EventBusを使ってコンポーネント間で通信する](https://www.sukerou.com/2019/01/nuxtjs-eventbus.html)

有用な記事をありがとうございました。
Windows10のコマンドプロンプトで警告音を消す

備忘録

警告音、ビープ音、エラーサウンドなど呼び方色々

![無題.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/15368/7cdc847b-1ea7-3091-e2f3-15e5b21637da.png)