OmniAICreator/Qiita-1.07M huggingface dataset:
Rails でJavaScriptが動作しない…？

railsでJavaScriptを使おうとした際に少しハマったのでメモ

## 現象
jsファイルを作成し、コードを書いているのにブラウザのコンソール画面が反応しない。

↓　jsファイル

```js:posts.js
$(function(){
  console.log("OK")
})
```
↓　ブラウザのコンソール
<img width="682" alt="bcffa2f0733f33d8f62ccead4e64a205.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/605568/fc345111-9672-13e5-1143-344f21e0654d.png">

## 原因調査
jqueryの設定にミスがあるかと思ってファイルを確認しても特にミスは見つからず…
というかコンソール画面でエラーすら出ないということはjsファイルが読み込まれていない？
ということでGoogle先生に聞き込み

## 結果
やはりjsファイルが読み込まれていませんでした。
原因はコントローラ作成時に生成されるcoffeeファイル
<img width="318" alt="96914264b880c46743b4056ab5e5fc1f.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/605568/d2e66b8b-ce50-4f13-dd8c-edc4eba34aec.png">
このファイルと同じ名前でjsファイルがあるとcoffeeファイルが優先して読み込まれるためjsファイルが読み込まれないということでした。

coffeeファイルを消してリロードしてみると
<img width="639" alt="ef58666adbb389c33b52cd0c8498af69.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/605568/a10bbcda-a18a-5307-9fb4-a1889856c37f.png">
ちゃんとコンソール画面にOKと表示されました！

coffeeファイルが何に使われるのか、なぜコントローラ作成時に自動で作られるのか謎ですが、coffeeファイルは基本削除するようにしておきます。
（自動生成されるくらいなので割と重要なファイルな気もしますが…）

間違いあれば指摘してください。
Ruby と Python で解く AtCoder ABC130 D 累積和 二分探索

# はじめに
*[AtCoder Problems](https://kenkoooo.com/atcoder/#/)* の Recommendation を利用して、過去の問題を解いています。
AtCoder さん、AtCoder Problems さん、ありがとうございます。
# 今回のお題
*[AtCoder Beginner Contest D - Enough Array](https://atcoder.jp/contests/abc130/tasks/abc130_d)*
<font color="gray">Difficulty: 859</font>

今回のテーマ、累積和 + 二分探索

問題文`(条件)連続部分列に含まれる全ての要素の値の和は、K 以上である。`より累積和を使用することが分かりますが、`1≦N≦100_000`ですので2重にループを回すと`TLE`になります。
そこで、累積和は単調増加ですので、計算量を抑えるために二分探索も併用します。
# Ruby
```ruby.rb
n, k = gets.split.map(&:to_i)
a = gets.split.map(&:to_i)
acc = 0
x = [0] + a.map{|v| acc += v}
cnt = 0
x.each do |y|
  j = x.bsearch_index{|z| z - y >= k}
  if j == nil
    break
  else
    cnt += n - j + 1
  end
end
puts cnt
```
```accumulate.rb
acc = 0
x = [0] + a.map{|v| acc += v}
```
累積和はここで計算しています。
**追記**
コメントでいただいたコードに修正しました。

```bsearch.rb
  j = x.bsearch_index{|z| z - y >= k}
```
二分探索ですが、***C++*** でいうところの`lower_bound`が、***Ruby*** では`bsearch`若しくは`bsearch_index`になります。
# Python
```python.py
from sys import stdin

def main():
    import bisect
    import itertools

    input = stdin.readline
    n, k = map(int, input().split())
    a = list(map(int, input().split()))
    x = [0] + list(itertools.accumulate(a))
    cnt = 0
    for z in x:
        j = bisect.bisect_left(x, k + z)
        if j <= n:
            cnt += n - j + 1
    print(cnt)
main()
```
```accumulate.py
    x = [0] + list(itertools.accumulate(a))
```
***Python*** では、累積和を求める`accumulate`という関数があります。

```bisect.py
        j = bisect.bisect_left(x, k + z)
```
二分探索ですが、`bisect`若しくは`bisect_left` `bisect_right`を使用します。
探索する数値が配列に含まれる場合、`bisect`はその数値の右側、`bisect_left`は左側の位置を返します。

```for.py
    for z in x:
    for i in range(n):
```
`range()`でループを回すと`TLE`しました。

||Ruby|Python|
|:--:|:--:|:--:|
|コード長 (Byte)|238|377|
|実行時間 (ms)|165|101|
|メモリ (KB)|11780|14196|
# まとめ
+ ABC 130 D を解いた
+ Ruby に詳しくなった
+ Python に詳しくなった

参照したサイト

*[instance method Array#bsearch](https://docs.ruby-lang.org/ja/latest/method/Array/i/bsearch.html)*
*[すごいぞitertoolsくん](https://qiita.com/anmint/items/37ca0ded5e1d360b51f3)*
*[bisect --- 配列二分法アルゴリズム](https://docs.python.org/ja/3/library/bisect.html)*
俺の嫌いなXcodeが5秒でイチオシ開発環境に

iOS開発者の皆さん、毎日、ハッピーな開発ライフ過ごしてますでしょうか。

楽しい開発には快適な開発環境は欠かせませんが、もちろんiOS開発者の皆さんが使うのはXcodeですよね。
いや、俺はAppCodeという人はそっとタブを閉じましょう。

JetBrains製品、良いですよね。Android Studio も素晴らしい。どんな言語でも同じ様な操作感で。でもちょっともっさりしてるんだよな。
その点、Xcodeは動きはキビキビしていて玄人プログラマー好み。

でも一つ、**すごく嫌なところ**がありました。これさえ直してくれれば最高なのに。

普通、Xcodeって編集する時、複数のタブ開くじゃないですか。自分の場合はこんな感じ。
![スクリーンショット 2020-05-27 15.16.35.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/22218/cfe2f4de-72cd-803b-226e-ffd2c3c488fa.png)
Storyboardと関連のソースファイルを幾つか。そして、デバッグする時は、気になってるところにブレークポイント張ります。

プログラム実行して、さて、気になるところに差し掛かると...
![スクリーンショット 2020-05-27 15.16.53.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/22218/120673be-b5d9-856e-d514-e5d4f04bd85e.png)

あーこのタブでデバッグ状態になって違うファイル開かれたわー、確かに昔そこにブレークポイント張っとったわー。というか、そもそもなんのファイル見てたかも不明だわー。

ということが、多々ありました。（該当のタブで戻るボタン押せば戻るんですが）

**ここが本当に嫌いだった**。なんでAppleはこれで平気なの？

平気じゃなかった様です。全然普通に回避できました。いつからだろう。

Xcodeの「Preference ー Behaviors」または「Edit Behaviors」を開きましょう。
![スクリーンショット 2020-05-27 14.44.20.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/22218/e398bde9-3468-bcd1-bc4f-6e50c455db6f.png)

RunningのPausesが、ブレークポイントで一時停止した時の設定の様です。

「Show tab named」のところをチェックして名称を入れましょう。
![スクリーンショット 2020-05-27 14.45.22.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/22218/171f4924-7c1c-fc14-ab22-60503f9688d0.png)

すると、同じことしても、
![スクリーンショット 2020-05-27 15.17.20.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/22218/7ea9160d-ce7d-0184-ef58-cc1d5f83bed2.png)

おー、さっきつけた名前で**自動でタブが生成**されて、編集してたタブはそのままです。

ちなみに、「Play sound」のところを設定すると、一時停止したときにサウンドがなります。同じ様に「Speak announcement using」を設定すると、映画に出てくるハッカーのコンピュータみたいでオススメです。

これ知らなかったでしょ？いや知ってたって！？もしかして、知らなかったの自分だけ？？しかしなんで気づかなかったんだろう。

それでは素敵な開発ライフを！

### 参考
XcodeのBehaviorsを設定してデバッグ時にウインドウを自動で切り替える
https://techracho.bpsinc.jp/wingdoor/2019_12_04/83304

---
### 筆者参考
札幌圏でリモート開発、在宅勤務を中心としたシステム開発の会社を経営しています。

[ローラハウス](http://laurahouse.net)
LVDSディスプレイの基礎

#お始めに#

組み込みシステムで高い利益を出すためには、提案のそれぞれに最適で最も費用対効果が高いソリューションを使用することが重要になります。一方で、選択したデバイスや周辺機器を最終的なシステムに適切に実装する上で、構成上の課題にいくつもぶつかることにもなります。ディスプレイも例外ではありません。最高の画像品質を確保するため、システムインテグレーター、ハードウェアデザイナー、組み込みシステムエンジニアは、ディスプレイのデータシートとオペレーティングシステムのディスプレイAPIをよく研究しなければなりません。

この5回にわたるブログ記事連載では、LVDSディスプレイの基礎的な概念とLinuxにおける設定方法について説明し、さらに、LVDSディスプレイを利用した設計を成功させるために知っておくべきハードウェア関連の項目について見ていきます。長い連載となりますが、ぜひお付き合いください。デバイスを選択し、適応させ、エンジニアリングするプロセス全体について理解し、完璧なディスプレイ付きソリューションを実現させるための、優れた実例となるはずです。

まずこの初回記事では、いくつかの文献を紹介し、様々なシナリオにおいて、LCDデバイスのタイミングをデバイスのソフトウェア定義に変換する方法について説明していきます。また、LVDSシグナリングについても、少し説明したいと思います。

#ディスプレイのタイミングを理解#

通常の電気的な要件（電圧と電流）に加え、ディスプレイには最適な画像体験を提供するのに必要な要件がもう1つあります。それはタイミングです。ディスプレイというものは、画素を列と行（垂直方向と水平方向の線）に分けたマトリクスにほかなりません。1秒の間に何度もリフレッシュして全画素の色を個々に変えることで、映したい画像を表示させます。タイミング要件には、画素の色をどのようにつけるかを決定するものが厳密に定義されています。つまり、ディスプレイ内部コントローラーの周波数や垂直方向および水平方向信号の持続時間を指定しているのです。

ディスプレイは通常、上から下へ（垂直方向）および左から右へ（水平方向）へと描画されます。すべてのフレームは一番左上のピクセルから開始され、その右のピクセルへと続きます。1行分が終わると、次の行の一番左のピクセルから始まるこのプロセスが繰り返され、一番右下のピクセルに到達するまで続きます。

通常、ディスプレイには2つの異なる期間があります。「ディスプレイ」期間は、ピクセルが描かれる状態です。「ブランク」期間は、ラインとフレームの間の期間で、主に同期の目的で使用されます。


![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/644786/8b925e2f-e6f6-f3d9-b5cc-22e5671a32e0.png)

この例では、三菱電機の7インチディスプレイAA070ME01ADA11を使用します。このディスプレイのタイミングは、上記の通りです。

この7インチの800x480ディスプレイは、単一チャネルLVDSインターフェースと最大24ビットのカラーマッピングを使用します。カラーマッピングは、LVDSの差動信号が、どのようにして特定の色に変換されるのかを定義するものです。24ビットのカラーマッピングでは、24ビット（つまり3バイト）を使って全画素の色を示します。つまり、最大2^24種の異なる色（画素あたり16,777,216色）を利用できる、ということになります。カラーマッピングについては、後ほど詳しく言及します。

通常、ディスプレイ製造元は、すべての画素がどのように描かれ、そしてそれがどのようにレファレンスに利用するタイミング要件チャートに示されるのかを説明しようとします。しかし当然ながら、このタイミング要件が、組み込みデバイスが理解できるデバイス定義へと置き換えられる仕組みも理解する必要があります。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/644786/8e5facba-c1b2-6774-f960-0477552c2cfd.png)

このタイミングチャートとデータから分かることは以下の通りです。
画素は、画素クロック期間で定義され、1クロック期間ごとに1つの画素が描かれる。
アクティブ時間が、ディスプレイの解像度を示す。これは偶然の一致ではありません。ディスプレイ時間は、画素を描く期間にほかならないからです。言い換えれば、ディスプレイが描く画素数の合計を定義します。
tV（トータル垂直期間）およびtH（トータル水平期間）は、少なくともアクティブとブランク双方のタイミングを含む。
水平方向の各ラインの最初には、描画に利用できないtHBがあり、これが水平ブランク期間になります。
垂直ラインは、水平ラインの合計数で定義される。前の行を描き終えると次の行に移動することは既にお話しました。
垂直方向の各ラインの最初には、描画に利用できないtVBがあり、これが垂直ブランク期間になります。

#結論#

この記事では、LCDの基礎と正確な画像を描くために必要なタイミングについて、簡単に紹介しました。
【Scrum】Core-Scrumに書いてあるレトロスペクティブの日本語訳(と言うか解釈してみた)のメモ

# Sprint retrospective
## 参考
[Core-Scrum](https://www.scrumalliance.org/ScrumRedesignDEVSite/media/ScrumAllianceMedia/Files%20and%20PDFs/Learn%20About%20Scrum/Core-Scrum.pdf)
## 概要
スプリントの最後に、スクラムチームはレトロスペクティブを行う。
スプリント期間が1週間毎に1時間のタイムボックスとする。
チームメンバーはプロセスについてレビューを行う。
プロセスとはグループ個人間の関係やツーつの使われ方も含む。
うまく行ったこと、あまりうまく行かなかったこと
チームは将来の改善プランを発想する。
スクラムフレームワークを正として、
方向性を決定するため他社に依存してしまうのではなく、
スクラムチームは自分たちのプロセスを改善する
Pythonでスクレイピング - Seleniumなんてもう古い！？・・・Pyppeteerの使い方

## 目次

- [Pyppeteerとは](#pyppeteerとは)   
- [インストール](#インストール)
- [使い方](#使い方)
  - [ブラウザを立ち上げサイトを開く](#ブラウザを立ち上げサイトを開く)
  - [要素を取得](#要素を取得)
  - [テキストボックスに入力する](#テキストボックスに入力する)
  - [クリックする](#クリックする)
  - [属性の値を取得する](#属性の値を取得する)
  - [innerHTMLを取得する](#innerhtmlを取得する)

## Pyppeteerとは
PyppeteerはChromeブラウザを操作するためのPythonパッケージで、node.js用をライブラリPuppeteerをPythonに移植したものです。
Pyppereerの情報は少ないので調べるときはPuppeteerで検索する方がいいかもしれません。

[Pyppeteer作者様ブログ](http://h-miyako.hatenablog.com)
[Puppeteerサイト](https://pptr.dev/)

## インストール
```
pip install pyppeteer
```

## 使い方

### ブラウザを立ち上げサイトを開く

```python
import asyncio

from pyppeteer import launch

async def main():
    browser = await launch()
    page = await browser.newPage()
    await page.goto('https://google.com')
    

if __name__ == "__main__":
    asyncio.get_event_loop().run_until_complete(main()) 
```

上記コマンドを実行するとヘッドレスモードでChroniumが起動し、Googleのサイトを開いてブラウザを閉じます。
初回import時に一回だけchromiumがインストールされます。Pyppeteerでは、デフォルトでヘッドレスモードでブラウザが起動します。

```python
browser = await launch(headless=False)
```
とする事でブラウザを表示することが出来ます。

### 要素を取得

``` python
# 条件に合った最初の要素を取得
# page.Jでも可能
textbox = await page.querySelector('input[aria-label="検索"]')
textbox = await page.J('input[aria-label="検索"]')

# 条件に合った全ての要素を取得
# page.JJでも可能
buttons = await page.querySelectorAll('input[aria-label="Google 検索"]')
buttons = await page.JJ('input[aria-label="Google 検索"]')
```

### テキストボックスに入力する

``` python
# page.type(セレクタ, 入力値)
# 取得したエレメントからでも可能
await page.type('input[aria-label="検索"]', 'pyppeteer')
await textbox.type('pyppeteer')
```
### クリックする

``` python
# page.click(セレクタ)
# 取得した要素からでも可能

# Googleの検索ボタンは2番目の要素を選択しなければならないため
# querySelectorAllで取得しなければならない？
await page.click('last-child:input[aria-label="Google 検索"]')
await buttons[1].click()
```
### 属性の値を取得する
page.evaluateでjavascriptを実行して取得する。

``` python
text = await page.evaluate('elm => elm.getAttribute("name")',textbox)
```

### innerHTMLを取得する
上記と同様

``` python
elm = await page.J('#hptl')
text = await page.evaluate('elm => elm.innerHTML', elm)
```

## My Accounts
<a href="https://github.com/mao2009"><img src="https://mao2009.github.io/qiita_template/GitHub-Mark-64px.png" width="50px"></a><a href="https://twitter.com/loach_mao"> <img src="https://mao2009.github.io/qiita_template/Twitter_Social_Icon_Circle_Color.png" width="50px"></a>
jQueryでチェックされた要素を取り出す方法

#find("セレクタ")
もちろん、thisを使えばformタグに対して要素を取得できます。
ただ、タグの属性そのものだけを取得したい場合にはfindを用います。
基本的な用途はRubyと同じですが、
**jQueryのfind()メソッドは、引数にセレクタを指定して、合致するセレクタを全て取得します。**
この二刀流を覚えておくと役に立ちます！
「指定されたデバイスが見つかりません」と怒られたときの対処法（UEFIブート）

##前提条件
UEFIでインストールしたWindows 10 Ver.1909
##なぜこうなったか
Linuxで遊んでたらうっかりやってしまった（ぽい）
##治し方
BCDファイルを消してWindows REかインストールメディアで　　　　
    bcdboot X:/Windows /l ja-jp （Xの部分は各自書き換えて）
ってやったら治った
あと何故か
    bootrec /RebulidBcd
は「指定されてパスが見つかりません」って怒られた
##結論
起動しなくなったらまず    bootrec /RebulidBcd
bootrecが駄目なら    bcdedit X:/Windows /l ja-jp
こんな面倒なことしたくないならデュアルブートにするな

参考サイト
https://freesoft.tvbok.com/tips/efi_installation/uefi_bootrec.html
MacでFlexible Atomic Code（FAC）を使う

##はじめに
Flexible Atomic Code（FAC）は相対論的なHartree-Fock法によってプラズマ中の原子過程や発光スペクトル等を計算してくれるソフトウェアパッケージ。

gfortranを使ってインストールする方法をメモ。bashでもzshでもどちらでもOK。以前にインストールしたg77が残っているとハマので注意。

2020/5/28 内容に間違いがあったので更新（configureのオプション）

##参考
・FAC website（基本的に全ての情報はここにある。）
https://www-amdis.iaea.org/FAC/

・他の原子コードとの比較についての解説
http://www.atomiccollision.jp/collision/syoutotsu/10_0701s.pdf

##環境
・macOS Catalina 10.15.4

##準備
・App StoreからXcodeをダウンロードしてインストールしておく。
・Fortranコンパイラ（gfortran）が動作することを確認。ターミナルで

```
$ gfortran -v
```
と打ってgcc version 9.3.0 のように返ってくればok。

```gfortran: command not found```と返ってくる場合は、gfortranをinstallする必要がある。

##gfortranのインストール（必要な場合のみ）
gfortranが入っていない場合は、以下の方法でインストールする。既にHomebrewが入っているひとは方法２がおすすめ。

方法１：バイナリパッケージでインストール（とりあえずの人向け）
https://github.com/fxcoudert/gfortran-for-macOS/releases
にアクセスして、gfortran 8.2 for Mojaveから、fortran-8.2-Mojave.dmgをダウンロード。gfortran.pkgを開いてインストールする。（for Catalinaはないが、for Mojaveで動くのでOK。2020/5/30）

方法２：Homebrewでgccをインストールする（これからプログラミングの環境構築していきたい人向け）
[Mac OS (Catalina) にHomebrewでgnuplot5をインストール](https://qiita.com/atmol/items/b0a12753a38782d5450c)を参考にして、まずHomebrewをインストールし、

```
$ brew update
$ brew install gcc
```
とすればgfortranがインストールされる。エラーが出る場合は参考ページの後半を参照のこと。

##FACのインストール
Githubからソース（ZIPファイル）をダウンロードして解凍するとfac-masterフォルダができるので、適当な場所に保存。
https://github.com/flexible-atomic-code/fac

 <img width="288" alt="image.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/644660/b34672e3-721d-d6b3-1d1d-477cc842e092.png">

ターミナルで、fac-masterディレクトリに移動し、

```
$ ./configure
$ make
$ sudo make install
```

を順番に実行。


makeではたくさんwarningが出るがとりあえず無視して大丈夫そう。

```
$ which sfac
/usr/local/bin/sfac
```
となれば成功。
さっそく計算してみよう。

##makeでエラーが出る場合（g77関連）
```
g77: Bad CPU type in executable
```
が出る場合はfortranコンパイラとしてg77が呼ばれている。Catalinaでg77は動かないので、g77を削除する。まずwhichコマンドでg77の場所を調べる。

```
$ which g77
/usr/local/bin/
```
であれば、

```
$ sudo rm /usr/local/bin/g77
```
として削除。/usr/local/bin/の部分は環境によって異なるのでwhichで返ってきたPATHを入力する。

#makeでエラーが出る場合（gfortran関係）
```
Undefined symbols for architecture x86_64:
  "__gfortran_concat_string", referenced from:
      _dhseqr_ in libmlapack.a(dhseqr.o)
      _dormbr_ in libmlapack.a(dormbr.o)
      _xermsg_ in libfac.a(xermsg.o)
      _dormlq_ in libmlapack.a(dormlq.o)
      _dormqr_ in libmlapack.a(dormqr.o)
               :
               :  # いろいろ
               :
clang: error: linker command failed with exit code 1
```
が出る場合は、gfortranが正しくインストールされていない可能性が高い。
「gfortranのinstall」を再確認。
jQueryでフォームを取得する方法

#フォームの情報を取得するために
結論、submitというイベントを使います。
submitイベントはフォームが送信された時に呼び出されます。
以下のようなウェブページを準備しました。

<img width="370" alt="jQuery_Checkbox_Practice.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/625088/faa18a90-6b25-d8cc-308f-cd4cb1887203.png">

この送信ボタンを押した際の流れをみていきたいので
以下のようなコードを施しています。

```javascript
$(function() {
  $("form").on("submit", function() {
    console.log("送信ボタンが押されました");
  });
});
```
これで送信ボタンが押された際にコンソール画面に
「送信ボタンが押されました」と表示されるはずです。
しかし、実際にやってみると一瞬で表示されて、
一瞬にして消えてしまうはずです。

##preventDefault()
消えてしまう原因を考えてみましょう。
送信ボタンを押した後、ウェブページがリロードされてしまうため
初期の状態に戻ってしまうからです。
「この初期の状態に戻る」というイベントをキャンセルしたいため、preventDefault()を用います。
なので以下のコードにしてみましょう

```javascript
$(function() {
  $('form').on('submit', function(a) {
    console.log('送信ボタンが押されました');
    a.preventDefault();
  });
});
 ```

この関数の流れは引数aにpreventDefault()を入れています。
この中身をもっと詳しくみるためにconsole.logを使ってみていきます。
以下、検証画面です。

<img width="1219" alt="jQuery_Checkbox_Practice.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/625088/539e20b7-58f7-ac1d-9c1c-cfa55abd5d82.png">
送信しましたの下のところにconsole.log(a)の結果が書いています。
これをイベントオブジェクトと言うのですがイベントの発生元の要素や押されたキーの種類などを知ることができます。
RSpec RequestSpecでsessionを利用する


Rspec request specでセッションの読み込み、書き込みを実現してみる

今回はActionDispatch::Requestのsessionメソッドを上書きする形で対応します

```ruby
allow_any_instance_of(ActionDispatch::Request).to receive(:session).and_return({})
```

### 事前にセッションを書き込む方法

`rails_helper.rb` に上記のsessionメソッド上書きを実装します

```ruby:rails_helper.rb

RSpec.configure do |config|
  # ...

  # テストケース共通の事前処理
  config.before(:each) do

    # let(:rspec_session) で指定された値を セッションの初期値とします
    session = defined?(rspec_session) ? rspec_session : {}

    # destroyメソッドを実行してもエラーにならないようにします（必要であれば）
    session.class_eval { def destroy; nil; end } 

    # sessionメソッドを上書き
    allow_any_instance_of(ActionDispatch::Request).to receive(:session).and_return(session)
  end
end
```

以下のように テストコード内の変数でセッションの初期値を設定できます

```ruby
let(:rspec_session) { { user_id: 1 } }
```


### 事前にセッションを書き込む＆実行後のセッションを取得する方法

`config.add_setting()` を使用し、session変数をグローバルで扱えるようにします

上記の `rails_helper.rb` に更に追記します

```ruby:rails_helper.rb

RSpec.configure do |config|
  # ...

  # テストケース共通の事前処理
  config.before(:each) do

    # let(:rspec_session) で指定された値を セッションの初期値とします
    session = defined?(rspec_session) ? rspec_session : {}

    # destroyメソッドを実行してもエラーにならないようにします（必要であれば）
    session.class_eval { def destroy; nil; end }

    # 追記 実行後のセッションを取得できるようにする
    config.add_setting(:session, :default => session)

    # 変更 sessionメソッドをRSpec.configuration.sessionで上書き
    allow_any_instance_of(ActionDispatch::Request).to receive(:session).and_return(RSpec.configuration.session)
  end
end
```

テスト実施後に `RSpec.configuration.session` を取得することで、実行後のセッションを確認できます

```ruby
expect(RSpec.configuration.session[:user_id]).to eq 1
```

### 参考にしました

[Method: RSpec::Core::Configuration\#add\_setting](https://rubydoc.info/github/rspec/rspec-core/RSpec%2FCore%2FConfiguration:add_setting)

**いいね！と思ったら LGTMお願いします**👍
AWS SageMakerのバッチ推論が思っていたのと違った話

## 背景

機械学習で学習・推論を行うに当たり、AWS SageMakerを利用しています。
今回は独自モデルを利用して **バッチ推論を実施する際** にハマったお話で、扱っているデータは画像です。
※本来、学習→推論の流れになりますが、学習を割愛しているため若干記事として読みにくいかもしれません。

## 推論とは

作成したモデルを利用して、元となるデータから予測される結果を出力することを「推論」と記載しています。
AWS SageMakerでの推論方法は主に下記の2パターンあります。

- リアルタイム推論
- バッチ推論

## リアルタイム推論

リアルタイム推論はイメージしやすいです。

----
#### リアルタイム推論の流れ

1. Estimatorインスタンスを生成し、deployメソッドを呼び出す
2. 指定したモデルを包含したHTTPエンドポイントが起動される
    - ```docker run image serve``` でコンテナ起動
    - モデルはEstimatorインスタンス生成時の引数で指定
    - ECRに登録済みのコンテナを起動し、HTTPエンドポイントを設定
        - /invocationsと/pingを定義しておく
        - /pingは200を返せば良いが、監視としても利用できる
3. /invocationsに推論元データをPOSTして推論結果を出力させる
    - 推論結果はHTTPレスポンスとして返却
4. 停止指示しない限り、エンドポイントは起動したまま

----

#### 推論時のイメージ
![structure.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/536396/1f2a78e0-6d36-f29f-f0e1-faee701f9d0f.png)

#### 参考URL
- [ホスティングサービスでの独自の推論コードの使用](https://docs.aws.amazon.com/ja_jp/sagemaker/latest/dg/your-algorithms-inference-code.html)

## バッチ推論

本題です。
自分が元々想像していたのは、以下のような流れでした。

- 指定したモデルを包含したバッチジョブ(スクリプト)を定義
- S3上の推論元データが逐次スクリプトに渡され、指定出力先にアウトプット
- 推論元のデータを全て処理し終わったら完了

そもそも「バッチジョブ(スクリプト)を定義」の時点で違いました。
やっていることはほとんどリアルタイム推論(上の「推論時のイメージ」)と同様で、違いとしては **「推論実施までの流れ」** と **「コンテナの挙動」** です。

----
#### バッチ推論の流れ

1. boto3のSageMakerインスタンスを生成し、create_transform_job()で呼び出し
    - create_transform_job()は非同期で実行される
2. (内部的に)指定したモデルを包含したHTTPエンドポイントが起動される 　
    - ```docker run image serve``` でコンテナ起動
    - モデルはcreate_transform_job()に渡すjson引数に定義
        - S3上のINPUT/OUTPUTもこの引数内で指定する
        - (どういう風に渡されるのかドキュメントから読み取れない...)
    - ECRに登録済みのコンテナを起動し、HTTPエンドポイントを設定
        - /invocationsと/pingを定義しておく
        - /pingは200を返せば良いが、監視としても利用できる
3. /invocationsにINPUTとして指定したS3パスのファイル群が、一つずつPOSTされる
    - 推論結果はHTTPレスポンスとして返却
    - 返却内容は、OUTPUTに指定したS3に「INPUTに与えられたファイル名.out」としてupされる
4. S3のファイル群を処理し終わったらコンテナ停止

----

#### 参考URL
- [バッチ変換での独自の推論コードの使用](https://docs.aws.amazon.com/ja_jp/sagemaker/latest/dg/your-algorithms-batch-code.html)

## 所感

個人的にSageMakerのバッチ推論は **「理解し辛いのでは」** 、、というのが所感です。

- 「バッチ」という名前と挙動に大きな剥離がある
    - 自分が勝手に想像していたイメージではあるものの...
- 学習時の作業ともかなり異なる
    - 学習時はS3のパスとコンテナ内のパスを紐付けながらの作業
    - 推論時もS3のデータをコンテナ内にコピーできそうだが、できない

また、下記の「まだ分かっていないところ」も含めて、利用シーンが想定できていません。

#### まだ分かっていないところ

- 通常運用だとjupyter notebookを介して呼び出せない
    - リアルタイム推論はエンドポイントが起動したままなので扱いやすい
    - バッチ推論はどう呼び出すのが適切？
- 何度か試している限りコンテナの起動に4分くらいかかる
    - 毎回4分かかっていたらさすがに使い勝手が良くない
    - 高速化する方法はないものか

## 最後に

もちろん、以下の利点もあります！

- リアルタイム推論とバッチ推論で共通のIFにできる
- バッチ推論は処理が終わったらコンテナも停止される
    - 無駄なコストを節約できる

その他、自分の理解が追いついてないところも多々あるかもしれません。
調べていく内に、もっと良い利用方法が見つかったら改めて記事にしたいなと思います。
Jetson 開発ボードの拡張コネクタ ピンレイアウト比較表

# はじめに
Jetson Xavier NX 開発ボードが発売されたので拡張コネクタ (J12) のピンレイアウトを調べてみた。
ピンアサイン、GPIO 番号、I2C Bus 番号などが異なるため、TX1、TX2、AGX Xavier、Nano との比較表を作成。

### 簡易比較表 (ピンアサイン、I2C Bus 番号)
<img width="1016" alt="スクリーンショット 2020-05-27 14.30.30.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/72479/26d9b2b6-009d-b445-0cff-cfc6dac4803a.png">

### 比較表 (ピンアサイン、I2C Bus 番号、GPIO 番号)
<img width="1443" alt="スクリーンショット 2020-05-31 9.11.24.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/72479/db9cdc02-7d84-7ea6-cf02-15b406118be8.png">

### Google スプレッドシート
<a href="https://docs.google.com/spreadsheets/d/1WbbwcFHq0iKIFoNBZiV0206SAhDgXAzvg2cpYTJGzHU/view#gid=670057269">Jetson-GPIO-mapping_v2</a>

## 参考情報
### Jetson Xavier NX
Jetson Download Center からダウンロードできる仕様書 (Figure 3-1、Table 3-3)
<a href="https://developer.nvidia.com/jetson-xavier-nx-developer-kit-carrier-board-specification-p3509-a01">Jetson_Xavier_NX_DevKit_Carrier_Board_Specification_v1.0.pdf</a>

ピンアサインと GPIO の情報 (gpio_pin_data.py のソースコードから情報を取得)
<a href="https://github.com/NVIDIA/jetson-gpio/blob/master/lib/python/Jetson/GPIO/gpio_pin_data.py">Jetson.GPIO - Linux for Tegra</a>

### Jetson Nano
https://www.jetsonhacks.com/nvidia-jetson-nano-j41-header-pinout/
https://www.slideshare.net/NVIDIAJapan/getting-started-with-jetson-nano

### Jetson AGX Xavier
https://www.jetsonhacks.com/nvidia-jetson-agx-xavier-gpio-header-pinout/

### Jetson TX2
https://www.jetsonhacks.com/nvidia-jetson-tx2-j21-header-pinout/

### Jetson TX1
https://www.jetsonhacks.com/nvidia-jetson-tx1-j21-header-pinout/
ReactでHTMLヘッダを変更する

## 概要

`react-helmet`を利用する。
どこからでもHTMLヘッダを変更できる。

## 使い方

### 導入

```
yarn add react-helmet @types/react-helmet
```

### タイトルの変更

```tsx
import React from 'react';
import { Helmet } from 'react-helmet';

const title = 'Help';

const Help = () => (
  <>
    <Helmet>
      <title>{title}</title>
    </Helmet>

    <h1>{title}</h1>
    <p>
      This is Help page ... 
    </p>
  </>
);

export default Help;
```

## まとめ

簡単に変更できる。
SPAとかで、ページによってタイトルを変更したいときに便利。
他にも変更できるので、以下を確認する。
[https://github.com/nfl/react-helmet](https://github.com/nfl/react-helmet)
Zabbix5.0をdocker-composeで速攻起動する

# はじめに

Zabbix5.0 LTSがでましたね。少し触る必要が出てきたのですが、docker-composeで10分くらいでシュッとあげたかったのでメモしておきます。

# 環境

- AmazonLinux2
    - パッケージマネージャの部分以外は他のディストリビューションでも手順は同じです。

# OS・dockerの設定

AmazonLinux2を起動して、dockerとgitをまずはインストール

```
yum -y install docker
```

```
yum -y install git
```

docker composeも入れますよ([公式の手順はこちら](https://docs.docker.com/compose/install/))

```
sudo curl -L "https://github.com/docker/compose/releases/download/1.25.5/docker-compose-$(uname -s)-$(uname -m)" -o /usr/local/bin/docker-compose
sudo chmod +x /usr/local/bin/docker-compose
```


dockerを起動しておきます。

```
systemctl restart docker
```

# Zabbixの設定

公式リポジトリからリポジトリの内容をcloneしましょう

```
git clone https://github.com/zabbix/zabbix-docker.git
```

composeファイルを修正していきます

GUIは80で見れるように修正しておこう（nginxの部分でももちろんOKです）

```docker-compose_v3_centos_pgsql_latest.yaml.org
 zabbix-web-apache-pgsql:
  image: zabbix/zabbix-web-apache-pgsql:centos-5.0-latest
  ports:
   - "80:8080"
```

proxyは一旦要らないから消す（お好みです）

```docker-compose_v3_centos_pgsql_latest.yaml.org

#zabbix-proxy-sqlite3は要らないのでコメントアウト（削除）
#zabbix-proxy-sqlite3:
#  image: zabbix/zabbix-proxy-sqlite3:centos-5.0-latest
#  ports:
#   - "10061:10051"
#
#   省略
#
zabbix-web-nginx-pgsql:
```

タイムゾーンは直しておこう

```.env_web
PHP_TZ=Asia/Tokyo
```

起動してみる

```shell
/usr/local/bin/docker-compose -f docker-compose_v3_centos_pgsql_latest.yaml up
```

# GUIにアクセスする

```
http://<zabbix host>/zabbix
```

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/57686/cd662293-d658-d63b-4f5a-31fe4c8e1df7.png)

id:Admin, Password:zabbixでログインしてみよう

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/57686/452103a7-e633-f567-c0fd-acec3c9b5be3.png)

日本語に直してみるのと問題を解消してみる

# 日本語化

User settings→LanguageでJapanese(ja_JP)を選択して更新します。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/57686/c51f9c91-ebd5-c548-e9ce-2e69b919a54a.png)

ばっちりですね。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/57686/591db1cd-89fb-5b15-affd-15fdcd60e75f.png)

# Probremに出ている問題を直してみる。

これはagentが通信できないので出ているエラーです。zabbix内で名前解決してあげましょう

[設定]→[ホスト]を選択しZabbix serverの設定画面を開きます。

下記のように設定して更新ボタンを押します。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/57686/0ae7de8e-cdbe-4b0a-2cce-168ff695d729.png)

ダッシュボードが空になっていればOKです。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/57686/356cba08-e886-8ce3-b364-377b2587ef6f.png)

# おわりに

APIを試すとかそういった目的であればdocker-composeはとても手軽でよい手段ですね。
WSlで，Vue.jsによるアンドロイドアプリ開発環境を構築しようとしたときにハマった


備忘録
---
[【Vue.js】WSL 上で Vue.js を用いた Android アプリを開発する](https://qiita.com/Saya_K/items/90277a9bc8f09cafe676)
こちらを用いて，よっしゃ開発環境作るどーーと意気込んでいたら…

```bash

sudo $ANDROID_HOME/tools/bin/sdkmanager "tools" "emulator" "platform-tools" "platforms;android-28" "build-tools;28.0.3" "extras;android;m2repository" "extras;google;m2repository"

Error: Could not find or load main class com.android.sdklib.tool.sdkmanager.SdkManagerCli
```

とのエラーが出た．調べていると，JDKが8よりも新しいものを使うとうまくいかないとのこと．この段階で最新版のjava14を入れていた．
入れなおしてもう一度！


としたが変わらなかった．いろいろ探しまくった結果，以下でsdkmanagerのバージョンを古くするといけた．


[エラー：メインクラスcom.android.sdklib.tool.sdkmanager.SdkManagerCli ＃5304が見つからないか、読み込めませんでした](https://github.com/NativeScript/nativescript-cli/issues/5304)


https://dl.google.com/android/repository/sdk-tools-linux-4333796.zip
結局これでダウンロードしたtoolsに置き換えるとうまくいった．

めっちゃ悩んだのにあっけない…
というか，最新のを使う方法はないんでしょうか？
Egret Engine豆知識



## CLIで書き出すには？

`egret publish --version <バージョン名>`

`bin-release/<バージョン名>`に書き出されます


## runコマンドで開いたときにQueryStringでパラメーターを渡す

`egretProperties.json`の`urlParams`に下記を記載すると

`http://localhost:3000/index.html?access-token=...&user-id=...&application-key=...`が開きます

```json:egretProperties.json
{
:
  "urlParams": {
      "access-token": "...",
      "user-id": "...",
      "application-key": "..."
  }
}
```
【Go1.14】GOPATHが$HOME/goから変わらない時にやった事

# 前提
- 私のPC & OS
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/317515/62efac04-c6a3-6b87-d77d-0ee4de590474.png)

- goのversion

```
~ » go version
go version go1.14.3 darwin/amd64
```

# 困った事
- 環境変数を上書きしてPATHを設定しても、GOPATHだけがデフォルトから変わらない。

```.bash_profile
export GOPATH=/Users/myname/workspace/go
export GOROOT=/Users/myname/sdk/go1.14.3

export PATH=$PATH:"$GOROOT/bin"
export PATH=$PATH:"$GOPATH/bin"
```

```
~ » go env GOPATH
/Users/myname/go
```

# やったこと

- ヘルプコマンドから[公式Wiki](https://golang.org/wiki/SettingGOPATH)に辿り着く

```
~ » go help gopath
The Go path is used to resolve import statements.
It is implemented by and documented in the go/build package.

The GOPATH environment variable lists places to look for Go code.
On Unix, the value is a colon-separated string.
On Windows, the value is a semicolon-separated string.
On Plan 9, the value is a list.

If the environment variable is unset, GOPATH defaults
to a subdirectory named "go" in the user's home directory
($HOME/go on Unix, %USERPROFILE%\go on Windows),
unless that directory holds a Go distribution.
Run "go env GOPATH" to see the current GOPATH.

See https://golang.org/wiki/SettingGOPATH to set a custom GOPATH.

省略
```

- Go1.13との記載があるコマンドを実行
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/317515/0e7caea9-1a0c-cb32-d642-7b00bd60b479.png)

```
go env -w GOPATH=$HOME/go
```

- 無事に変更された

```
~ » go env GOPATH
/Users/myname/workspace/go
```

# 後書き

Go1.13から新しい設定手順ができたのかな？
色々調べて過去の情報やちょっと違う手順で少し詰まってしまいました。
公式の手順に従うのが一番最速ですね。

# 参考記事

[SettingGOPATH - golang.org](https://golang.org/wiki/SettingGOPATH)
git で rebaseをするときのコマンドフロー


ネットで検索しても中々見つけられなかったので、
git rebaseのコマンドフローを書き記しておきます :pencil: 
GUI使わずコマンドでgitを扱う方は参考になるかもしれないです :thinking: 

ちなみに環境ですが、
mac & VSCodeでターミナルを開いて行っています:smirk: 

## その前に
変な空白が入ってたりすると、
Whitespace云々でgit rebase中に怒られてしまうので、
VSCodeをお使いの方はsettings.jsonに下記設定を追加しておいてください！

```json
"files.trimTrailingWhitespace": true
```

## Here We Go !!
ではここから作業フローになります。
開発ブランチ名 : develop
自分の作業ブランチ名 : feature-branch
の場合を想定して進めていきます:+1: 

$はbashで進めた時を想定してつけているので、各々の環境で適宜脳内変換してください〜！

```bash
// 作業をコミットしておく
$ git add [作業ファイル]
$ git commit -m "作業メッセージ"

// 開発ブランチへ移動
$ git checkout develop

// 最新のもの必ずとってきてください！
$ git pull origin develop

// 自分の作業ブランチに戻ってから開発ブランチをrebase
$ git checkout feature-branch
$ git rebase develop

// ⭐️rebase中にconflictしなかった場合
// おめでとうございます🎉 pushしてしまいましょう
// 一回でもpushした場合
$ git push --force-with-lease origin feature-branch
//もしくは
//※今回が最初のpushだったら--forceはなくてもいけると思います
$ git push origin feature-branch

// ⭐️rebase中にconflictしてしまった場合
// とりあえず確認してファイルを治しましょう
$ git status
// commitはせず、add のみ
$ git add [conflictしてるファイル名]
// 次のcommitに行きます。そこでもconflictしたら↑と同じことしてください
$ git rebase --continue
```

全て終わったら、[⭐️rebase中にconflictしなかった場合]に飛んでください

ちなみにrebase自体やり直したいときは、自分の作業ブランチで

```bash
$ git rebase --abort
```

rebase後に間違って自分の作業ブランチをpullしてしまった場合は

```bash
$ git merge --abort 
```


でなかったことにできるので安心してくださいね :relaxed:
three.jsのloaderからverticesを抜き出そうと四苦八苦したこと

#結論
配列.array[index]

##背景
Three.jsでPLYオブジェクトをロードして
その頂点を取得したかった。
あとjsは10年ぶりぐらいに触ったので文法周りはすべて飛んでます。

##罠1:バージョン
githubのPLYLoaderと使ってたthree.minのバージョンがあってなくて
setattribute→addattributeに代わってて書き換えた

##罠2：ローダーの内部構造
てっきり3Dオブジェクト格納の仕方は同じだと思ってたら
buffer格納するときにFloat32Arrayに詰め込まれてて
lengthじゃなくてcountだった

##罠3:配列アクセス
配列[index]で何故か取得できなくてundefinedになってて
けどデバッグからはFloat32Arrayの中身が見えてて
12時間悩んでstackoverflowで全く同じ質問見付けて
配列.array[index]で取れた。

こういう書き方だったっけ？ともかく取れたのでよし。
JavaScriptのロゴを調べた話（そしてわからなかった話）

## 謎ロゴとの出会い

先日、YouTubeでプログラミング関係の動画を見ていたらJavaScriptの話題とともにこんな画像が出てきました。

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/16060/0d87e606-19ee-c71f-cc36-3252762be078.png" width=50%>

これを見て僕は「あちゃー、JavaとJavaScriptを混同しちゃってるのね:sweat_smile: 初心者よくある、どんまい:hand_splayed:」と思い、コメント欄に「JavaとJavaScriptは別物ですよ😃」と書き込み、送信ボタンを押そうとしたその瞬間、突然嫌な予感がしてその手を止めました。

（いや、動画内で一瞬表示させるためにJavaのアイコンとテキストを組み合わせてロゴを作ったとは思えないし、このロゴは本当に存在しているのでは…？）

ググってみたら案の定、素材として配布されているロゴでした。

<img width="1269" alt="スクリーンショット 2020-05-27 12.17.56.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/16060/99ced922-1c1f-1bd4-f395-c724edcb8c48.png">

## JavaScriptの公式ロゴ

現在、JavaScriptに公式ロゴは存在しません。（そもそも現在の「公式」というのがEcma InternationalなのかMozillaなのかJavaScriptの商標を持っているSun/Oracleなのかという話もあるのですが）
よく見かける、黄色地に黒文字でJSと書かれているロゴは「[JS Logo By The Community](https://github.com/voodootikigod/logo.js)」です。
盾っぽいロゴは[W3CによるHTML5のロゴ](https://www.w3.org/html/logo/)に合わせて同じスタイルでCSS3とJSが作られたものだと思われます。（W3CがCSS3のアイコンを提供しているにもかかわらず、別でCSS3の盾デザインが存在しているので、その流れでJSも作られたのではと思っているのですが、ソース無しなので自信ないです）

なのでこの謎ロゴが存在する理由として以下のものが考えられます。

1. 過去にいずれかの公式だったもの（あるいはそれを加工したもの）
2. JavaScriptコミュニティ向けなど何かしら真面目な理由で作られたもの
3. Java≠JavaScriptのパロディとして作られたもの

1はかなり大穴ですが、Java人気にあやかってLiveScriptがJavaScriptに名前を変えたくらいなので、当時はJavaに合わせたロゴにしていたという可能性は捨てきれません。

## 謎ロゴの出自を探る

謎ロゴ自体の出自がわかれば話は簡単なのですが、画像検索をしてみても素材配布サイトばかりヒットしてなかなか情報が出てきません。
代わりにJavaScriptの歴史を紹介する[スライド](https://www.slideshare.net/invider/wdb0051-java-script-for-java-developers#12)や[記事](https://medium.com/@muthudevendra/java-and-javascript-9171f53aab07)、[コミュニティカレッジのコース紹介](https://www.bucks.edu/itacademy/development/)などで登場しているのを発見しました。
やっぱり過去に公式ロゴだったのでは？という気持ちが出てきます。

## JavaScriptの過去のロゴを探す

[NetscapeのJavaScriptドキュメント(Internet Archive)](http://web.archive.org/web/19990221114440if_/http://developer.netscape.com/docs/manuals/javascript.html)やEcma International、Mozilla、Google Booksで初期のJavaScriptの洋書、YouTubeのNetscape利用動画などを当たってみましたが、JavaScriptのロゴは謎ロゴ含めて全く登場しません。
アメリカ合衆国特許商標庁の商標検索では図案付きのJavaの商標(Serial Number 76495912)は見つかったもののJavaScriptの商標(Serial Number 75026640)には図案がありませんでした。

## いかがでしたか？

JavaScriptの謎ロゴについて調査してみましたが、結局わかりませんでした。
このロゴを知っているよ！という方がいましたら、ぜひコメント欄で情報をお寄せください。

## 謝辞

もともとはQiitadonに何気なく投稿した謎ロゴの話ですが、ユーザーの皆さんの協力があってこの記事がまとまりました。
一緒に調査してくれた方、⭐で後押しをしてくれた方、ありがとうございます。
（もし記事に事実誤認やつまらないジョークが含まれていた場合、その責は私にあります）

## おまけ

謎ロゴが載ってる謎ページ
http://computerprogrammingsteppingstone.weebly.com/java-script.html
白背景に白文字の怪しさもさることながら、さらに新しい謎ロゴが登場して調査団を混乱させる。
新しい謎ロゴはGoogleの画像検索では類似画像が見つからないものの、Bingの画像検索に突っ込んだところ機械的に作られたロゴらしいと判明するが、それでもやっぱり存在が謎すぎる…
<img width="1249" alt="スクリーンショット 2020-05-27 14.00.49.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/16060/f658e527-ac59-c20f-c948-06efe3f32317.png">
railsでGoogleMapAPIの導入

## このページのコードでできること
・自分のrailsプロジェクトにGoogleMapを埋め込み、表示させる。
・ページを開いたら地図と、初期値のマーカーを表示させる。
・inputボックスと検索ボタンを用意。
・inputボックスに検索したい場所を入力し、検索ボタンを押すことでその場所の地図を表示。


## Maps JavaScript API ＆ Geocoding APIの取得

これら記事にお世話になりました。（参考文献より）

[コードを書く前に]
(https://qiita.com/nagaseToya/items/e49977efb686ed05eadb)
[Google Maps API を使ってみた]
(https://qiita.com/Haruka-Ogawa/items/997401a2edcd20e61037)
[Google MAP 名称から場所を検索・特定する](https://qiita.com/yoshi_yast/items/521c1f36306a180f45dd)
[オリジナルアプリ作成　〜RailsでGoogleMap利用検証〜]
(https://note.com/daddy0055/n/nddbe8da38bbc)


## コード


postsに記述するとします。
@post.locationは一例です。ご自身のアプリケーションにふさわしい初期値を入れてください。

```html:posts/index.html.erb
<div id='target'></div>

<div class='map-btn'>
<input id="address" type="textbox" value="<%= @post.location %>">
<input type="button" value="検索" onclick="codeAddress()">
<div>

<script src="https://maps.googleapis.com/maps/api/js?key=自分のAPIキー&callback=initMap" async defer></script>

```

```scss:style.scss
#target {
  height: 300px;
  width: 300px;
}
```

Javascriptの記述

```javascript:post.js

let map
let geocoder
let centerp = {lat: 33.60639, lng: 130.41806}

function initMap(){
  geocoder = new google.maps.Geocoder()

  map = new google.maps.Map(document.getElementById('target'), {
    center: centerp,
    zoom: 12,
  });

  marker = new google.maps.Marker({
    position: centerp,
    map: map
  });
}

function codeAddress(){
  let inputAddress = document.getElementById('address').value;

  geocoder.geocode( { 'address': inputAddress}, function(results, status) {
    if (status == 'OK') {
      map.setCenter(results[0].geometry.location);
      var marker = new google.maps.Marker({
          map: map,
          position: results[0].geometry.location
      });
    } else {
      alert('該当する結果がありませんでした：' + status);
    }
  });   
}

```

## 参考文献

大変お世話になりました。感謝。

コードを書く前に
[https://qiita.com/nagaseToya/items/e49977efb686ed05eadb]

Google Maps API を使ってみた
[https://qiita.com/Haruka-Ogawa/items/997401a2edcd20e61037]

Google MAP 名称から場所を検索・特定する
[https://qiita.com/yoshi_yast/items/521c1f36306a180f45dd]

オリジナルアプリ作成　〜RailsでGoogleMap利用検証〜
[https://note.com/daddy0055/n/nddbe8da38bbc]
長いコマンドを簡単に実行してもらう方法

## コマンドを出力する

```sh
docker run --rm tukiyo3/wine32
```

* 以下のようにDockerfileの最後のCMDで echo する。
* [Dockerfile](https://hub.docker.com/r/tukiyo3/wine32/dockerfile)

```dockerfile:Dockerfile
CMD echo '\
docker run -it \
 --rm \
 --name=wine \
 \
 -e DISPLAY=$DISPLAY \
 -v /tmp/.X11-unix:/tmp/.X11-unix:ro \
 -v $HOME/.Xauthority:/home/wine/.Xauthority \
 \
 -v /run/user/$(id -u)/pulse/native:/run/user/1000/pulse/native \
 -v /dev/snd:/dev/snd --privileged \
 \
 -v $PWD:/c/host/ \
 tukiyo3/wine /bin/bash \
'
```

* 出力されたものをそのまま実行する

## 使用例


```sh
docker run --rm tukiyo3/wine32 > w32 && sh w32
```
【Golang】構造体④コンストラクタ

#【Golang】構造体④コンストラクタ
Golangの基礎学習〜Webアプリケーション作成までの学習を終えたので、復習を兼ねてまとめていく。 基礎〜応用まで。

```
//コンストラクタ
//__init__の部分を書く

//Pythonの場合 クラス、メソッド
/*
class Vertex(object):

    def __init__(self, x, y):
        self._x = x
        self._y = y

    def area(self):
        return self._x * self._y

    def scale(self, i):
        self._x = self._x * i
        self._y = self._y * i

v = Vertex(3, 4)
v.scale(10)
print(v.area())
*/

package main

import (
	"fmt"
)

type Vertex struct {
	X, Y int
}

//2
//コンンストラクタのカスタム
//Pythonの def __init__(self):のイメージ
//NewStruct()のようにする。
func NewV(x, y int) *Vertex {
	return &Vertex{x, y}
}

func main() {
	//1
	v := Vertex{3, 4}
	fmt.Println(v)

	v2 := NewV(3, 4)
	//メモリー
	fmt.Println(v2)
	//実態
	fmt.Println(*v2)
}

```
FirebaseCrashlyticsで強制クラッシュさせる時の方法が変わっていたお話

# 環境
- Xcode 11.4
- Swift 5.2
- FirebaseCrashlytics 4.0.0-beta.5

# 概要(2020/05/27時点)
FirebaseCrashlyticsで強制クラッシュをさせようとしたら、以下の二点で微妙に詰まったのでメモ書きとして残しています。
- シングルトンインスタンス取得の方法が変わっていた
- 強制クラッシュを起こすメソッドが消えていた

## シングルトンインスタンス取得
#### 以前のver
```swift
Crashlytics.sharedInstance()
```

#### 現在のver
```swift
Crashlytics.crashlytics()
```

## クラッシュさせる
#### 以前のver

```swift
Crashlytics.sharedInstance().crash()
```

#### 現在のver
公式ドキュメントによると `fatalError()` を使えとのこと。

```swift
fatalError()
```

# 引っかかった原因
日本語のドキュメントのみ更新されていませんでした...

[Crashlytics 公式ドキュメント(日本語)](https://firebase.google.com/docs/crashlytics/force-a-crash?hl=ja&platform=iOS)

[Crashlytics 公式ドキュメント(英語)](https://firebase.google.com/docs/crashlytics/test-implementation)
Wi-Fiオンオフ両方をこなせるショートカットを作ろう

## 前置き
iOSショートカットを使うと、Wi-Fiを完全にオフにできるので便利です。
ただ、「Wi-Fiオンの方も作ってホーム画面に配置する」となると二つもアイコン枠が必要なので少し邪魔です。
そんな問題を解決するために、「Wi-Fiオンオフを切り替えられる(=トグル式)ショートカット」を昔作ったので備忘録として書いておきます。

## レシピ
![4EF57D4E-F0CF-4C43-8C29-84AD064E93D0.jpeg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/561438/5c55a4da-d7d9-24d7-8274-bc45d523d9ee.jpeg)

ショートカットからホーム画面に戻る方法はいくつかありますが、[supermamon](https://routinehub.co/user/supermamon)さんの[Springboard](https://routinehub.co/shortcut/2900)を使って戻る方法がぶっちぎりで早いのでおすすめです。

## 実際に使ってみた
![48892E2E-2329-4C2D-8C2B-3F9F2331A60C.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/561438/6f7b1e06-47cf-f0db-c594-fa841c988824.gif)

今回使ったショートカットのURLは[こちら](https://www.icloud.com/shortcuts/2812ae535c0e4ce4a5e5f14d0d5852b1)
なぜか画面がブラックアウトしたとき


メモ

アプリ作ってたらあるタイミングで急に画面が完全にブラックアウトして何も表示されなくなった。

プロジェクト丸ごと昇天したのかと思ったがそんなことはなかった。

SceneDelegateで予め宣言されているwindow変数を使わずに新しくwindow変数を定義して使っていたせいらしい。

(何が違うんだ、、？)
プログラミング初学者備忘録　javascriptのsplitでつまずいた

##readlineで出力しようとしたらsplit is not a function.出てため息。

```
const lines = ['300 200 100']
const hairetu = lines.split(" ");
```
この書き方でsplit()使ったがエラー

```
const hairetu = (String(lines).split(" "));
```
で解決
##原因
ちゃんと型宣言してあげてなかったから起こったので気をつけます
MS Learnおすすめラーニングパス 5月号 【Cognitive Services編】

## MSLearnのおすすめラーニングパス第4弾！【Cognitive Services編】

AIがやっと手に届くようになってきました！5月は、Cognitive Servicesを使って、独自AIを開発するためのラーニングパスを紹介します。
 
 - [Azure Cognitive Vision Services を使用してイメージを処理して分類する](https://aka.ms/Azure-Cognitive-Vision-Services-LP)：Cognitive Vision Services を使用して、顔を検出し、イメージをタグ付けして分類し、オブジェクトを特定する方法を学べるラーニングパスです。
 
 - [Azure Cognitive Speech Services を使用し、音声を処理して翻訳する](https://aka.ms/Azure-Cognitive-Speech-Services-LP)： Cognitive Speech Services を統合することによって、ご利用のアプリケーション内で音声をテキストに変換し、特定の話者を認識する方法を学べるラーニングパスです。

 - [Azure Cognitive Language Services を使用してテキストを評価する](https://aka.ms/Azure-Cognitive-Language-Services-LP)：Cognitive Language Services を使用して、テキストの分析、意図の判断、成人向けテーマの検出、自然言語の入力の処理を行う方法を学べるラーニングパスです

 - [Azure Bot Service を使用してインテリジェントなボットを作成する](https://aka.ms/Azure-Bot-Service-LP)：顧客がテキスト、グラフィック、または音声を使用して会話でコンピューター アプリケーションとやりとりできるようにするには、ボットを使用して実現できます。シンプルな質疑応答の対話の場合もあれば、インテリジェントな方法で人がサービスと対話できる高度なボットもあり、その場合は、パターンマッチング、状態の追跡、人工知能の技法が使用されて、既存のビジネス サービスと十分に統合されます。チャット ボットをビルドして、QnA MakerとLUISを統合することでボットにインテリジェンスを追加する方法について説明します。

※ [MS Learn](https://aka.ms/MSLearn-Japan)はマイクロソフトのラーニングプラットフォームです
Zoom飲みでできる！！ジャストワン風協力型お題推測ゲームをFlask+Herokuで作ってみた

# はじめに
私は、ボードゲームが好きだ。
ビールを飲みながらボードゲームをしている瞬間が至福だ。

しかし、コロナウイルスの影響によって直接会ってボードゲームをすることが難しくなっている。
Zoomでもボードゲームを出来無いかと試したが、市販のボードゲームは直接集まってプレイすることが前提で作られているため、どうしても違和感があった。

そこで、Zoomとの親和性の高い、Webブラウザでできるゲームがあれば違和感は消え、面白いのでは無いかと考えた。
お題を推測して当てるシンプルなゲームを作成した。
名前は、[**「ポレゲス」**](https://www.poreguess.com/)だ。

ゲーム自体は、**ジャストワン**に似たゲームである。
今回は、そのゲームの概要や実装方法などをまとめていこうと思う。

参考：[【ゲーム紹介】ジャスト・ワン (Just One)｜同じヒント禁止！お題の正解数を競う協力ワードゲーム！！ | ニコボド｜ボードゲームレビュー＆情報系ブログ](https://nicobodo.com/archives/just-one.html)

 

# 作ったもの
**お題をヒントから当て、みんなで高得点を目指す協力型のゲーム**[**「ポレゲス」**](https://www.poreguess.com/)を作った。

回答者は、プレイヤーの提示するヒントとシステムが提供するスペシャルヒントからお題を当てる。
例えば、プレイヤーの提示するヒントが「ウィンブルドン」、「ボール」、「王子様」、「錦織圭」のときに、それらのヒントの共通項は「テニス」なので回答者はお題が「テニス」と推測することができる。

このように、**回答者がお題を推測できるようなヒントをプレイヤーが考えてあげることがこのゲームの肝**である。
スペシャルヒントを使うともう一個ヒントを見ることができる。


スペシャルヒントを使わずに正解すると**2**点、スペシャルヒントを使って正解すると**1**点、不正解だと**-1**点になる。
合計**8**回繰り返し、チームの合計得点を最大化することを目指します。

ただし、以下の2点の制約がある。
①ヒントはお題の「表記違い」「外国語/方言」「同系」「造語」「同音異義語」はNG
例）お題がテニスの時は、「てにす」、「庭球」、「tennis」はNG

②プレイヤー間でヒントが重複したときはヒントが無効

 

ブラウザで遊べるシンプルなWebアプリケーションとなっている。
以下のURLから無料で遊ぶことができる。↓
[**「Zoomで出来るリモートボードゲーム!協力型お題推測ゲーム ポレゲス」**](https://www.poreguess.com/)

 

## 遊び方
問題数：1回のゲームでお題は8問。
ゲーム人数：3~8人
準備するもの（ホスト）：パソコン、紙、ペン
準備するもの（ユーザー）：紙、ペン
プレイ時間：20~40分

### 遊び方動画 
[![abstract-100.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/121324/569a163b-f66a-da89-104b-a001343ba00b.png)]
(https://www.youtube.com/watch?v=Kpoet9uOYbY) 

# 実装内容（技術）
システムアーキテクチャとしては、flask+heroku+sqlie3を使って実装した。
flaskを用いたWebアプリケーション作成は初めてだったので、以下のチュートリアルをベースに作成していった。
参考：[Flask-tutorial](https://flask.palletsprojects.com/en/1.1.x/)

また、UIとUXを大幅に更新した第二弾からは弟が積極的にコミットしてくれたので、認識の齟齬をなくすためにAdobe XDで、ワイヤーフレームを作成した。レスポンシブ化も気合でやってくれた。

兼ねてからの憧れの独自ドメインもお名前.comを利用して700円ほど課金して取得した。
また、herokuの方にも課金する必要があったので700円ほど課金した。課金するとSSLの運用を自動化してくれるACMも使うことができた。
参考：[お名前.com](https://www.onamae.com/)

# お題
350個気合で考えた。一番しんどかった。
レベル分けも直感で振り分けた。
今後、プレイヤーが増えてきたら正誤の数によって精緻化していきたい。

# スペシャルヒント
## word2vec
Wikipediaをコーパスとしてmeacb+word2vecを使えば、結構近いヒントが得られるのでは無いかと思い、学習させて試してみた。
スペシャルヒントの意味の近さの%はこれが元になっている。

結果としては10個中1個程度くらいしかきちんとしたヒントとして使えなかった。
ただ、たまにとてもハッとするようなヒントも予測してくれた。（笑）
例)お題「帰宅難民」→ヒント「第二の災害」

## ランサーズ
word2vecがそこまで使えないことが分かったので、人的リソースに頼ることにした。

ランサーズと言われるクラウドソージングサイトで、350語のスペシャルヒントを発注した。プロジェクト形式にしたところ30件ほど応募が来たので1500円程度で2名にお願いすることができた。
1日で両名とも納品され、質もバッチリだったので非常に満足している。ただ、選定するのが少し面倒だった。
参考：[ランサーズ](https://www.lancers.jp/mypage)

# ユーザー数
GoogleAnalyticsを導入しているが、ユーザー数は日次で5~70人の訪問数がある。
Google Search Consoleを見たところ、「リモートボードゲーム」で検索してたどり着いているユーザーが多いようだ。

# 感想
友人や家族と[**「ポレゲス」**](https://www.poreguess.com/)をプレイしてみたら、十分面白くて満足だった。
ただ、ビールを飲むと全然ヒントが考えられない。。

# 今後の展望
ブログやゲーミングプラットフォームに載せることで日次で100人は継続して、訪問してもらえるようにしたい。
また、Youtuberにも使って行ってもらい、プレイ動画などを上げていってもらいたい。
ひとりで遊べるモードもモチベーションが維持できれば開発しようと思っている。

# 余談
Google Adsenseは落ちました。
いずれ、また申請してみます。
PostgreSQLのUPSERTを使う手順

# 概要

PostgresqlでUPSERTを使う準備についての備忘録
UPSERT は　**ON CONFLICT ON CONSTRAINT**　を利用して実行します。
ここで指定した一意制約などの制約に違反した場合にINSERTからUPDATEに処理を切り替えることで実装します。

# 制約を確認する
ここで利用する（エラーを起こしたい）テーブルの制約を確認します。

```
select table_name, constraint_name, constraint_type from information_schema.table_constraints where table_name='テーブル名'
```

こちらで確認してUNIQUE制約があれば **constraint_name** を控えておいてください。

```
 table_name |      constraint_name       | constraint_type 
------------+----------------------------+-----------------
 tableA     | tableA_pkey                | PRIMARY KEY
 tableA     | tableA_unique_id_key       | UNIQUE
```

# 制約を作る

UNIQUE制約がなければ制約を作らなければなりません。
ここで多くの方が迷ってしまうと思いますが、Postgresqlでは**UNIQUE制約とUNIQUEインデックスは別物**ということです。

UPSERTを使う場合は**UNIQUEインデックスではなくUNIQUE制約**がなければなりません。

制約を作るのは簡単です。ALTER TABLEでPRIMARY KEYを作るときと同じです。

```
alter table table名 add unique(column名);
```
こちらを実行したら「制約を確認する」の手順でUNIQUE制約のconstraint_nameを確認してください。

# 実際にUPSERTする

実際にUPSERTするSQLは以下です。
制約名は先ほど控えた制約名を指定してください。

```
insert into テーブル名(column名) values(値...) 
ON CONFLICT ON CONSTRAINT 制約名
DO
UPDATE SET column名=値
```
DOの後にUPDATE文を書けばいいですがこの場合、**table名も条件も必要ありません**。

```
insert into テーブル名(column名) values(値...) 
ON CONFLICT ON CONSTRAINT 制約名
DO NOTHING
```
この様にDOの後にNOTHINGをつければ一意制約違反を無視することができます。
例外を受けて一意制約だったら無視の様な処理を作らなくてもよいのでコーディングも処理負荷も楽になります。

オススメです。
Processingで複数のPC Engine miniのコントローラを使う

＃本記事はProcessingで複数のPC Engine miniのコントローラ使う方法のサンプルです。前の記事の続きです。
https://qiita.com/hextomino/items/8f6e0a08b15148a5d718

#はじめに
複数のUSBコントローラを認識するには、名前解決だとバッティングして困るので、その解決方法です。

#テスト環境
windows 8
processing 3.5.3
Game Control Plusライブラリ1.2.2

#説明
コントローラの名前を入れるところに、数字を入れるだけです。
この数字は、パソコンの環境によって変化するので、Gcp_ShowDevicesサンプルを使って番号を調べることになります。若い数字は、キーボードやらマウスやらに割り当てられています。私の環境ではコントローラは6,7でした。複数台使う場合は、クラス化した方がいいと思いましたので、２ファイルに分けてあります。

#ソースコード
```java:PCEnginePADs.pde
PAD pad[] = new PAD[2];

void setup() {
  pad[0] = new PAD(this, 6, "Pad0");
  pad[1] = new PAD(this, 7, "Pad1");
  size(200, 200);
}

void draw(){
  pad[0].printStatus();
  pad[1].printStatus();
}
```
```java:PAD.pde
import net.java.games.input.*;
import org.gamecontrolplus.*;
import org.gamecontrolplus.gui.*;

class PAD{ 
  ControlIO control;
  ControlDevice pad;
  
  String name;
  ControlButton b1, b2;
  ControlHat hat;

  PAD(PApplet p, int n, String s) {
    control = ControlIO.getInstance(p);
    pad = control.getDevice(n);
    b2 = pad.getButton(1);
    b1 = pad.getButton(2);
    hat = pad.getHat(14);
    name = s;
  }
  
  void printStatus(){
    print(name,":");
    if(b1.pressed())print("Ⅰ");
    if(b2.pressed())print("Ⅱ");
    if(hat.up())print("↑");
    if(hat.down())print("↓");
    if(hat.left())print("←");
    if(hat.right())print("→");
    println();
  }
}
```
ProcessingでPC Engine miniのコントローラを使う

＃本記事はProcessingでPC Engine miniのコントローラ使う方法のサンプルです。複数台使う記事はこちらです。
https://qiita.com/hextomino/items/83918f9d603157f64421

#はじめに
2020年3月にPC Engine miniが発売されました。付属のコントローラは本体とUSB接続するタイプなので、パソコンでも使えるだろうとやってみた次第です。

結果としては、普通に使えました。

よくあるゲームコントローラのように、アナログスティックやLRがなく、ボタンの数も最低限しかないので、一般向けではないですが、シンプルなコントローラがほぼ販売されていない中で、貴重な存在です。追加で購入できるコントローラには連射機能がついており、連射無しタイプは販売されていないようです。当時のコントローラは、使っているうちに表面のビニールが剥がれてきてしまったのですが、これの耐久性が気になります。

#テスト環境
windows 8
processing 3.5.3
Game Control Plusライブラリ1.2.2
http://lagers.org.uk/gamecontrol/ref/index.html

#Game Control Plusライブラリ
①コントローラをパソコンに接続します。
②Processingのライブラリ追加機能からインストールします。
③付属サンプルのGcp_Configuratorや、Gcp_ShowDevicesを実行して、認識されていることを確認します。
　ライブラリには、ボタン押下時にイベント発生させて、関数を呼び出す機能がありますが、私は使わないので省略し、最低限のソースコードにしました。

#ソースコード
```java:PCEnginePAD.pde
import net.java.games.input.*;
import org.gamecontrolplus.*;
import org.gamecontrolplus.gui.*;

ControlIO control;
ControlDevice pad;

ControlButton b1, b2;
ControlHat hat;

void setup() {
  control = ControlIO.getInstance(this);
  pad = control.getDevice("PCEngine PAD");

  b2 = pad.getButton(1);
  b1 = pad.getButton(2);
  hat = pad.getHat(14);

  size(200, 200);
}

void draw() {
  println(
    "  Ⅰ:",b1.pressed(),
    ", Ⅱ:",b2.pressed(),
    ", ↓:",hat.down(),
    ", →:",hat.right(),
    ", ←:",hat.left(),
    ", ↑:",hat.up()
  );
}
```
Linux系OSのパッケージツール及びコマンドの説明

lpic勉強中なので[ping-t](https://ping-t.com/)を参考にしてパッケージツールのオプションなどをまとめました。
## RedHat系(Red Hat Enterprise Linux, CentOS, Fedoraなど) 
### ●RPMツール (設定ファイル:`/usr/lib/rpm/rpmrc`)
- **rpmコマンド** : パッケージのインストール・アンインストールなど、基本的なパッケージ管理を行うコマンド
`参照・検査関連の主なオプション`
![f18b5d40.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/250675/1ef8afe7-35a9-2ab7-cf84-a4977f7ba3b1.png)
`インストール関連の主なオプション`
![d840006f.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/250675/a46af83e-e9f5-6615-dd91-9007c88f79ca.png)

- **rpm2cpio** : PRM系パッケージをcpio形式のアーカイブに変換するコマンド
### ●YUMツール　(設定ファイル:`/etc/yum.conf`, パッケージ取得元の設定:`/etc/yum.repos.d`下の`.repo`ファイル)
RPMツールを拡張したツール群。

- **yumコマンド**
![128cdcb2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/250675/332e62ae-d897-36f0-7774-cdc41ca5b9c4.png)
### ●DNFツール
YUMツールの後継となるツールで、Fedora22からデフォルトのパッケージ管理ツールになっている。
リポジトリの設定もYUMツールと同様に`/etc/yum.repos.d/`下の`.repos`ファイルで設定する。
## Debian系(Debian GNU/Linux, KNOPPIX:クノーピックス, Ubuntuなど)
### ●dpkgツール(設定ファイル:`/etc/dpkg/dpkg.cfg`)
- **dpkgコマンド** : パッケージのインストール・アンインストールなど、基本的なパッケージ管理を行うコマンド
![4b7b904b.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/250675/2c466be3-da22-5bbd-9162-c55978cb290b.png)
- **dpkg-reconfigureコマンド** : インストール済みのパッケージをパッケージを再設定するコマンド
### ●APTツール(パッケージ取得元の設定:`/etc/apt/sources.list`)
dpkgツールを拡張したツール群
- **apt-getコマンド** : パッケージのインストール・アンインストールを行うコマンド
![2e94f083.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/250675/289cc251-2a69-0d32-8e1c-473f617e0436.png)
- **apt-cacheコマンド** : パッケージ情報の検索・参照などを行うコマンド
![61e246ae.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/250675/37fe5c55-71b9-24b8-2d9a-69837021e202.png)
- **aptコマンド** : apt-getとapt-cacheの機能を統合したコマンド
## openSUSE(SUSE Linuxから改名)
### ●ZYPPER(ジッパー)ツール
![914e9bd6.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/250675/a20a9342-51cc-fea0-e49f-125c61a1c924.png)
【Git】git rebaseで作業ブランチに最新のmasterを持ってくる方法

Gitでの開発の中で、「rebaseコマンド」によって
現在のブランチを最新のマスターから切らせる時の手順について。

# 1. ローカルのmasterを最新にする
Github Desktopにて ⬇︎
[![Image from Gyazo](https://i.gyazo.com/a886e3e048f456ce79c84a660ce38379.gif)](https://gyazo.com/a886e3e048f456ce79c84a660ce38379)
ターミナルで行う場合 ⬇︎

```:ターミナル
% git checkout master
% git pull origin master
```

# 2. rebaseコマンドの実行

```:ターミナル
% git checkout 【作業中ブランチ名】
% git rebase master
```
これでコンフリクトが起きなければ、作業ブランチに最新のマスターを持ってこれている。

# 3. コンフリクトを解消する
コンフリクトが発生した場合、該当ファイルを修正し
【まとめてadd】 → 【git rebase --continue】を実行する

```:ターミナル
git add　【修正したファイル名】
git add　【修正したファイル名2】
git rebase --continue
```
_________________________________
rebaseをキャンセルする場合、「 git rebase --abort 」を実行するみたい。
以上で終了です。
【初級】JavaScript　switch文について

今回は、switch文について解説していこうと思います。
## 📗 対象
- JavaScript初学者
- 基礎的な所を学びたい方

## 📗 switch文とは
switch文はif文と似たような性質を持っていて、条件によって処理を分けるという文です。
ただ、if文のほうがシンプルで見やすいので基本的にはif文を使うほうが良いかもしれません。

switch文の基本型

```javascript:

const　変数 = 値 ;

switch(変数){

 case 条件:　処理;
  break;
 case　条件:　処理
  break;
 case　条件:　処理
  break;
 default:処理   //defaultは上記の条件がすべて当てはまらなければ実行する
  break;
}
```
このような形になります。
手順としては

１．変数を決めてあげる
2.switchの引数に変数を代入する
3.caseに条件を書いて、当てはまった場合の処理を書く
4.break;を記入。コレを書かないと、プログラムが止まらずに次の処理まで実行してしまいます。

実際にコードを書いてみましょう。

```javascript:.js
const number = 1 ;

switch(number){

 case 1:　console.log('数値は１です。');
  break;
 case　2: console.log('数値は2です');
  break;
 case　3: console.log('数値は3です');
  break;
 default: console.log('数値は1~3ではありません。');
  break;
}
```
numberの値を2にすれば数値は２ですと出力されるかと思いマス。
また、breakという記述を消して実行してみると、コンソール上には、次の処理まで走ってしまうかと思いますので確認してみてください。

ちなみに上記をif文で書いてみると。

```javascript
const number = 1 ;

if(number === 1){
  console.log('数値は１です。');
}
if(number === 2){
  console.log('数値は2です。');
}
if(number === 3){
  console.log('数値は3です。');
}
```
このように、シンプルに出来る場合はif文で書くようにすると良いかもしれません。
@il9437 様からswicth文のほうが有効な場合があるとのご指摘を頂きました。
swicth文の有効性が非常にわかりやすいご指摘でしたので、興味のある方はコメント欄を御覧ください。
ご指摘ありがとうございました。

## 📗 次回予告
ユーザー定義関数の基本かStringオブジェクトについて書こうかなと思います！