OmniAICreator/Qiita-1.07M huggingface dataset:
【React】アロー関数とbind()の参照するthis

#参照するthisについての話
アロー関数とbind()についての大事な特徴を理解したのでメモ．これを理解していなかったのでクリック時のイベントハンドラでエラー吐き出されるはめになった．
##アロー関数
```react
func = (arg) => {}
```
これがアロー関数の形．関数との違いは参照するthisの場所．普通の関数はグローバルなthisを参照するけど，アロー関数では呼び出し元のthisを参照する．

```react
let this.str = "global";

function func() {
  console.log(this.data);
}

arrowFunc = () => {
  console.log(this.data);
};

const f = {
  data: 'local',
  execute: func
};
f.execute();
// => 'global'

const af = {
  data: 'local',
  execute: arrowFunc
};
af.execute();
// => 'local'

```
イベントハンドラでは呼び出し元のthis.stateを参照したいからアロー関数を使うべき．

##bind()
アロー関数でなくとも，関数の参照thisをbind()で呼び出し元のthisに紐づける方法もある．

```react
constructor(props) {
    super(props);
    this.state = { isToggleOn: true };
    // このオブジェクトをイベントハンドラの内部のthisに結びつける
    this.handleClick = this.handleClick.bind(this);
  }

handleClick() {}

render() { <button onClick={this.handleClick}></button> }
```
bind()で一行増やすくらいなら自分はアロー関数を使おうかと思います．可読性もアロー関数の方が上がりそう．
[【Matz氏 特別講演】若手エンジニアが市場価値を上げるために必要なこと]を聞いて

###何故書いたのか
オンラインで参加させていただいたのですが、
自分なりの備忘録として書き残しておきます。


###市場価値とは
- 市場価値とは他人から評価されるものであり
自分自身で高める努力はできても最終的には雇う側に評価されるかどうか

- 市場価値が高いからと言ってそれがお給料や評価に直結するものではない。

- 市場価値と一言に言っても
プログラミングスキル、マネジメントスキル、人脈など中身は様々。

###市場価値を上げるために
- 市場価値が他人から評価されるものである以上、
他人と同じ部分は評価されづらい

- 人と違う点を自分自身が理解し、強みと認識する。

- 点をつなげていくことで線、面となっていき、自分の市場価値を
認識できる。

- そして自分自身の強みを発信していく

だいたいこんな感じだったような

###感想
Matzさんがおっしゃってた人と違う点っていうのは
自分が人より得意なことって意味でして、
**市場価値を高めるには自分が人より得意なことを自分が理解して
それを伸ばして売り込んでいくってこと**
なのかなあって思いました。

得意なこと好きなことって努力を努力と認識しないっていうか、
楽しんでやっていくうちにどんどんスキルが伸びていくって言いますしね

ただ好きなことを極めるんじゃなくて、好きなことに
どうやって価値を生み出すか考えた上で、ですけど。

###最後に
自分なんかがこの講演について書いていいのかと戦々恐々としております…
気になる点がありましても優しくスルーしていただければ幸いです。
dagger2入門 - basic(@Module & @Provides)


# 概要
* [dagger2入門 - basic(@Inject & @Component)](https://qiita.com/alingogo/items/e5166d414d8d9a8f88e8)にdagger2の基本的な使い方を紹介した
* ひとつの問題があって、今回は導入したパッケージのクラスの導入方法を紹介する




# 詳細
## @Injectなしの基本クラスを定義する
```
class Age {
    fun myAge(): String {
        return "22"
    }
}

abstract class Citer {
    abstract fun doWhat(): String
}

class Student(val age: Age) {
    fun doWhat(): String {
        return age.myAge()
    }
}

class Worker : Citer() {
    override fun doWhat(): String {
        return "work"
    }
}
```

# モジュールで上記のクラスを導入する
```
@Module
class CiterModule {
    @Provides
    fun provideAge(): Age {
        return Age()
    }
    @Provides
    fun providedStudent(age: Age): Student {
        return Student(age)
    }

    @Provides
    fun providedWorker(): Worker {
        return Worker()
    }
}
```

## コンポネントを定義するときに、モジュールを導入する
```
@Component(modules = [CiterModule::class])
interface CiterComponent {
    fun inject(house: House)
}
```

## 同じ方法で注入する
```
class House {
    @Inject
    lateinit var student: Student

    @Inject
    lateinit var worker: Worker

    init {
        DaggerCiterComponent.create().inject(this)
    }

    fun showTime() {
        println(student.doWhat())
        println(worker.doWhat())
    }
}

fun main(args: Array<String>) {
    val house = House()
    house.showTime()
}
```

## 結果
```
22
work

Process finished with exit code 0
```

----

## 遷移図
![スクリーンショット 2019-12-21 16.33.34.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/13451/b1367ecd-cd85-fcbf-0db7-a14f6bdf4906.png)


## サンプルコード
* https://github.com/fork-alin/study_dagger2_with_kotlin/blob/master/src/main/kotlin/module_and_provide.kt
macのBluetoothトラックパッドでカーソルの動きが悪くなった時の解決策

### 環境
- macmini (late 2014)
- macOS Mojave 10.14.6
- Apple Magic Trackpad

### 症状
数秒に１度の割合で、カーソルが一瞬ひっかかったように止まり、すぐにまた動き出す。

### 解決策
/Library/Preferences/com.apple.Bluetooth.plist
を削除して再起動。その後症状は再発せず。

### 参考
http://hinyonposu.com/Journal/apple%E7%B4%94%E6%AD%A3%E3%81%AEbluetooth%E3%83%9E%E3%82%A6%E3%82%B9%E3%82%84%E3%83%88%E3%83%A9%E3%83%83%E3%82%AF%E3%83%91%E3%83%83%E3%83%89%E3%81%8C%E6%93%8D%E4%BD%9C%E4%B8%AD%E3%81%AB%E4%B8%80/

https://discussionsjapan.apple.com/thread/10090264
Windows10でコマンドプロンプトでタブキー補完するレジストリ操作 

#コマンドプロンプトでタブキー補完するレジストリ操作の設定メモ

何かと便利なタブキー補完をコマンドプロンプトでやる方法。

１．レジストリエディタを開きます。「regedit」と入力すると早いです。
「管理者として実行」しましょう。


![regedit.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/303278/348495e4-f79a-6fed-4faf-7e621887c0d0.png)


２．レジストリエディタターゲットとなるキーを検索して設定画面を開きます。

 HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\Command Processor

![regedit.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/303278/490fb651-068b-1d1f-27e6-b6db5c6679b9.png)

16進を選択して数字の9を設定して閉じます。

３．確認してみましょう

コマンドプロンプトを開きます。


![regedit.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/303278/5dd2d3ef-8b90-8e35-6627-9aaeba54b340.png)

Cドライブのルートに移動して、cd:\ w　と入れてタブキーを押します。

![regedit.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/303278/73615b33-57ef-6ded-9142-3bf468606366.png)

補完されました。「Windows」というフォルダーがありますので、「Windows」と自動で入力されました。

以上です。
AngularとBootstrapとFirebaseでWebサイト作成・公開してみた

#はじめに
こんにちは(*`･ω･´)
社会人2年目　新人SESの@Emagineerです。
今回は初めて一人でWebサイト作成～公開してみました。
Webサイトはこちら：[ChordSeaecher](http://chord-searcher.mints.ne.jp/)
本記事は日記兼忘備録です。

一人でも絶滅危惧種Angularマンが増えますように…

#Webサイトの仕様
仕様相談時間：3h
デザイン検討時間：4h

仕様は心のお客様と対話、たまに友人に意見を聞いて確定させました。

**要望**
音楽のコードを構成音から検索するサイトがほしい。

**確定仕様**
・音を選択し、コードと全構成音を表示する。
・音で確認できるようにする(未実装)

#開発環境
GitHub：[ソースコード](https://github.com/Emagineer9/ChordSearcher)

Angular CLI: 8.3.18
Node: 10.16.3
Angular: 8.2.13
Bootstrap (currently v3.4.1) 

#Angularについて
実装時間：15h

主に全コード作成処理で安易に可能と想定して実装した箇所に時間を取られてしまいました。
また本来DBに登録するようなデータ（全コードリストや全音名Objectなど）をコード内に含んでしまっているため改善の余地ありです。

・登録に時間が取られる
・音名やコードは変更になることはない

と判断して内部に含みました(´・ω・｀)

###初めての実装項目
今回自身初実装したのは入力フォームでフォーカスアウトしたときの処理。
HostListenerを利用して実装。

```ruby:src/app/directives/focus-out.directive.ts
import { Directive, HostListener } from '@angular/core';

@Directive({
  selector: '[appFocusOut]'
})
export class FocusOutDirective {

  constructor() { }

  /**
   * スマホ用フォーカスアウト時のスクロールもとに戻す処理
   */
  @HostListener('blur')
  onBlur() {
    window.scroll(0, 0);
  }
}
```

#Bootstrapについて
実装時間：5h

実装開始から6時間経過した頃。
「そういえば問い合わせフォーム作りたいな。デザイン楽になるしBootstrap入れてみようかな。」
そんな軽いノリでBootstrapを導入。
今回はform-groupが使用できればよかったのでBootstrapCDNで導入。

```ruby:src/styles.css
@import url("https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css");
@import url("https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap-theme.min.css");
```

Bootstrap導入したし、一度確認するか～。ん？？？？
**デザイン世紀末くらい崩れてない？？？**
ここから怒涛のCSS修正。
ここのCSS修正なかったら開発時間4h短縮できた。反省。

#Firebaseについて
実装時間：3h

DatabaseとHostingを利用したかった。
Hostingは独自ドメインが取得できないと利用できなさそうだったためデプロイのみ行った。

以下AngularのFirebase情報取得処理

```ruby:src/app/drawer/drawer.component.ts
  constructor(
    private db: AngularFirestore
  ) {
    db.collection(environment.koshinRirekiName).valueChanges()
    .subscribe(x => {
      this.rirekiItem = x;
    });
  }

  /**
   * コメント送信
   * @param e イベント
   */
  sendComment(e: Event) {
    (割愛)

    //更新
    this.db.collection(environment.collectionName)
    .add(new FirebaseComment(this.name, this.mailAddress, this.contents, date).deserialize());
    this.name = '';
    this.mailAddress = '';
    this.contents = '';
  }
```

#おわりに
総作業時間：30時間

良かった点：　自走力の確認ができたことでかなり自信が付いたこと。
反省点：　全体的に実装するときの検討不足が目立つこと。

初めてWebサイトを１から自分で作成・公開しましたが本当に楽しかったです。

次回はPythonを勉強予定。
何を作ろうかな～！(*`･ω･´)
電気の超基礎知識

#はじめに
この記事は，電子回路を学習中の自分の知識整理と確認の為にまとめたものである．

#アナログ電子回路とは
アナログ電子回路とは，受動素子(抵抗や容量，インダクタ)と能動電子デバイス(ダイオードやトランジスタ，信号源など)から構成される．信号源とは，電圧源や電流源のことである．電圧や電流を入出力信号として，出力端に現れる**信号の時間変化**や**周波数変化**を利用して，**増幅，周波数選択，周波数変換**などの機能を実現する．

#電流，電圧，電力
**電荷**・・・電気を担った実体，あるいは帯電した物体が持っている電気のこと．また電荷の量を**電気量**といい，単位はクーロン[C]．
**電子**・・・負の電荷を持つ．
**原子核**・・・複数個の陽子(正の電荷)と中性子で構成される．

物体を構成している原子モデルは，正の電子を持った原子核を中心に，その周りを負の電荷を持つ電子が飛び飛びの半径で複数個周回している．この原子の大きさはおよそ`10^-10`[m]程度．


また電子が持つ電気素量(これ以上細分することのできない最小単位)の大きさは

```
e = 1.602 * 10^-19[C]
```

で，これは**1個の電子の電気量**である．


なお，正に帯電した原子核と電子の間にはたらく引力を**クーロン引力**という．この引力は両者の距離の2乗に反比例するため，半径が大きいほど引力は弱くなる．そうすると外側の電子が外れやすくなり，自由電子となる．


##電流
**電流**とは，電気の流れ，負の電荷を持った自由電子の集団の流れである(**電気の流れの大きさ**)．上記で記述した自由電子は，電流の担い手となっており，電流を流れやすくする．金属に電流が流れやすいのはこのためである．
水で例えると，**川の流れる速さ**のことである．


電流の大きさIは，導線の断面を通過する電気量Qを計測時間ｔで割ったものであり，式は下記である．

```
I = Q/t [A]
```

電流は正極から出て負極に向かう，すなわち**電流の流れる方向と電子の流れる方向はお互いに逆向き**である．
また回路図の電流の矢印の先端は，正電荷が流れる方向を指す．


##電圧
**電圧**とは，電気を流そうとする「圧力のようなもの」であり，電池の正極から電気を押し出す力である(**電流を流す力の大きさ**)．
また**電位**とは，力学における位置エネルギーの位置に相当する概念であり，**電位差**とは，正極の持つ高電位と負極の持つ低電位との差である．
電圧とは，電位差のことである．
水で例えると，**水のある高さ**のことである．

電圧Vは，正電荷を移動させる際に必要なエネルギーWを，この電荷の大きさqで割ったものであり，式は下記である．

```
V = W/q [V]
```

また起電力を表す場合はEを用いる．
なお回路図の電圧の矢印は，低電位から高電位へ矢印が書かれている．


##電力と電力量
**電力**とは，電気エネルギーにより単位時間あたりにする仕事量，すなわち仕事率である．
1[w]とは，1秒間に1[J]の仕事をする電力のことである．

t秒間にw[J]の仕事をするときの電力P[w]の式は下記である．

```
P = W/t [w]
P = IV [W]
P = RI^2 [W]
```

なお，電力は**電流と電圧の積**，または**電流の二乗に比例**する．


また**電力量**とは，ある一定時間経過後の積算した仕事のことで，単位は[J]または[W・s]で式は下記である．

```
w = Pt [J] = Pt　[W・s]
```

なお，一般の家庭で使用される電力量には**キロワット時[kW・h]**という単位がよく用いられる．（[W・s]では値が大きくなってしまうため）


#オームの法則
抵抗とは，導線内の電気の流れを妨げ，導線を流れる電気エネルギーを熱エネルギーや光エネルギー（豆電球など）として消費することである．

電流I，電圧V，抵抗Rの間には**オームの法則**という関係があり，下記はその関係式である．

```
I = V/R [A]
```
電流の大きさIは，電気抵抗Rの大きさに反比例し，電気抵抗の両端の電圧Vに比例する．
Eclipseを使っていてSQLデータのCSVインポートについて困ったことを我なりに解決した。

**まず、前提として私はゲームプログラマの勉強しているためこちらの知識はあまりありませんのでご理解のほどよろしくお願いいたします**
##はじめに

EcipseでSQLを使用して会員情報や情報データを保存した。
その情報データをまとめて更新したりをcsvで出来るようにしたい。
色んなサイトやQiitaで紹介してるが所々省かれたりしていて分からない。

そこを普段Eclipse等を使用しない人がやれるとこまで出来た。

##接続のための準備

使用DB：MYSQL

ー今回はEclipseとMYSQLの接続については省く


ここでEclipseに「DBViewer」というプラグインを導入してください
　　　EclipseでDBをいじるのに便利なプラグイン：[DBViewer](https://www.atmarkit.co.jp/ait/articles/0601/13/news101_3.html)




##MySQL起動

コマンドプロンプトにて

```
mysql -u root -p --local-infile=1
```

　　ーPWを求められている場合はPWを入力して起動する。

```
use sampleDB　//使用するのを指定する
```

#####ここまでは基本として考えておいてください


##CSVインポートまでの流れ

Eclipseに導入した、「DBViewer」使用して編集したいテーブルをCSV出力する
![csvOutPut.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/554471/4d263963-6ebe-0c27-7898-51ac50d464ac.png)


編集したCSVは保存してからファイルを右クリックで、プログラマから開く→メモから開く
**※　文字コード設定で　ANSI　から　UTF8に変更する　←ここ重要**


###ここで確認すること

```
mysql> status
```
SQLのステータスを確認するコードを入力

```
Server characterset:    utf8
Db     characterset:    utf8
Client characterset:    cp932 //⇒utf8だと失敗
Conn.  characterset:    cp932 //⇒utf8だと失敗
```

**上記の結果にならないといけない！**　カラムデータの日本語は文字化けする。


##文字コードを変更する

C:\ProgramData\MySQL\MySQL Server 8.0
の指定されたファイルにある、**my.ini**を変更しなければならない。

```ini:my.ini
[mysqld]
character-set-server=utf8

[mysql]
default-character-set=cp932
```

参考：https://teratail.com/questions/26559

他サイトに書いてあった、
　**skip-character-set-client-handshake** の変更はしてはいけない。←僕も騙されましたｗ

my.iniを書き直した場合は、MYSQLの再起動が必要になる
コントロールパネル→管理ツール→サービス→MYSQL8.0(verは異なる)→左側にある再起動をクリックすればおｋ

この設定をした後に、上記にあるステータス確認をして合っているか確認


##ついにインポート！

```
LOAD DATA LOCAL INFILE 'C:/Users/Desktop/test.csv' INTO TABLE testTable FIELDS TERMINATED BY ',';
```

testTableは指定したテーブルを入力。

そしたらデータが入ってるのではないでしょうか。

少し厄介な文字コード等があり時間かかりましたが誰かの役に立てれば幸いです。
####時間あってよければ、僕の作品も見てください→[ポートフォリオ](https://keita0122neec.wixsite.com/portfolio)
ファイルの中を表示/編集するコマンド

#はじめに
開発をしていくにあたりファイルの中身を表示したり編集したりするコマンドは様々なものがあります。
特定の便利なコマンドを使いがちの方もいるかもしれませんが、コマンドの特徴を学んでそれらを使い分けることにより、例えば不注意でファイルの中身を編集してしまい設定を壊してしまうようなアクシデントが防ぎやすいかなと思います。
より安全な開発をするためにファイルの中を表示/編集するコマンドを学んでいきます。

#ファイルの中を表示するコマンド（less・view・more・cat）
大きくわかれるポイントはファイルの中身を表示したいか、それとも編集したいかという点にあると思います。
まずはファイルの中身を表示するコマンド（less・view・more・cat）の特徴についてです。

**・less**
ファイルの中身全てを一気に読み込む方式ではなく必要な部分のみ読み込むため、テキストファイルを高速表示するのに合います。
gzipなどのファイルも解凍せずに表示することができます。
解凍が必要なファイルを読み込みたいときや大きめのファイルを読み込む時に役立ちます。

**・view**
viの読み込み専用バージョンです。テキストファイルをすべて一気に読み込むため動作が遅いです。

**・more**
画面のスクロールができずページ単位で上下で表示されます。ポイントを絞ってテキストファイルの中身をさっと見たいとこに便利です。 

**・cat**
全てを一気に読み込む方式でテキストファイルを停止しないで一気に表示します。大きいファイルだと読み込みに時間がかかるため向きませんが、小さいファイルを表示する場合にあいます。


#ファイルの中を編集するコマンド（vi・vim）
次はファイルの中身を確認するコマンド（vi・vim）の特徴についてです。

**・vi**
高機能テキストエディタと言われており編集機能が豊富にあります。ディストリビューションによっては vimへのシンボリックリンクになっている場合もあります。

**・vim**
viをさらに機能アップしたテキストエディタです。

#おわりに
上記のまとめを参考になんのファイルの中を表示/編集するコマンドを用いるか工夫しましょう。

参考：[less、view、more、cat、vi、vim の違い | Linuxコマンド](http://tooljp.com/windows/chigai/html/Linux/less-view-more-cat-vi-vim-chigai.html)
マイグレーションファイルの作成、変更、削除まで



今回は、物件のファイルを作ることを想定します。

####流れ
一度、マイグレファイルを作成したが、カラムをつけ忘れたのでカラムを付け足したい。

マイグレファイル作成→削除→マイグレファイル編集


###1.マイグレファイルを作成する

```
$ rails g migration CreateHomes

```

###2.作成したマイグレファイルをエディターで編集する

``` create_homes.rb

class CreateHomes < ActiveRecord::Migration[5.2]
  def change
    create_table :homes do |t|
      t.string :"物件名"
      t.string :"賃料"
      t.string :"住所"
      t.text :"備考"
    end
  end
end

```

###3.マイグレーションをターミナル上で入力

```
$ rails db:migrate
```

###4.マイグレファイルを削除するため、削除用のファイルを作る


```
rails g migration RemoveColumnsFromeHomes
```


###5.作ったファイルを編集する

```remove_columns_from_homes.rb

class RemoveColumnsFromHomes < ActiveRecord::Migration[5.2]
  def change
    remove_column :Homes, :"物件名", :string
    remove_column :Homes, :"賃料", :text
    remove_column :Homes, :"住所", :text
    remove_column :Homes, :"備考", :text
  end
end

```


###6.マイグレーションをターミナル上で入力

```
$ rails db:migrate
```


※こうすることで、再び作り直すことができます。
rollbackでも削除は、可能ですが複数開発のときに何を編集したのか分からなくなるのでやめましょう。


###7. カラムを追加するためのマイグレファイル作成

```
$ rails g migration AddColumnsToHomes
```



###8.マイグレファイルを編集

```add_columns_to_homes.rb

class AddColumnsToHomes < ActiveRecord::Migration[5.2]
  def change
    add_column :homes, :property, :string
    add_column :homes, :rent, :text
    add_column :homes, :address, :text
    add_column :homes, :age, :text
    add_column :homes, :remarks, :text

  end
end


```



何かを分からないことがありましたら、コメントを頂ければ1日以内に返信するように致します
【Ansible】辞書型から任意の値を取り出してリストを作成する

# はじめに
以下のymlのように、辞書型のデータから特定の値を取り出してリストを取り出せるようにします。
例）vars_promptで「ac」と入力してrouter1とrouter3という文字列を取り出してリストを作成する。
<2019/12/31：追記>
※input_dicでリストの中に辞書が入っているのは、リストにrouter3→router1と逆の順番で
　格納されるのを避けるためです。

```yml:select_test.yml
---
- name: prompt TEST
  hosts: junos
  gather_facts: no
  vars:
    ansible_python_interpreter: /usr/bin/python3
    input_dic: [
      { type: a ,name: router1 },
      { type: b ,name: router2 },
      { type: c ,name: router3 }
      ]
  vars_prompt:
    - name: "usr_input"
      prompt: "input type a to c \n"
      private: no
  tasks:
    - name: 'make list'
      set_fact:
        output_list: >-
          {%- set tmplist = [] -%}
          {%- for i in range(input_dic|length) -%}
          {%-   if input_dic[i].type in usr_input -%}
          {%-     set _ = tmplist.append(input_dic[i].name) -%}
          {%-   endif -%}
          {%- endfor -%}
          {{ tmplist }}
    - name: 'debug'
      debug:
        msg: '{{ output_list }}'
```

# 実行結果
想定通り、「ac」と入力されるとrouter1とrouter3がリストに入ります。

```text
[ec2-user@ip-<ip addr> ansible]$ ansible-playbook -i hosts select_test.yml
input type a to c
: ac

PLAY [prompt TEST] **************************************************************************************************************************************************************************

TASK [make list] ****************************************************************************************************************************************************************************
ok: [junos_router_1]

TASK [debug] ********************************************************************************************************************************************************************************
ok: [junos_router_1] => {
    "msg": [
        "router1",
        "router3"
    ]
}

PLAY RECAP **********************************************************************************************************************************************************************************
junos_router_1             : ok=2    changed=0    unreachable=0    failed=0    skipped=0    rescued=0    ignored=0
```

# 関連記事
<2019/12/31：追記> 
ssato様による別解
https://gist.github.com/ssato/6701565f4977828e25db4962457194d6
<2020/02/08：追記>
[【Ansible】外部の変数ファイルから変数の一部を読み込む(selectattr,map)](https://qiita.com/masa2223/items/6f035b9e598dc6f03058)
Windows10上のSpacemacsでScalaの補完や定義ジャンプを効かせる (Ensime)


基本的には [公式のdevelopブランチのドキュメント](https://github.com/syl20bnr/spacemacs/tree/develop/layers/%2Blang/scala)に従う感じで。

# SpacemacsのScala設定
`scala-backend`として `Ensime`を使う。Spacemacsでensimeをダウンロードし、Scala Layerでensimeを指定する。

```emacs-lisp:.spacemacs(抜粋)
dotspacemacs-configuration-layers
'(sql
  markdown
  ;; 上のsqlやmarkdownみたいな感じで以下を追記
  (scala :variables
         scala-backend 'scala-ensime
         scala-auto-start-backend t)
 )

(defun dotspacemacs/user-init ()
  ;; melpaからのインストールはstable (安定版)を指定
  (add-to-list 'configuration-layer-elpa-archives '("melpa-stable" . "stable.melpa.org/packages/"))

  ;; Scala backend
  (add-to-list 'package-pinned-packages '(ensime . "melpa-stable"))
)
```





# sbtインストール
https://www.scala-sbt.org/1.x/docs/ja/Installing-sbt-on-Windows.html

(JDK8以上が必要だが、その案内もリンク先に書かれている)





# Ensimeの準備
https://web.archive.org/web/20190417132406/http://ensime.github.io/build_tools/sbt/#install

- ユーザディレクトリ直下にあるはずの `.sbt`ディレクトリから辿って、 `~/.sbt/1.0/plugins/plugins.sbt`となるように `plugins.sbt`を作る
- `plugins.sbt`には `addSbtPlugin("org.ensime" % "sbt-ensime" % "2.5.1")`を書いとく
- sbtを起動して `ensimeConfig`コマンドを打つ
- 完



# .classファイルの取得？
設定しただけでは、他プロジェクトのパッケージをimportできないらしい。 `object xxx is not a member of package`みたいなエラーが出る。

どうも `.class`ファイルを作ると良いらしい？ターミナルを立ち上げ、プロジェクト直下で `sbt test:compile`すると解決した。
https://github.com/ensime/ensime-emacs/issues/236#issuecomment-138700317





# 定義ジャンプが一部壊れているっぽい
こちらで議論されているように、直接ジャンプできない部分がある。
https://github.com/syl20bnr/spacemacs/issues/7144

具体的には `関数が定義されたファイルをSpacemacsで開いていない場合`。というのは[議論にもコメントされていた](https://github.com/syl20bnr/spacemacs/issues/7144#issuecomment-285237630)。

Spacemacsで開く、というのは、つまりバッファとして存在するという意味 ( `Space b b`でバッファ一覧に存在する状態)


ちなみに、定義したファイルを開いていない状態でも、参照元から `関数`ではなく `その関数が定義されているオブジェクト自体`に定義ジャンプすることはできる模様？
rails server が失敗する

初めての記事で、超低レベルな内容になりますがよろしくお願いします。
rails new 任意の名前
を実行した後に
rails server　
を実行すると思うんですが、ここで
cd　任意の名前
を実行しないとダメなんですね。
それはそう、って感じなんですけどね。しっかりと自分が作成したディレクトリに移動してからサーバーを立ち上げましょう。
Gitが浸透していない社内に普及させたい(現在進行系)

[ITCアドベントカレンダー](https://adventar.org/calendars/4713)の記事です。
「射撃教習申請について 他」とか書いてたんですが、結局申請出してないし内容を変えます。

# 何の記事か
アルバイト先で新しく受注案件が発生したのですが、弊社は

- 手動でソースを管理し
- 作業場所として開発サーバーに `〇〇_kakimoto/`のようなディレクトリを作成し
- それまでのソースと目grepをし
- SFTPで直接反映する

という状況のため、かねてよりミスが危惧されていました。
今回、新規に立ち上げであることと、最初期の開発者は自分一人であること、のちのち開発に加わるメンバーもそろそろフローを変えたいと思っていたということでGit/GitHubの導入を決めました。

導入にあたってしたことを備忘録としてまとめましたので記事とします。

# 要件

1. PHP, MySQLを使った管理ツール
2. なるべく覚えることは少なく
3. それまでのスタイルを大幅には崩さないこと
    4. →つまりLaravel等のフレームワークは学習コストが大きいため避ける

の3点をまず最初に意識しました。2と3は今後社内に普及させることを考えて導入ハードルを下げるために意識します。

# セキュリティを担保する

我々が趣味で作るクソみたいなコードと違って、プロダクトとして開発をする以上一定のセキュリティを担保する必要があります。
リモートリポジトリを選定する上で、自社で管理できるGitLabも挙がりましたが、インストールと管理のコストを考え今回は見送りました。
選択肢としては

- GitHub
- GitLab
- Backlog

ぐらいがメジャーかなと思います。
Backlogも良いかなと今となっては思うのですが、個人的に私が使い慣れたGitHubにし、メンバーのうち社員のアカウント内にPrivateリポジトリとして設定することにしました。

その他、GitHubアカウントの乗っ取りも最近起きているということなのでDBへの接続情報なども.gitignoreで監視対象から外すなどの対策を考えます。

# GitHubにするにあたって必要なこと

- メンバー全員のGitHubアカウントを作成
- メンバーの作業PCとGitHubをSSH接続できるようにする
- リポジトリを設置するアカウントを決める
    - コラボレーターにメンバーを設定するのか
    - オーガナイゼーションを作成するのか

当初オーガナイゼーションを作成するつもりでしたが、軽く調べたところプライベートにするには課金が必要そうだったため断念。また私がリポジトリを作成しても良かったのですが、あくまでアルバイトですし、新卒就職時には辞めることが決定しているため、期間的な意味でも、社員のメンバーに作成してもらいました。
プライベートリポジトリにする場合コラボレーターは3人までとのことですが、今回の案件は3人以上になることは無いと思われるためこちらは問題になりませんでした。

# Gitのフローについて

 今回は

- masterブランチ(リリース/客先レビュー用)
- developブランチ(デフォルト)
- featureブランチ(開発時用)

とするGitHubフローとしました。
タスク管理をどうするかの話が決まっていないため、現時点ではIssueを利用することにし、featureブランチの番号はIssue番号に対応させることにします。

なお今回は、開発メンバーがmasterブランチのみでコミットを積んでいくことはしたことがあるとのことだったため、基本的なGitの操作についての説明はある程度省略します。

開発者は、

1. 最新のdevelopブランチをpull
2. 実装するタスクのIssueを確認し、 `feature/<Issue番号>`ブランチにチェックアウト
3. コーディング
4. `git add` + `git commit` + `git push origin feature/<Issue番号>`
5. Pull Requestを作成
6. PRをmerge
7. developブランチに戻り、1.に戻る

というフローを繰り返します。今回はコードレビューなどは省略になるかと思います。
また、GitHub Actionsなどは設定しません。

# ローカル環境の準備

これまでは開発用のサーバーを用意し、そこに全てのソースを保存していましたが、それだと誰かがブランチを切り替えることができないため、必然的に各自で競合しない開発環境(＝ローカルに設置する)を用意する必要が出てきました。
集権サーバーであったときは同じ開発用のDBサーバーに接続すればよかったため、誰か一人がテーブルに対する変更を管理していればよかったのですが、各自がDBを用意するところもカバーする必要があります。
また、DBに対する変更があった場合は作業者がSQLをメモした上で、リリースの際手動で入力する必要がありました。これは作業ミスを誘発すると考え、テーブルやDBに対して変更を生じるSQLも、Gitリポジトリに含めることにしました。

以上のことから、

- 誰が見ても同じ環境を準備できること
- なるべくコマンド量を少なく、わからなくても打てば動く状態にすること
- 必要な情報は１箇所にまとまっていること = README.mdを整備する

を優先しました。
実際のREADME.mdの冒頭は以下です。

----

## ローカルの開発環境を用意する

1. git clone
1. create databese `<project_name>`
1. DB接続情報を/common/database/db_config.php 36行目以降に記載
1. `/common/database/migrate/` 配下SQLファイルを実行(yyyymmdd + 01 ~ 99の連番 + テーブルに対する変更内容 ファイルの順に実行)
1. `cd public && php -S localhost:8000` 実行 
1. [http://localhost:8000](http://localhost:8000)

create database って書いてますが、sql文ではなくて手動で作ってねって意味です。
また、プロジェクトルートにはコンフィグファイル群を設置した`/common`ディレクトリと、サーバーのドキュメントルートにあたる`/public`を設置しており、ローカルサーバー起動時にpublicに移動して`php -S`コマンドで立ち上げる想定です。
こうすることで、現状の開発サーバーと同じパスにすることができました。

----
migrateionっぽく連番を振ることでテーブル間の整合性を取ろうとしています。
今の所上から順にSQLファイルを実行するだけで、テーブル重複に対しても各SQLファイル実行前に

```sql

DROP TABLE IF EXISTS `users`;
```
といったことしかしていませんので、今後よしなにするシェルスクリプトなどを作れればなと思っています。

# 今後について
上記で触れたマイグレーションを管理するものであったり、Gitフローを周知する上でわかりやすいドキュメントを整備などしていく予定です。
MySQLのパスワードポリシーを確認する

# はじめに
MySQLのパスワードを変更しようとした際、パスワードポリシーに引っかかって少し戸惑ったので解決策をメモしておく。

# MySQLのパスワード変更
MySQLにログイン後、パスワードを変更しようとするとこんなエラーが出た。

```sh:パスワード変更
mysql> set password for root@localhost='新パスワード';
ERROR 1819 (HY000): Your password does not satisfy the current policy requirements
```
パスワードの複雑さを定義しているポリシーを満たしておらず、エラーになっている。
もっと複雑なパスワードにしてください、ということみたい。

# ポリシーの確認
このポリシーを確認するため、以下のSQLを実行する。

```sh:

mysql> show variables like 'validate_password%';
+--------------------------------------+--------+
| Variable_name                        | Value  |
+--------------------------------------+--------+
| validate_password_check_user_name    | OFF    |
| validate_password_dictionary_file    |        |
| validate_password_length             | 8      |
| validate_password_mixed_case_count   | 1      |
| validate_password_number_count       | 1      |
| validate_password_policy             | MEDIUM |
| validate_password_special_char_count | 1      |
+--------------------------------------+--------+
7 rows in set (0.01 sec)
```

上記のそれぞれの設定項目の意味は、以下の通り

|設定項目 | 設定内容 | デフォルト値
|---|---|---|
|validate_password_check_user_name  | パスワードの一部にユーザー名が使われているか |OFF
|validate_password_dictionary_file  | 除外する文字列を定義したファイルを作成    |なし
|validate_password_length           |パスワードの長さ                       | 8
|validate_password_mixed_case_count |パスワードポリシーが MEDIUM またはそれより強い場合の、パスワードに必要な小文字および大文字の最大数|1
|validate_password_number_count     |パスワードポリシーが MEDIUM またはそれより強い場合の、パスワードに必要な数値文字 (数字) の最大数    |1
|validate_password_policy           |数値 0、1、2 または対応する記号値 LOW、MEDIUM、STRONG を使用して指定できる。詳細は下記に示す。    |MEDIUM
|validate_password_special_char_count |パスワードポリシーが MEDIUM またはそれより強い場合の、パスワードに必要な英数字以外の文字の最大数 | 1

validate_password_policyの内容

|ポリシー         |実施されるテスト
|---------------|---------------|
|0 または LOW    |長さ
|1 または MEDIUM |長さ。数値、小文字、大文字、および特殊文字
|2 または STRONG |長さ。数値、小文字、大文字、および特殊文字。辞書ファイル

# ポリシーの変更
ポリシーを変更する場合、以下のようなSQLを実行し、ポリシーを定義する変数を設定する。

```sh:ポリシーの変更
mysql> set global validate_password_length=6;
```
上記は、パスワードの長さを6文字に変更している。

# 参考
[MySQL 5.6 リファレンスマニュアル](https://dev.mysql.com/doc/refman/5.6/ja/validate-password.html)
【2019版】 Mac に Haskell の環境構築をして stack で helloworld するまで

# はじめに

Mac で stack を用いて Haskell の hello world をする方法を記載します。

# 環境

* Mac
  * brew
  * tree

# Haskell とは

Haskell (ハスケル) とは、純粋関数型プログラミング言語です。
高階関数や静的多相型付け、定義可能な演算子、例外処理といった多くの言語で採用されている現代的な機能に加え、パターンマッチングやカリー化、リスト内包表記、ガードといった多くの特徴的な機能を持っています。

参考: [wikipedia](https://ja.wikipedia.org/wiki/Haskell)

# Stack とは

Stack は、Haskellプロジェクトを開発するためのクロスプラットフォームプログラムです。 

以下の機能があります。

* 隔離された場所にGHCを自動的にインストール
* プロジェクトに必要なパッケージをインストール
* プロジェクトを構築
* プロジェクトをテスト
* プロジェクトをベンチマーク

参考: [The Haskell Tool Stack](https://docs.haskellstack.org/en/stable/README/)

# 環境構築

`brew` を使って、 `stack` をインストールしましょう。

```bash
$ brew install stack
$ stack setup  # コンパイラや基本パッケージをインストール
```

# プロジェクトの作成

`stack new` でプロジェクトを作成できます。

```bash
$ cd /path/to/your/workspace
$ stack new helloworld  # helloworld プロジェクトの作成
$ cd helloworld
```

## プロジェクトファイルの確認

`tree` コマンドで、ディレクトリ構成を見てみましょう。
細かい説明は、割愛します。

```bash
$ tree
.
├── ChangeLog.md
├── LICENSE
├── README.md
├── Setup.hs
├── app
│   └── Main.hs
├── hello.cabal
├── package.yaml
├── src
│   └── Lib.hs
├── stack.yaml
├── stack.yaml.lock
└── test
    └── Spec.hs

3 directories, 11 files
```

# プロジェクトの編集

それでは、プロジェクトを編集していきましょう。
主要なファイルは、 `app/Main.hs` と `src/Lib.hs` です。

## app/Main.hs

app/Main.hs を見ると、Lib が import されており、 main で someFunc が呼び出されています。

```hs
module Main where

import Lib

main :: IO ()
main = someFunc
```

この someFunc は src/Lib.hs に定義されているので、そっちをみてみましょう。 

## src/Lib.hs の確認

src/Lib.hs をみると、デフォルトではこのようになっているはずです。

```hs
-- src/Lib.hs
module Lib
    ( someFunc
    ) where

someFunc :: IO ()
someFunc = putStrLn "someFunc"
```

## src/Lib.hs の編集

src/Lib.hs を以下のように編集してみましょう！

```hs
-- src/Lib.hs
module Lib
    ( someFunc
    ) where

someFunc :: IO ()
someFunc = putStrLn "Hello, world!"  -- 編集
```

# プロジェクトの実行

それではお待ちかね、プロジェクトを実行しましょう。

```bash
$ stack build
$ stack exec helloworld-exe   # stack exec [プロジェクト名]-exe
Hello, World!
```

無事、「Hello, World!」 が表示されましたね！

# 終わりに

いかがだったでしょうか？
おそらくこれが、 Haskell と Stack を用いた最速の Hello, World かと思われます。

これで、皆さんも良い Haskell ライフを！
phpで簡易掲示板を作る

・投稿機能のみ
・データ保存先はテキストファイル

```php:index.php
<?php 
//変数定義
$err_msg1 = "";
$err_msg2 = "";
$messsage = "";
$name = (isset($_POST["name"]) === true) ? $_POST["name"]: "";
$comment = (isset($_POST["comment"]) === true) ? ($_POST["comment"]) : "";

//投稿時の処理
if(isset($_POST["submit"]) === true){
    if ($name === "") $err_msg1 = "名前を入力してください";

    if($comment === "") $err_msg2 = "コメントを入力してください";

    if($err_msg1 === "" && $err_msg2 === ""){
        $fp = fopen("data.txt", "a");
        fwrite($fp, $name."\t".$comment."\n");
        $messsage = "書き込みに成功しました。";
    }
}

//表示の処理
$fp = fopen("data.txt","r");
$dataArr = array();
while($res = fgets($fp)){
    $tmp = explode("\t",$res);
    $arr = array(
         "name" => $tmp[0],
         "comment" => $tmp[1]
    );
    $dataArr[] = $arr;
}
?>

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>掲示板</title>
    </head>
    <body>

    <form action="" method="post">
        名前: <input type="text" name="name" value="<?php echo $name; ?>">
        <?php echo $err_msg1; ?><br>
        コメント: <textarea type="textarea" name="comment" rows="4" cols="40"><?php echo $comment; ?></textarea>
        <?php echo $err_msg2; ?><br>
        <input type="submit" name="submit" value="クリック">
    </form>

    <dl>
        <?php foreach ($dataArr as $data): ?>
            <p><span><?php echo $data["name"]; ?></span>:<span><?php echo $data["comment"]; ?></span></p>
        <?php endforeach; ?>
    </dl>
    </body>
</html>
```
【Angular】引数を複数渡すPipeの作り方とその呼び出し方を知りたい

## はじめに
今回は複数の引数を持つカスタムPipeの作り方およびその呼び出し方について共有していく。

## 作るもの
長い文の時に**指定された文字数で表示**し、**余った部分は指定された文字に置き換える**というカスタムPipeを作る。
（例）20文字まで表示し、余った部分は'…'に置き換える

```
わらわこそ夜を統べる者、イリヤ・オーンスタイン！こたびの働きを評価し、お主を我が眷属としてやろう！
↓
わらわこそ夜を統べる者、イリヤ・オーンス…
```

## カスタムPipeの作成

```bash
$ ng g pipe shared/pipes/omit-long-sentence --skipTests=true
```
※specファイルの生成はどちらでも良いです。Pipe系は`shared/pipes`配下に作成しているので、ここはみなさんのプロジェクトでよしなに合わせてください。

出来上がったファイルがこちら↓(formatterをかけてるのでスペースが異なります。)

```typescript:omit-long-sentence.pipe.ts
import { Pipe, PipeTransform } from '@angular/core';

@Pipe({
    name: 'omitLongSentence',
})
export class OmitLongSentencePipe implements PipeTransform {
    transform(value: any, ...args: any[]): any {
        return null;
    }
}

```

`transform()`の第一引数にpipeを適用する文字列が入ってくる。第二引数以降が実際に引数として渡される部分。
今回はこのように実装した。

```typescript:omit-long-sentence.pipe.ts
import { Pipe, PipeTransform } from '@angular/core';
​
/**
 * 長文を省略し別の文字に置き換える。
 * @param lengthToDisplay 表示する文字の長さ
 * @param replaceStr 置き換える文字
 *【使用例】
 *   {{'あいうえお' | omitLongSentence 3:'…'}} => 'あいう…'
 */
@Pipe({
    name: 'omitLongSentence',
})
export class OmitLongSentencePipe implements PipeTransform {
    transform(value: string, lengthToDisplay: number, replaceStr = ''): string {
        return `${value.slice(0, lengthToDisplay)}${replaceStr}`;
    }
}
```

第１引数には表示する文字数、第２引数には置き換える文字を受け取るようにした。
配列のままでもいいが、**引数を明示的にすることで何の値なのかがわかりやすい**ので引数を増やす方針にした。

## 実際にpipeを適用してみる
Pipeに複数引数を渡す時はこのように**コロン繋ぎ**で指定する。

```html:pipe-test.component.html
<p>{{ text | omitLongSentence:20:'…'}}</p>
```

実際に表示してみると、
<img width="357" alt="スクリーンショット 2019-12-21 15.30.11.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/316318/9325d0e5-ed80-6619-b987-22c4fdfaf900.png">

ちなみに置き換える文字列を変えてみると、

```html:pipe-test.component.html
<p>{{ text | omitLongSentence:20:'☆'}}</p>
```

<img width="348" alt="スクリーンショット 2019-12-21 15.31.25.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/316318/5c082ced-e58c-24e2-f9a2-9b3d39329680.png">

変更された。

## まとめ
- カスタムPipeに複数の引数を渡す時は、**第２引数以降を増やしていく。**
- カスタムPipe利用時に複数引数を渡す時は、**コロン繋ぎで渡す。**

## 参考
- [複数の引数を指定してAngular 2パイプを呼び出す方法](https://codeday.me/jp/qa/20190313/372324.html)
クラウド反対派に贈るポータルカスタマイズ

この記事は [kintone Advent Calendar 2019 part1](https://qiita.com/advent-calendar/2019/kintone) 22 日目の記事です。

#はじめに
ここで記載させていただく内容は kintone hack 本戦 で追加機能として発表する予定だったのですが、3 日前にボツにしたネタです。個人的には一番入れたかった内容なのですが、分かりやすさとシナリオとのバランスを考えて直前ギリギリにボツにしました。

せっかく作ったネタではあるので、今日ここに書くことで成仏させてあげたいと思います。

#想定されるシーン
皆さんの会社にもこういう人いると思います。
![クラウド反対派.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/129487/0200c4bb-9c82-e5bb-2864-c4da4d79226a.png)

よくわかんないですよね。

特に注目していただきたいのが一番下の人です。こういう人は~~kintone 使わなければいいのに・・・~~、kintone でせっかく良いポータルを作っても使ってくれませんし、自分の推し画像のポータルでなければこの人自身の仕事の効率も上がりません。

そこで、「推し画像をクラウド上に保存せずにポータルをカスタマイズする」ということを実現したいと思います。（ちょっと何言ってるかわかんないです）

#解決方法
仕組みとしては至って簡単で ngrok というサービスを使います。これを使うと「インターネット上に公開されていないサイトへのアクセスを可能にする」ことができます。
※公式のサービス説明は「ngrok exposes local servers behind NATs and firewalls to the public internet over secure tunnels.」と書かれています。

通常社内ネットワークに存在している PC やサーバーはインターネットへのアクセスは可能であっても、インターネットから社内ネットワークへの PC へのアクセスはできません。これはグローバル IP を持っていないし、Firewall でブロックされているからです。（細かく言うと色々ありますが、わかりやすくするためにザックリ書いています）

ngrok というサービスを使うと、仮想的なトンネルを作ることで社内ネットワークにある PC に対してインターネットからアクセスさせることが可能となります。

#ngrok の使い方
ngrok の使い方はとても簡単です。特に説明が無くても使うことはできると思いますが、ざっくり手順を記載します。

###1.ngrok のサインアップ
ngrok は無償でも使うことができるのですが、私は独自サブドメインを使いたかったので有償契約（5$/month）をしました。無償の場合は abcxyz.ngrok.io のような適当なサブドメインが付与されます。
![reserved domains.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/129487/83feae26-d43a-b848-2fb9-d7de7230a21d.png "Reserved Domains")

###2.authtoken の取得
ngrok のページでログイン後の画面の「auth」という項目を開くと authtoken が表示されますのでこれをコピーしておきます。

###3.ngrok agent のインストール
Linux,Mac,Windows,FreeBSD 用の agent モジュールが用意されているので、適切なモジュールを自分の PC にインストールします。
インストールと言っても、zip ファイルをダウンロードして解凍するだけです。

###4.ngrok agent の実行
サブドメイン名 suzuki-airi
ローカル Web サーバーのポート 8080番
に場合は、こんなコマンドを実行します
```ngrok http -region=jp -subdomain=suzuki-airi 8080```

ngrok は設定としてやるのは本当にこれぐらいです。
これで、https://suzuki-airi.nrgok.io へアクセスすると、ローカル PC で動いている Web サーバー（ポート 8080番）へ接続ができるようになります。

#Kintone Portal Designer の設定
Kintone Portal Designer の「basic-1column-photo」というテンプレートを使っている場合、背景画像を変更する場合には CSS の 117 行目に背景画像の指定があります。

```  background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), url("https://static.cybozu.com/contents/k/image/ocean/cover/freshleaf.jpg");```

ここを先程設定した ngrok の URL に書き換えると、ローカルで動いている Web サーバー上の画像を参照させることができるようになります。

実際動かしてみるとこんな感じですね。
![ポータル変更.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/129487/40f1e5a9-ed2a-362c-ed05-b9c1ec353ef9.gif)


元々犬の画像で作られていたポータルですが、ローカルのファイルを置き換えただけで猫の画像に切り替わっています。

#実業務での使いどころ
この ngrok の「社内ネットワークにあるデータをインターネット上に公開する」という仕組みは当然ポータル以外でも使えます。

例えば、社内ネットワークにあるライブカメラが定期的に写真を撮影するような仕組みの場合、定期的に生成されるファイルを都度アップロードしなくても kintone 上で閲覧することもできますし、社内にある BI ツールで生成されたダッシュボード画像を kintone にて閲覧することもできるようになります。

是非皆さんもお試しいただければと思います。
phpでクイズを作る

```php:indexのコピー.php
<?php 

$title1 = '動物の種類は何でしょうか?';

$title2 = '何才でしょうか?';

$title3 = '好きな触られ方は何でしょうか?';

$quistion1 = array('猫', '犬', '狛犬', '人間');

$quistion2 = array('11才', '10才', '12才', '15才');

$quistion3 = array('なでなで', 'スリスリ', 'もふもふ', 'ツンツン');

$answer1 = $quistion1[0];

$answer2 = $quistion2[0];

$answer3 = $quistion3[0];

shuffle($quistion1);

shuffle($quistion2);

shuffle($quistion3);

?>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>クイズ</title>
</head>
<body>

    <h1>○○○○さんについての質問</h1>

    <h2><?php echo $title1; ?></h2>
    <form method="post" action="answerのコピー.php">
    <?php foreach($quistion1 as $value) { ?>
    <input type="radio" name="question1" value=" <?php echo $value; ?> "> <?php echo $value; ?><br>
    <div><?php echo $value; ?></div>
    <?php } ?>
    <input type="hidden" name="answer1" value=" <?php echo $answer1; ?> ">
    <div><?php echo $answer1; ?></div>

    <h2><?php echo $title2; ?></h2>
    <?php foreach($quistion2 as $value) { ?>
    <input type="radio" name="question2" value=" <?php echo $value; ?> "> <?php echo $value; ?><br>
    <div><?php echo $value; ?></div>
    <?php } ?>
    <input type="hidden" name="answer2" value=" <?php echo $answer2; ?> ">
    <div><?php echo $answer2; ?></div>

    <h2><?php echo $title3; ?></h2>
    <?php foreach($quistion3 as $value) { ?>
    <input type="radio" name="question3" value=" <?php echo $value; ?> "> <?php echo $value; ?><br>
    <div><?php echo $value; ?></div>
    <?php } ?>
    <input type="hidden" name="answer3" value=" <?php echo $answer3; ?> ">
    <div><?php echo $answer3; ?></div>

    <input type="submit" name="submit">
</form>
</body>
</html>
```

```php:answerのコピー.php
<?php 

$question1 = $_POST['question1'];
$answer1 = $_POST['answer1'];

$question2 = $_POST['question2'];
$answer2 = $_POST['answer2'];

$question3 = $_POST['question3'];
$answer3 = $_POST['answer3'];



// 結果の判定
if ($question1 == $answer1) {
	$result1 = "正解！";
}else{
	$result1 = "不正解";
}

if ($question2 == $answer2) {
	$result2 = "正解！";
}else{
	$result2 = "不正解";
}

if ($question3 == $answer3) {
	$result3 = "正解！";
}else{
	$result3 = "不正解";
}

?>

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<title>Document</title>
</head>
<body>


<h2>クイズの結果 1問目</h2>
<?php echo $result1; ?>

<h2>クイズの結果 2問目</h2>
<?php echo $result2; ?>

<h2>クイズの結果 3問目</h2>
<?php echo $result3; ?>

</body>
</html>
```
phpで九九表つくる

・偶数に色を付ける


```php
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>九九表</title>
    <style>
body {
  font-family:
  "Hiragino Kaku Gothic Pro N",
  Meiryo,
  sans-serif;
}
table {
    border-collapse: collapse;
    border: 1px solid coral;
}
th, td {
    width: 50px;
    border: 1px dotted coral;
}
th {
    background: lightpink;
}
td {
    text-align: center;
}
th:hover, td:hover{
    background: #4169e1;
}
.color {
    background: #ffff00;
}
    
    </style>
</head>
<body>

<h1>九九表</h1>
<table>
    <tr><th></th><th>1</th><th>2</th><th>3</th><th>4</th><th>5</th><th>6</th><th>7</th><th>8</th><th>9</th></tr>
    <?php 
    for($i = 1; $i <= 9; $i++){

        echo '<tr>';
        echo '<th>'.$i.'</th>';

        for ($j = 1; $j <= 9; $j++) {
            // かけ算をして出た値を変数に格納
            // 格納したものを表示かつ偶数であればclassをつける
            $num = $i * $j;
            if ($num % 2 == 0){
                echo '<td class="color">'.$num.'</td>';                
            }else{
                echo '<td>'.$num.'</td>';
            }
        }
        echo '</tr>';
    }
    ?>

</table>





</body>
</html>
```
Outlook PSTファイルを分割する方法-解決済み

##特大のPSTファイルを分割する安全なトリックを学ぶ
適切に管理されていないと、サイズの大きいPSTファイルを処理するのは大変な作業になります。エラーやデータの損失を引き起こす可能性があるため、サイズの大きいOutlookファイルを管理してください。混乱を避けるために適切な対策を講じることをお勧めします。このブログでは、PSTファイルを分割し、手間をかけずにOutlookを実行する方法について説明します。特大のPSTファイルを分割する手順について詳しく説明したので、注意深く読んでください。 PSTファイルが大きすぎると、Outlookの動作が遅くなったり、定期的にハングしたりする可能性があります。

綿密な調査の結果、PSTファイルを分割するツールキットが1つ見つかりました。Advik PSTファイル 分割 フリーソフトソフトウェアを確認してください。このソフトウェアを試してみたところ、大きなサイズのPSTファイルを小さなファイルに分割できることがわかりました。たとえば、20 GbのOutlook PSTをさまざまなサイズ（使用可能なバリエーションは2 GB、5 GB、10 GB）に変換できます。
さらに、ユーザーごとにPSTを分割するオプションが提供されます。すべてのユーザーアカウントは、個別のユーザー用に個別のPSTを作成します。すごいですね。
それでは、PSTファイルを分割する方法の完全なデモを見てみましょう。

##PST分割ソフトウェアを使用してpstを分割する手順は次のとおりです。
1. PCで[AdvikスプリットPST](https://www.adviksoft.com/pst/splitter.html)ソフトウェアを実行します。
2. [ファイルの追加]をクリックして、Outlook .pstファイルを追加します。
3. メールボックスフォルダーを選択し、[次へ]をクリックします。
4. リストから保存オプションとしてPSTを選択します。
5. [PSTの分割]をクリックし、サイズのバリエーションを選択します。
6. 変換をクリックして完了！

![スプリットpstソフトウェア.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/526912/3a8e5d01-62e9-2060-2883-3a042be8f08a.png)

無料ダウンロード ：https://www.adviksoft.com/dl/advik-outlook-pst-converter.exe
npm使い方メモ

めっちゃ簡単にまとめます。自分用メモです。

# 参考
https://qiita.com/kijitoraneko/items/175ef29d45d155b3f405
https://techacademy.jp/magazine/16158

# コマンド
```sh
$ npm install {パッケージ名} #ローカルインストール
$ npm install -g {パッケージ名} #グローバルインストール
$ npm install --save{パッケージ名} #依存関係をpackages.jsonに記録
$ npm install --save-dev{パッケージ名} #依存関係を開発環境用としてpackages.jsonに記録
$ npm install {パッケージ名} {パッケージ名} #複数インストール
$ npm outdated #アップデートを確認
$ npm outdated -g #アップデートを確認
$ npm update {パッケージ名} #アップデート
$ npm update -g {パッケージ名} #アップデート
$ npm uninstall {パッケージ名} #アンインストール（インストールと基本コマンドは同じ）
$ npm uninstall --save{パッケージ名} #依存関係をpackages.jsonから削除
$ npm install #packages.jsonに従ってインストール
```

# パッケージのインストール先
### グローバルインストール
環境全体から使えるモジュールをインストールします。
インストール先は `$ npm list -g` で調べられます。

```sh
$ npm list -g | head -n 1
/Users/ebiyuu1121/.nodebrew/node/v13.5.0/lib
#/Users/ebiyuu1121/.nodebrew/node/v13.5.0/lib/node_modules にインストールされる
```

### ローカルインストール
カレントディレクトリの `node_modules` にインストールされる。（親ディレクトリのみに `node_modules` がある場合はそちらにインストールされるようです。

# package.jsonに関して
`--save` オプションをつけたパッケージが記録されます。
このファイルを他の環境に移動すれば他の環境でも同じモジュールを再現することができます。
`package-lock.json` は `$ npm install` `$ npm update` を実行した時にインストールしたバージョンを記録しています（再度 `$ npm install` しても同じバージョンがインストールされることを保証しています。
MySQLのデフォルトパスワードを確認する

# はじめに
MySQL5.7以降では、デフォルトでrootユーザーのパスワードが自動で初期設定されている。
このパスワードの調べ方のメモ。

# 環境
OSはAmazonLinux2
MySQLのバージョンは5.7

```sh:OS
# cat /etc/system-release
Amazon Linux release 2 (Karoo)

# mysql -V
mysql  Ver 14.14 Distrib 5.7.28, for Linux (x86_64) using  EditLine wrapper
```

# MySQLにrootログインしてみる
rootでMySQLに入ろうとすると、`Access Dinied`となり弾かれます。

```shell
# mysql -u root
ERROR 1045 (28000): Access denied for user 'root'@'localhost' (using password: NO)
```


# MySQLのパスワード確認
rootの初期パスワードを確認する。
初期パスワードは `/var/log/mysqld.log` に記述されているため、以下のコマンドで確認できる。

```sh:パスワード確認
# cat /var/log/mysqld.log | grep password
2019-12-13T06:12:17.402781Z 1 [Note] A temporary password is generated for root@localhost: <初期パスワード>
```

`A temporary password is generated for root@localhost:` 以降の文字列が初期パスワード。
この文字列をコピペしてログインすると、MySQLにログインできるようになる。

```sh:MySQLにログイン
# mysql -u root -p
Enter password: 
Welcome to the MySQL monitor.  Commands end with ; or \g.
Your MySQL connection id is 8
Server version: 5.7.28

Copyright (c) 2000, 2019, Oracle and/or its affiliates. All rights reserved.

Oracle is a registered trademark of Oracle Corporation and/or its
affiliates. Other names may be trademarks of their respective
owners.

Type 'help;' or '\h' for help. Type '\c' to clear the current input statement.

mysql>
```

# 初期パスワードの変更
ログインできれば、初期パスワードは変更しておく。

```sh:初期パスワード変更
mysql> set password for root@localhost='新パスワード';
Query OK, 0 rows affected (0.00 sec)
```
[#awscertified] AWS Certified DevOps Engineer - Professional ポイントのおさらい

失効していたので3年ぶりくらいに受けてきました。前日受けた模試が60%だったので正直無理ゲーかなと思っていましたが、なんとか受かってよかった。

消去法のような「いかにも」な解き方をしておりちゃんと理解できてない内容も多いので、復習を兼ねて留意すべきトピックなど残しておこうと思います。

# 出題傾向

CI/CDの話題は多いです。Code系サービスとCloudWatch(Events/Logs)は全体的に登場回数が多かったです。

「DevOpsエンジニアは〜〜〜のためにどうすべきでしょうか？」みたいな書きっぷりのパターンが多い。

分類すると以下のようなところの印象が強いです。

- ガバナンス（trailをで分析する仕組みがほしいとか、ユーザー部門に対して自社ポリシーを満たしたAMIの使用を強制するとか）
- 継続的デプロイ
    - パイプラインの組み方に関する出題（AMIとかAutoScalingが絡む内容が多い、サーバーレスがほんの少しだけ）
    - デプロイ戦略に関する問題（ダウンタイムを極小化したい・エラーを多数観測したらすぐに切り戻したい、とかの要件）
- ロギング（全編に渡りロギングが関連する出題は多い。アプリケーションログをどうやって分類してアラートするのか？とか、永続化して一元的に分析できるようにするにはどうしたら？とか）
- DR（RTO/RPOの要件に指定がある前提で、どの手法がベターか？とか）

AWSサービスで言うと以下で挙げるものが特に頻出した印象があります。上にあるほどよく単語が出現し、かつ重要です（私の体感値として）。

- CloudWatch Events
- CloudWatch Logs (メトリックフィルタとか)
- Code系 (特にCodeDeploy、AutoScalingとセットで出てくることがかなり多かった）
- CodePipeline
- EC2 AutoScaling (ライフサイクルフックを絡めて何かする問題もいくつか)
- Systems Manager (特にParameter Store)
- CloudFormation
- Config

他にも色々ありますが、強いて挙げるならElastic Beanstalkの少しだけDeepなネタが多少登場します。

他にはSNSやALB。SNS自体がシンプルなのでさほどがっつり調べる必要なさそうな気もしますが、登場回数だけなら割と頻出だったと思います。ALBはまぁ、SA Proでも普通に頻出トピックだと思うのでSAの対策勉強しているくらいのインプットで必要十分かなと。

出題文にはさほど出てこないもののIAMやS3周りのポリシー関係の知識は割と前提みたいなところがありそうです。

「オンプレにもデプロイしたいんだけど」とか「CI/CDパイプラインでこれこれを自動化したい（ガバナンス的なチェックやコードの自動テストなど）」のようなシチュエーションが多かった印象です。

あと、デプロイ戦略のところですが技術要素としてはRoute53、ALB(ターゲットグループ)、AutoScaling、CodeDeploy、Lambda(エイリアス)、あたりが出てきたと思います。これとセットで、「新バージョンでアプリケーションログを監視し、エラーを一定割合検出したらトリガーしてロールバックしたい」みたいな要件もちょいちょい出ました

# 感想

- 模試の方が難易度高い問題が多い
- 日本語が難解すぎて、後半戦は読解するのが辛かった
    - 模試で慣らしてなかったら、おそらく合格は難しかった
    - 問題文の最後から読む方が有効な問題も多い
- 頭が疲れるので、2分未満くらいの時間、目を閉じてリフレッシュする時間を何回かとった
- 英語の原文が見られるようになってたのが地味にありがたく、いざというときに頼りになる
    - 明らかに不自然な選択肢や、ニュアンスの読解に苦慮する内容は英語も見る
    - 原文だとCloudFrontだったものが日本語ではCloudFormationになってる誤植が1問（最後の見直しで原文を見て発覚）
    - 日本語の記述を100%信用してはいけない。絶対にいけない
- ペース配分大事
    - 途中で休憩する時間は必要。振り返りの時間も、できれば必要
    - 日本語を読解するために脳のリソースが余計に消耗して集中が維持できない（加齢）
    - 10分以上残す、くらいの心持ちで5/10問おきぐらいに残り時間を見ておくとよい

# まとめ

疲れた・・・。次はMLでも受けようかなと思います。
番外編 1. Rubyチュートリアル

# 1. Rubyについて
# Ruby in Twenty Minutes
https://www.ruby-lang.org/en/documentation/quickstart/

# irbを使ってみよう

```
irb
```

とtypeしてirbを起動しよう。インタラクティブなrubyが起動します。
https://www.ruby-lang.org/en/documentation/quickstart/
これをやってみたあとに下記の演習をやってください。


```
irb(main):001:0> 23 + 27
=> 50
irb(main):002:0> 50 - 23
=> 27
irb(main):003:0> 10 * 5
=> 50
irb(main):004:0> 10**5
=> 100000
irb(main):006:0> x = 1
=> 1
irb(main):007:0> x + 59
=> 60
irb(main):005:0> 50 / 5
=> 10
irb(main):008:0> hi = "Hello, Mac!"
=> "Hello, Mac!"
You can also invoke a single program with irb. After running the program, irb exits. Let's call our hello.rb program −

$ irb hello.rb
hello.rb(main):001:0> #!/usr/bin/env ruby
hello.rb(main):002:0*
hello.rb(main):003:0* class Hello
hello.rb(main):004:1> def initialize( hello )
hello.rb(main):005:2> @hello = hello
hello.rb(main):006:2> end
hello.rb(main):007:1> def hello
hello.rb(main):008:2> @hello
hello.rb(main):009:2> end
hello.rb(main):010:1> end
=> nil
hello.rb(main):011:0>
hello.rb(main):012:0* salute = Hello.new( "Hello, Mac!" )
=> #
hello.rb(main):013:0> puts salute.hello
Hello, Mac!
=> nil
```


# 2. rails consoleを使ってみよう

```
rails console
```

```
> Hotel.all
> Hotel.first
> Hotel.last
> Prefecture.first
```

new, save, createなどのコマンドを試そう。
Stack

# Pythonで「スタック（Stack）」

## はじめに

ここでは[「プログラミングコンテスト攻略のためのアルゴリズムとデータ構造」][1]の中で取り上げられている[「AOJ (Aizu Online Judge」)][2]の問題を自分で解いた際に学んだことや、こう考えれば分かりやすいと感じたことなどを自分への整理も兼ねてまとめています。
このテキストはC++で書かれているので、私のようにpythonで勉強をされている初学者の方の参考になれば幸いです。また私自身も初学者ゆえ、至らない点が多々あると思いますので、ご指摘・ご助言頂ければ喜びます。よろしくお願いします。

## 問題詳細

[ALDS 1_3_A: Stack][3]
スタックを利用して逆ポーランド記法の計算を行う問題です。
問題詳細は上記リンクをご参考ください

## 考え方
・後入れ先出しを利用して、演算子の手前二つの数値を計算します

## pythonコード
```python
from collections import deque

l = input().split()

st = deque()  # dequeはスタック、キュー、デックに利用可能
for k in l:
    if k in "+*-":     # 演算子の場合は手前２つの数値を用いて演算を行う
        n2 = st.pop()
        n1 = st.pop()
        st.append(str(eval(n1 + k + n2))) # 計算結果を再び入れる
    else:
        st.append(k)   # 数値の場合はスタックに追加

print(st[0])
```````

## ポイント
・スタックとして扱うので、基本操作はpop()とappend()です。
・演算子が来た時に手前２つの数値を用いて計算するのですが、スタックから数値を取り出す順番は、計算を行う順番とは逆になるので（後入れ先出しだから）注意が必要です。
・「pop操作を行う＝要素を取り出す」なので、pop操作を行ったあとにはその要素はスタックに残っていません（当たり前ですが）。


## まとめ
以上となります。間違いや改善点などございましたら、よろしくお願いいたします。


[1]:https://book.mynavi.jp/ec/products/detail/id=35408
[2]:https://onlinejudge.u-aizu.ac.jp/home
[3]:https://onlinejudge.u-aizu.ac.jp/courses/lesson/1/ALDS1/all/ALDS1_3_A
Goで迷路生成ツールを作る

この記事は[tomowarkar ひとりAdvent Calendar 2019](https://qiita.com/advent-calendar/2019/tomowarkar)の21日目の記事です。


# はじめに
以前作成したツールに迷路生成機能を追加してみました。

[Goで地形生成ツールを作る](https://qiita.com/tomowarkar/items/1645c4443a18c6948a59)
[迷路の最短経路探索を実装する](https://qiita.com/tomowarkar/items/1b3c296b555755fac5d4)
![OreIs9NBAPeoy2ulD8Fs1576904354-1576904601.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/235435/e045ba0c-2154-1056-e41f-08e8f8824f64.gif)

このように自動迷路を生成する機能と、最短経路を求める機能になります。

迷路生成アルゴリズムは現状棒倒し法と穴掘り法の2種類だけなのでゆるりと拡張していけたらなという感じです。

# 使い方
### ソースコード
<a href="https://github.com/tomowarkar/biome"><img src="https://github-link-card.s3.ap-northeast-1.amazonaws.com/tomowarkar/biome.png" width="460px"></a>

### go get
```
go get -u github.com/tomowarkar/biome
```

# コード

```go
package main

import (
	"image/color"

	"github.com/tomowarkar/biome/maze"
)

func main() {
	// 迷路描画フィールドの生成
	mazeWidth, mazeHeight := 37, 27
	m := maze.NewMaze(mazeHeight, mazeWidth)
	var seed int64

	palette := []color.Color{
		color.RGBA{184, 134, 11, 255},
		color.RGBA{240, 230, 140, 255},
		color.RGBA{255, 0, 255, 255},
	}
	// 棒倒し法
	m.StickDown(seed)
	// 迷路を10倍スケールでpng変換
	m.ToPng("maze1", 10, palette)
	// 迷路の最短経路を導出
	m.Solve()
	m.ToPng("route1", 10, palette)

	// 穴掘り法
	m.Digging(seed)
	m.ToPng("maze2", 10, palette)
	m.Solve()
	m.ToPng("route", 10, palette)
}
```
# 棒倒し法

##### maze1.png

![maze1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/235435/33e92ed5-c3f1-8be5-0703-a5e35b43683c.png)

##### route1.png

![route1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/235435/50cde9a1-1e56-6409-1340-acee44f394e8.png)

# 穴掘り法

##### maze2.png

![maze2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/235435/3f139324-ab4d-f547-f64c-caa984ffeb05.png)

##### route2.png

![route2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/235435/453de877-c3a2-7079-a90e-54e8360567ab.png)


# おわりに
明日はGIF画像生成について書いていけたらなと思います。

以上明日も頑張ります！！
[tomowarkar ひとりAdvent Calendar Advent Calendar 2019](https://qiita.com/advent-calendar/2019/tomowarkar)
Railsをherokuでデプロイする方法



herokuでのデプロイは、AWSに比べてめちゃめちゃ簡単だったので、まとめました！

(githubへのpush、会員登録、クレジットカード登録など完了後)


##herokuにログインする

デプロイしたいアプリに移動したら

```

$ heroku login
```

何かキーを押してくださいと言われるので、適当にエンターキーを押す。
↓
herokuのページに推移する。
↓
loginを押してターミナルに戻る
↓
ログイン完了


##作ったアプリをherokuとリンクさせる

デプロイしたいアプリに移動したら

```
$ heroku create　アプリ名
```

アプリ名がURLに入るのでしっかり考えましょう
すでにそのアプリ名がherokuで使われている場合はできません


##データベースを作成する

※データベースが必要な場合のみ

```
ターミナル

$ heroku addons:create cleardb:ignite
```

これでデータベース作成は完了しました。

##mysql2の環境変数を指定

初期設定だとmysql2の設定ができていないのでそこを設定していきます。
現在のmysqlの設定を確認します。

```

$ heroku config
```
以下のような長い文字列が出てくるので、それに応じて環境変数を入力していきます。

```
CLEARDB_DATABASE_URL: mysql://<ユーザー名>:<パスワード>@<ホスト名>/<データベース名>?reconnect=true
```

heroku configで表示された文字列をもとに、以下のように入力していきます。

```
$ heroku config:add DB_USERNAME='<ユーザー名>'
$ heroku config:add DB_PASSWORD='<パスワード>'
$ heroku config:add DB_HOSTNAME='<ホスト名>'
$ heroku config:add DB_NAME='<データベース名>'
$ heroku config:add DB_PORT='3306'
$ heroku config:add DATABASE_URL='mysql2://<ユーザー名>:<パスワード>@<ホスト名>/<データベース名>?reconnect=true'
```

##エラー対策の微調整

```config/environments/production.rb
 #初期はfalseなので変更
 config.assets.compile = true 
 
 #config.assets.js_compressor = :uglifierを変更
 config.assets.js_compressor = Uglifier.new(harmony: true)
```

##デプロイ
```
$ git push heroku master
```

##データベースのmigrate

```
$ heroku rake db:migrate
```

##アプリの立ち上げ

```
$ heroku open
```
これでブラウザに、作ったアプリが表示されます！


##補足

万が一、エラーが出てしまった場合は

```
$ heroku logs -t 
```

で確認できるので、修正し、ローカルからgithubへのプッシュ。
そして再度

```
$ git push heroku master
```

をすれば大丈夫です。