OmniAICreator/Qiita-1.07M huggingface dataset:
文系大学生がプログラミングを初めて実務経験１年たったのでまとめてみた

# はじめに
去年の６月から実務をはじめてようやく１年が経ったのであらためてこの１年間を振り返って見ようと思います
https://qiita.com/takehanKosuke/items/ff39f678de682e9c8526
実務初めて４ヶ月のときに書いた記事です。良ければこちらもどうぞ！

# 簡単な経歴
- 大学４年生（休学中）
- 心理学部
- TECH::CAMPでRubyを勉強
- プログラミング歴　１年ちょっと（2018/3/16~)
- プログラミングをはじめるまではパソコンはYouTubeみるものでした笑
- 超短納期（１０日間）でのwebサイトリリース経験
- スタートアップでのサービスローンチを経験
- フリーランスエンジニアとしても仕事をいただく
- 月間PV数1500万オーバーのサーバーサイドエンジニアとして活躍

# 実務で触ったことのある技術
### フロント
- html
- css
- scss
- jquery
- react.js
- riot.js
- nuxt.js

### バックエンド
- ruby/rails
- go/echo
- php/cake
- node.js

### その他
- Git
- Mysql
- Postgresql
- SQL
- AWS
- GCS
- fruentd
- Docker
- k8s
- cercle ci
- シェルスクリプト
- Redis
- Redis cluster
- Elasticsearch

※あくまで触ったことのあるものを列挙するとこんな感じというだけですので、誤解だけされないようにお願いします。

# 1つめの会社(2018年6月~2018年12月)
一つ目の会社さんは
https://qiita.com/takehanKosuke/items/ff39f678de682e9c8526
上記の記事で割と頑張ってまとめたのでこちらをみていただきたいのですが、、、
改めてまとめると

- プログラミング歴3ヶ月（簡単なサービスを作れる程度）
- バックエンドはrailsフロントはhtml(haml)・css・jqueryを用いて開発
- インフラは当時は全くその辺の知識がなかったので詳細はわかりませんが、おそらくさくらサーバーあたりのサーバーを使っていたのだと思います。。。（多分w）
- エンジニアは僕と上司の２人だけでしたが、アクティブなサービスを３つほど、たまに機能改善を求められるものや保守運用を行なっていたものを含めると10個以上のサービスを運用してました。（今となっては考えられないw）
- 超短納期でのWebサイトの作成を行なった

と、ざっとこんな感じでした。

その会社さんで前回の記事に書いていないことをざっとお話しすると、、、
あのあと、アクティブに開発を進めていた３つのプロダクトも新規機能開発から保守運用フェーズに入り、毎日の実装内容も当然のことながらviewの細かな修正等の既に知っている知識を使いまわして実装を行うということが増えてきていました。
僕自身最初にお世話になった会社の方々にはとても感謝していますし、間違えなく成長することができた６ヶ月間だったのですが技術的にもっと難しいことをやってみたいと思う気持ちが強くなり、年末というきりの良いタイミングこともあり最初の会社さんを離れることにしました。

# ２つめの会社（2019年1月〜）
２つ目の会社さんはwantedlyでいくつか申し込みその中で１番自分の使ってみたい技術（Go・React）を使っている会社さんに決めました。
そういえば、実務未経験の時は10社くらいに連絡して1社しか面接すら受けさせてもらえなかったのに、今回は5、6社ほど出して4社ほど面接させてもらえたので、やはり学生も実務経験の有無の差はかなりあることを実感しましたね！

2社目の会社さんは
・動画メディアを中心に事業を展開している会社
・エンジニアだけで30人以上
・メインのサービスは月間PV数1500万オーバー
・APIサーバーをgoフロントエンドをjs(react,nuxt ...etc)やらswiftやらで書いています
・インフラはサービスによって異なりますが、社内ではGCP使ってるサービスとAWSを使っているサービス両方があります
・CI/CDの基盤、ログ基盤、インフラ基盤もしっかり整っています

というような感じです。

最初の１週間は
- A Tour of Go
- Reactチュートリアル

を行い、その後業務に合流しました。
僕自身が実装を担当をさせていただいたのはアドミン側のダッシュボードの機能追加や実装でした。

しかし正直なところが最初の３ヶ月くらいはかなりきつかったです笑
理由としては、、、
ーーーーーーーーーーーーーーーーーーーーーーーーー
・そもそもバックエンドとフロントエンドの違いもわかっていなかった
・APIサーバーを作ったことがなかった
・今まで動的型付け言語しかやったことなかった
・ポインタの概念がよくわかっていなかった
・テストを書いたことがなかった
・jsの概念もよくわかっていなかった
ーーーーーーーーーーーーーーーーーーーーーーーーー

らへんが理由かなと思います。
と、まあ、本当は挙げようと思えばもっとたくさん挙げられるのですが、大きめの要因はこんなところですかね汗

特に大変だったのはポインタの概念と、テストの概念でした
もともと新しいことを自分自身概念の習得にはかなり時間のかかる方だったので
リアルに2、３ヶ月「？？？」ってなってました笑

もうひとつはテストの概念ですね
ブラックボックステストやらホワイトボックステストやらテストケースやらと、色々とそれまで考えていなかったことを考えることが多くなったので最初の方は想定されるケースのフォローできてる範囲がとても狭かったです


現在ではポインタの概念にもかなり慣れていきましたし、テストの漏れも少なくなってきたかなと思います。


また最近では社内の人が使うダッシュボード周りをエンジニアではない社内の人と直接お話ししながら要件定義から考えて実装していくということもやらせていただいており、とてもいい経験をさせていただいています。


# 個人的に１年を振り返って、、、
控えめに言ってめちゃめちゃいい経験させてもらっているなと思います。
プログラミング始めてから数えてもたった１年３ヶ月程度ですしその中であれだけ広い分野のことを実務で経験できたのは運がよかったかなと思います。
もちろん、その分自分のプログラミングの出来無さとか理解力の無さに絶望したりもして何度も「自分には向いてないんじゃないか」と思ったりすることも正直今でもなんどもあるのですが、それでも１週間、１ヶ月で単位で振り返ってみると着実に進んでいる感覚があるのでこの感覚を忘れないように今後も１歩ずつ歩いて行きたいと思います！
WindowsでPug+Stylus+CoffeeScriptのコンパイルをする

PCを買い替えたので環境の再構築がてら、リハビリQiitaしていきます。
[以前書いた記事](https://qiita.com/kamitsuki-works/items/955e95651f922cbe0ca2)も古くなって一部動かなかったりしてるや。もう2年前か……(遠い目)

# Node.jsのインストール

Node.jsは公式からDLして、そのままの設定でインストール。バージョンは10.16.0なう。
https://nodejs.org/ja/

# パッケージのインストール

とりあえず作業フォルダでGitBash開いて``npm init``と打つと、
「止める時はCtrl+Cを押してね！」とメッセージが表示されます。
でも未入力でEnterを連打。
```Is this ok? (yes)```　Enterキー、ｯﾀｰﾝ！ とやると、
package.jsonというファイルが作られます。
が、放置して必要なパッケージを入れていきます。

`npm i -D gulp`
`npm i -g gulp`　※gulpをグローバルでも入れておく
`npm i -D gulp-pug`
`npm i -D gulp-stylus`
`npm i -D gulp-coffee`

一応package.jsonにも追加されていることを確認します。

```json:package.json
  "devDependencies": {
    "gulp": "^4.0.2",
    "gulp-coffee": "^3.0.3",
    "gulp-pug": "^4.0.1",
    "gulp-stylus": "^2.7.0"
  }
```

# フォルダ構成

ワークスペース(workspace)
　┣　package.json
　┣　gulpfile.coffee
　┣　resourcesフォルダ（コンパイル対象ファイル置き場）
　┣　vendorフォルダ（他所からもってきたjs/css置き場）
　┗　productsフォルダ（ファイル生成場所）
　　　┣　(htmlはproducts直下)
　　　┣　cssフォルダ
　　　┗　jsフォルダ

### やりたいこと
- vendorのjsはそのままproductsにコピー
- resources下のファイルをコンパイルしてproductsフォルダに配置
- resources下のファイルが更新されたら自動コンパイル

# gulpfile.coffeeの作成

```coffee:gulpfile.coffee
gulp = require 'gulp'
pug = require 'gulp-pug'
stylus = require 'gulp-stylus'
coffee = require 'gulp-coffee'

gulp.task 'compile_html', ->
  gulp.src './resources/*.pug'
    .pipe pug()
    .pipe gulp.dest './products/'

gulp.task 'compile_css', ->
  gulp.src './resources/*.styl'
    .pipe stylus()
    .pipe gulp.dest './products/css/'

gulp.task 'compile_js', ->
  gulp.src './resources/*.coffee'
    .pipe coffee()
    .pipe gulp.dest './products/js/'

gulp.task 'copy_vendor', ->
  gulp.src './vendor/*.css'
    .pipe gulp.dest './products/css/'
  gulp.src './vendor/*.js'
    .pipe gulp.dest './products/js/'

gulp.task 'watch', ->
  gulp.watch './resources/*.pug', gulp.task 'compile_html'
  gulp.watch './resources/*.styl', gulp.task 'compile_css'
  gulp.watch './resources/*.coffee', gulp.task 'compile_js'
  gulp.watch './vendor/*', gulp.task 'copy_vendor'

gulp.task 'compile',
  gulp.series 'compile_html', 'compile_css', 'compile_js'

gulp.task 'deploy',
  gulp.series 'copy_vendor', 'compile'

gulp.task 'default',
  gulp.series 'deploy', 'watch'
```
やりたいことをそのまま書き起こしただけですね。
clear処理もあった方がいいけど割愛します。

# 実行
適当にファイルを用意してresources下に置きます。

```sample.pug
doctype html
html(lang="en")
  head
    meta(charset="utf-8")
    title= Pugサンプル
    meta(name="description",content="Pugサンプル")
    link(rel="stylesheet",href="css/sample.css")
  body
    h1 Pugサンプル
    p CSSが効いていれば
      span(id="red") 赤く
      | なります
    p jsが効いていれば
      span(id="blue") 青く
      | なります
    script(src="https://code.jquery.com/jquery-3.2.1.min.js")
    script(src="js/sample.js")
```
```sample.styl
#red
  color red
```
```sample.coffee
$ ->
  $ '#blue'
    .css 'color','blue'
```

ワークスペースでGitBash開いて、`gulp` ｯﾀｰﾝ！
結果どーん！
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/182494/b7afce17-3a35-15cd-82b8-f092e5efcb89.png)
よかった…動いてよかったよ……

# 冒険はまだ始まったばかりだ！
無事にコンパイル環境が整いました。やっと「ひのきの棒」を手にした感じです。
実はpugもstylusも触ったことないので(上のsampleが初めて)、これから色々試してみようと思います。

やったね！ これで~~1年間ほったらかしにしてた~~サイトが更新できるよ！

PjaxとかBrowserifyとか入れてSPA風にしたいなぁ・ｗ・
文章内にある特定の単語を抽出 and 除外したりする関数

#内容
文章内にある各単語を抽出したり、whereをかけたりするときに、毎回正規表現書くのが面倒だったので、
抽出 or 除外したい単語をlist内にまとめておくと便利にできるやつを作った。

#コード
```sample.py
def regex_words(word_list):
    w_list = []
    forward_regex = "(^| )"
    backward_regex = "($| )"
    for w in word_list:
        w = str(w).strip()
        regex_word = f"{forward_regex}{w}{backward_regex}"
        w_list.append(regex_word)
    return "|".join(w_list)

t_words = ["test ", " test", " test ", "testterms"]
regex_sentence = ["test"]
r_words = regex_words(regex_sentence)
print("r_words: ", r_words)
for t in t_words:
    print(t)
    print(re.search(r"{}".format(r_words), t))
    print("*" * 100)

```
まあとりあえず実行してみてちょ。
t_wordsに文章等を入れ、regex_sentenceに抽出（除外）したい単語を入れる。
そうすると下記のような感じで正規表現で引っ掛けられる単語を判定可能に。
![スクリーンショット 2019-06-28 1.45.28.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/180478/2074d2f4-e703-8a3c-3c73-0f4101fbea36.png)


r_wordsを使うことによって、
df.str.replace(r_words, "")
とか
df[df.str.contains(r_words)]
とか超便利。
Rust で TCP/IP ソケット通信をする際のモデル

大学の課題でソケット通信でオセロ対戦をするプログラムを書いていたのですが、Rust におけるソケット通信の仕様を理解するのに色々と苦労したので、メモしておきます。

<br>

ホスト名とポート番号を指定して、相手とデータのやり取りをする場合を考えます。

```rust
// for example
let host = "localhost";
let port = 3000;
```

まず、IPアドレスに変換してくれる `.to_socket_addrs()` というメソッドがありますが、これによって変換されるアドレスは IPv4 だけでなく IPv6 とかの候補まで出してしまいます。相手側の実装にもよりますが、多分求めているのは IPv4 なので、`.is_ipv4()` というメソッドできちんと絞っておきましょう。

```rust
let host_and_port = format!("{}:{}", host, port);
let mut addrs = host_and_port.to_socket_addrs().unwrap();

if let Some(addr) = addrs.find(|x| (*x).is_ipv4()) {
  // TODO
} else {
  eprintln!("Invalid Host:Port Number");
}
```

アドレスが取れたら `connect` します。成功すると `stream` が得られます。

```rust
let host_and_port = format!("{}:{}", host, port);
let mut addrs = host_and_port.to_socket_addrs().unwrap();

if let Some(addr) = addrs.find(|x| (*x).is_ipv4()) {
  match TcpStream::connect(addr) {
    Err(_) => {
      println!("Connection NG.");
    }
    Ok(stream) => {
      println!("Connection Ok.");
      // TODO
    }
  }
} else {
  eprintln!("Invalid Host:Port Number");
}
```

`stream` が取れたらバッファ`BufReader`, `BufWriter` を作ってしまいましょう。直接 `stream` から `read`, `write` すると遅いので。それに、バッファを作っておけば使い回せます。
引数の`stream`は参照で取るのがミソ。

```rust
let host_and_port = format!("{}:{}", host, port);
let mut addrs = host_and_port.to_socket_addrs().unwrap();

if let Some(addr) = addrs.find(|x| (*x).is_ipv4()) {
  match TcpStream::connect(addr) {
    Err(_) => {
      println!("Connection NG.");
    }
    Ok(stream) => {
      println!("Connection Ok.");
      let mut reader = BufReader::new(&stream);
      let mut writer = BufWriter::new(&stream);
      // TODO
    }
  }
} else {
  eprintln!("Invalid Host:Port Number");
}
```

あとは、`reader` や `writer` を mutable な参照で引数に取る関数をよしなに作っていけば良いです。例えば、

```rust
fn read_something (reader: &mut BufReader<&TcpStream>) {
  let mut msg = String::new();
  reader.read_line(&mut msg).expect("RECEIVE FAILURE!!!");
  // read_line は改行文字まで読む。
  // 他のread系のメソッドもある （https://doc.rust-lang.org/std/io/trait.BufRead.html）
  println!("{}", msg);
}
```

```rust

fn write_something (writer: &mut BufWriter<&TcpStream>, comment: &str) {
  let msg = format!("MESSAGE: {}\n", comment);
  // 送る側もたぶん改行文字を付けたほうがよいでしょう。
  writer.write(msg.as_bytes()).expect("SEND FAILURE!!!");
  writer.flush().unwrap();
}
```

```rust
fn main() {
  let host_and_port = format!("{}:{}", host, port);
  let mut addrs = host_and_port.to_socket_addrs().unwrap();

  if let Some(addr) = addrs.find(|x| (*x).is_ipv4()) {
    match TcpStream::connect(addr) {
      Err(_) => {
        println!("Connection NG.");
      }
      Ok(stream) => {
        println!("Connection Ok.");
        let mut reader = BufReader::new(&stream);
        let mut writer = BufWriter::new(&stream);

        read_something(&mut reader);
        write_something(&mut writer, "hoge");
      }
    }
  } else {
    eprintln!("Invalid Host:Port Number");
  }
}
```

こんな感じで。
kotlinでコマンドラインからハローワールドしようとしたら「マニフェストが云々」って怒られた話

# 怒られ方
* 公式チュートリアルの中から、[Working with the Command Line Compiler](https://kotlinlang.org/docs/tutorials/command-line.html)を開きます。以下、これに沿って進めます。
* まずはkotlinをインストールしろとのこと。とりあえず私はHomebrewでインストールします。
* 次に以下のファイルを作成します。

```hello.kt
fun main(args: Array<String>) {
    println("Hello, World!")
}
```

* コマンドラインで以下を打ち込んでコンパイル。

```console
$ kotlinc hello.kt -include-runtime -d hello.jar
```

* 以下で実行。

```console
$ java -jar hello.jar
```

* おめでとう！無事、以下のメッセージが出てきます。

```console
hello.jarにメイン・マニフェスト属性がありません
```

# 俺が何かしたのか？
分からない。何もしてないのに壊れた。JavaやKotlinに詳しい方、俺が悪かったら教えてください。

# とりあえずエラーを直す
色々弄って雰囲気から推察するに、マニフェストファイル内でエントリポイントを指定する必要があるっぽい。

* jarの中身を見てみる。

```console
$ jar tf hello.jar
```

kotlinのランタイムを除くと、以下のファイルがリストアップされる。

```console
META-INF/MANIFEST.MF
HelloKt.class
META-INF/main.kotlin_module
```

ファイル名`hello.kt`に応じて、自動で`HelloKt`というクラスが生まれる模様。

* マニフェストファイルを取り出す。

```console
$ jar xf hello.jar META-INF/MANIFEST.MF
```

* 取り出したマニフェストファイルを見てみる。

```console
$ cat META-INF/MANIFEST.MF
Manifest-Version: 1.0
Created-By: JetBrains Kotlin

```

エントリポイントは`Main-Class`という項目で指定するらしい。どうみても無い。

* マニフェストファイルを更新する。

```console
$ jar uvfe hello.jar HelloKt
マニフェストが更新されました
```

さっき見つけた`HelloKt`クラスを指定。

* 確認する。

```console
$ jar xf hello.jar META-INF/MANIFEST.MF
$ cat META-INF/MANIFEST.MF
Manifest-Version: 1.0
Created-By: JetBrains Kotlin
Main-Class: HelloKt

```

無事、`Main-Class`が追加された。

* 実行

```console
$ java -jar hello.jar
Hello, World!
```

オーケイ、kotlin完全理解した。

# 注
Javaおじさんじゃないので、妥当な方針で直せているかは不明。

# もっと単純なやり方
@felis さんからコメントで教わりました。ありがとうございます。

> classpathに追加してから実行クラスを指定する方法もあります。`java -cp hello.jar HelloKt`

コマンドの流れをまとめ直すとこういうことですね。

```console
$ kotlinc hello.kt -include-runtime -d hello.jar
$ java -cp hello.jar HelloKt
Hello, World!
```

どう考えてもこっちの方が手っ取り早い。

また、このアドバイスにより気づきを得て、以下でも動くことを発見。

```console
$ kotlinc hello.kt -d hello.jar
$ kotlin -cp hello.jar HelloKt
Hello, World!
```

もっと言えばこれでも良い。

```console
$ kotlinc hello.kt
$ kotlin HelloKt
Hello, World!
```

随分シンプルになりました。やはりハローワールドはシンプルでないと。
ただ、jarファイルにまとめないとメタファイル等が鬱陶しかったりはします。
Rails チュートリアル第4版　11.2.2 送信メールのプレビューでエラー

http://localhost:3000/rails/mailers/user_mailer/account_activation
を開いてメール文のプレビューを見ようとすると
user.activation_token = user.new_tokenにて以下のエラーが発生

NoMethodError in Rails::MailersController#preview
undefined method `activation_token=' for nil:NilClass


結論としてはdbマイグレーションし忘れのため
activation_tokenがなかった。

```console:console
rails db:migrate:reset
rails db:seed
```
Powershellでcatでテキスト結合する時に文字化けした

Wikipediaでコーパス作る時、catコマンドを使って何百ものの文字ファイルをまとめた。

```
cat jawiki-latest-pages-articles.xml-* > corpus.txt
```

そしたらcorpus.txtが文字化けでmecabできなくなった。
たぶん犯人は文字コードかと思われる。

こういうときは

```
Get-ChildItem ".\" -Recurse -File -Filter "jawiki-latest-pages-articles.xml-*.txt" | Get-Content -Encoding UTF8 | Add-Content -Encoding default "corpus.txt"
```

で解決できる。

メモリ不足でエラー出た。
矢張り大人しくcmdでcopyコマンド使おう。

```
copy /b .\jawiki-latest-pages-articles.xml-*.txt corpus.txt
```

秒で終わります。（一分程度）

結局エンコード問題でEmeditorで文字コードをShiftJISに変換した。
Eclipse 2019-06にGlassfish Toolsをインストールする

GlassfishToolsのインストール方法が変わっていたので、覚書。  

### 詰まった点と原因

【事象】
Eclipse MarketplaceからGlassfish Toolsがどうしてもインストールできない。
どうやら、Install New Software...のところからインストールするらしい情報がたくさんヒットする。
Oracle GlassfishがEclipse Glassfishに（たぶんライセンス変更の影響で）変わったからみたい。
だがしかし、Install New Softwareからもインストールができない・・・なんで・・・

　　　　　　
【原因】
[公式](https://projects.eclipse.org/projects/webtools.glassfish-tools/downloads)にちゃんと書いてあった。。。やはり公式はきちんと目を通すべき。。。
Glassfish Toolsのインストールの前に、Sapphireというものをインストールする必要があるらしい。


## 正しい手順

1. Help > Install New Software...をクリック。
2. Work with: https://download.eclipse.org/sapphire/9.1.1/repository/ を入力してEnter。
3. チェックボックスにチェックを入れてそのままインストールまで行く。Eclipseを再起動しますかといわれるのでOKしてそのまま再起動する。
4. Help > Install New Software...をクリック。
5. Work with: https://download.eclipse.org/glassfish-tools/1.0.1/repository/ を入力してEnter。
6. チェックボックスにチェックを入れてそのままインストールまで行く。Eclipseを再起動しますかといわれるのでOKしてそのまま再起動する。

### 無事入った＼(^_^)／
二重送信防止(html5のrequierdとsubmitボタン2つ対応版)

submitボタンが2つある場合は、ボタン毎にnameを付与して処理を分けることがあります。
しかし、２重送信防止のためにdisabledにすると、name値が送信できません。
また、$(form).submit()を使用するとrequired属性が無視されるので、それにも対応してます。

以下対処方法です。

```html:form.html
<form method="POST" action="hoge">
     <input name="comment[]" required type="text">
     <!-- 承認・否認ボタン --> |
     <input name="denied" type="submit" value="否認"> |
     <input name="approved" type="submit" value="承認"> |
</form>
```


```js:submit_disable.js
// requiredのエラー表示は残しながら、２重送信を防止する
$(document).ready(function () {
  $("form").submit(function () {
    var self = this;
    // クリックしたsubmitボタンの値を取得
    var name = $("input[type=submit][clicked=true]").attr('name');
    var val = $("input[type=submit][clicked=true]").val();

    // clickしたsubmitの値をhiddenに保存(disabledの場合は値が送信されないため)
    var $hidden = $('<input/>', {
      type: 'hidden',
      name: name,
      value: val
    }).appendTo($("form"));

    $(":submit", self).prop("disabled", true);
    //時間が立った場合にdisable解除
    setTimeout(function () {
      $hidden.remove();
      $(":submit", self).prop("disabled", false);
    }, 5000);
  });

  $("form input[type=submit]").click(function () {
    $("input[type=submit]", $(this).parents("form")).removeAttr("clicked");
    $(this).attr("clicked", "true");
  });
});
```
OCI ComputeでWindowsインスタンス作成時にハマりやすいところ


# 1. はじめに
OCI Computeで、はじめてWindowsインスタンスを作成すると戸惑う人が多いはずだ。なぜならば、次の2つの理由があるからだ。

* 作成直後は英語キーボード設定になっているので、初期パスワードに含まれる記号を入力できずにログインできない
* Windowsの日本語リソースが含まれていないので、英語バージョンになっている。この問題は、ほかのパブリック・クラウドも同じ

それぞれの解決方法について説明する。すでにWindows Serverのインスタンスは作成し、リモートデスクトップで接続できているものとする。

# 2. Windowsへのログインを乗り切る

1. リモートデスクトップでWindowsに接続する。するとログイン画面が表示される。
![oci_compute00.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/266049/735525fb-4f36-5049-e185-12d309fafd89.png)

2. デフォルトでは101キーボード（英語キーボード）になっている。画面右下の**[ENG]**をクリックして、**[Japanese]**に変更する。101キーボードを使っている場合には問題ないが、日本語キーボードを使っているときには、ここで変更しておかないとパスワードの入力に失敗する。
![oci_compute01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/266049/b8384048-f8c7-aa9e-6cc9-3891b1f21811.png)
![oci_compute02.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/266049/a2573294-1de4-02c7-eb20-86becbb80478.png)
<font color="red">**ハマりポイント1：キーボードはJapanaseに変更すること**</font>


3. Windowsの初期パスワードは、OCIの管理コンソールで確認できる。**[表示]**をクリックする。
![oci_compute03.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/266049/05bbdcbe-3f22-cbd6-c020-29a3329157b6.png)
<font color="red">**ハマりポイント2：パスワードはリモートデスクトップにコピーできないので表示すること**</font>

4. 表示されたパスワードを入力する。
5. 正しくパスワードを入力できると、以下の画面が表示される。**[OK]**をクリックして、新しいパスワードを入力する。
![oci_compute04.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/266049/e7bd5d3f-1c11-1a4b-6a92-e66868ebbea6.png)

6. **[New password]**と**[Confirm password]**のそれぞれに、新しいパスワードと確認用パスワードを入力する。これでログインできる。
![oci_compute06.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/266049/5f7b264f-8bfb-b5e1-f7fb-68506935a4ab.png)


# 3. Windowsを日本語化する

日本語化については参考になるWebページがたくさんあるので、それらを見てほしい。

OCI Windows Server 2019の構築および日本語化
https://qiita.com/Skogkatter112/items/ee834376bbc7dab5bc56

できるだけ楽に、Windows Server 2016 を日本語化して利用する方法
https://qiita.com/akiyoshi-t/items/76eb446cc8f8ec360e00

Bluemix IaaS (旧SoftLayer) で Windows Server 2016 の日本語化
https://qiita.com/khayama/items/579d1c53defa688d7562

Windows Server 2016 OS日本語化
https://qiita.com/komacchi_u/items/66b908aa32ffdb9ef389

Azure IaaS 上に作成した Windows Server 2016 仮想マシンの UI を日本語化する
https://kogelog.com/2016/10/18/20161018-01/
Pythonの二重配列の思わぬ挙動につまづいたのでメモ


SwiftUIなど登場し、誰でも簡単にアプリが作れるようになってきている昨今。
時代にキャッチアップするのも重要だが、なかなか辛い。
年代を超えて大事なものは基礎だろうということで、LeetCodeでプログラミング練習。

簡単な魔法陣の問題をやってみる。
https://leetcode.com/explore/interview/card/top-interview-questions-hard/116/array-and-strings/828/

番兵法なるものでやってみようと思い、ipythonで下記のように`visited_map`を用意する。すると....

```python
In [1]: mat = [
   ...: [1,2,3],
   ...: [4,5,6]
   ...: ]

In [2]: h = len(mat)
    ...: w = len(mat[0])
    ...:

In [3]:  visited_map = [[False] * (w+2) ] * (h+2)

In [4]: visited_map
Out[4]:
[[False, False, False, False, False],
 [False, False, False, False, False],
 [False, False, False, False, False],
 [False, False, False, False, False]]

In [5]: visited_map[1][1] = True

In [5]: visited_map
Out[5]:
[[False, True, False, False, False],
 [False, True, False, False, False],
 [False, True, False, False, False],
 [False, True, False, False, False]]

```

ﾌｧｯｯｯｯｯ！２列目が全部Trueになっとる。

にわかpython loverの私目はこの挙動がよくわかっていない。（あとで調べる。かも。）


とりあえず普通に初期化したらうまくいった。

```python
In [6]:  visited_map = [[False for _ in range(w+2)] for _ in range(h+2)]

In [7]: visited_map
Out[7]:
[[False, False, False, False, False],
 [False, False, False, False, False],
 [False, False, False, False, False],
 [False, False, False, False, False]]

In [8]: visited_map[1][1] = True

In [9]: visited_map
Out[9]:
[[False, False, False, False, False],
 [False, True, False, False, False],
 [False, False, False, False, False],
 [False, False, False, False, False]]
```


ほんで作ったコードがこれ。これ直したら一発で動いてよかった。。

```python
class Solution:
    def spiralOrder(self, matrix: List[List[int]]) -> List[int]:
        if len(matrix) == 0:
            return []
        
        h = len(matrix)
        w = len(matrix[0])
        
        directions = [
            [0,1],
            [1,0],
            [0,-1],
            [-1,0]
        ]
        
        visited_map = [[False for _ in range(w+2)] for _ in range(h+2)]
        visited_map[0] = [True] * (w+2)
        visited_map[-1] = [True] * (w+2)
        for y in range(0, h+1):
            visited_map[y][0] = True
            visited_map[y][-1] = True
        
        res = []
        pwd = [0,0]
        dircnt = 0
        while True:       
            visited_map[pwd[0]+1][pwd[1]+1] = True
            res.append(matrix[pwd[0]][pwd[1]])
            
            direction = directions[dircnt % 4]
            next_point = [p+d for p, d in zip(pwd, direction)]
            
            if visited_map[next_point[0]+1][next_point[1]+1]:
                dircnt += 1
                direction = directions[dircnt % 4]
                next_point = [p+d for p, d in zip(pwd, direction)]
            
                if visited_map[next_point[0]+1][next_point[1]+1]:
                    break
            
            pwd = next_point  
        return res
```


というか、こんな長々とコード書いたが再帰を使えば一行でできるらしい。ほげっ
https://leetcode.com/explore/interview/card/top-interview-questions-hard/116/array-and-strings/828/discuss/20571/1-liner-in-Python-+-Ruby

勉強になる。
LeetCode、NDAとか守ってないらしくて批判されてるけど、個人的にはありがたいサイトである。プログラミングの筋トレが捗ります。ありがとうございマンモス。
Azure Pipeline で変数を出力する

Azure DevOpsのAzure Pipeline で変数や、環境変数を後続のタスクに渡したいときにどうするか？という問題がある。以前は、強制的にEnvironmentVariablesをセットすると後続のタスクで引き継がれたが、現在は禁止されている。では、現在はどうするか?というと、Ad-hocスクリプトというやり方がある様子。

* [Output Variables](https://github.com/Microsoft/azure-pipelines-agent/blob/master/docs/preview/outputvariable.md)

# 変数の出力

上記のものに従うと、次のような文字列を標準出力に出すと、AzureDevOpsがスキャンして、後続のタスクで使える変数を作ってくれる。

```
##vso[task.setvariable variable=foo;isSecret=false;isOutput=true;]value
```

ここで、`isSecret`と`isOutput`は省略可能なオプショナルなもので、isSecretをtrueにすると、その後の該当変数の出力が***でマスクされて、isOutputをtrueにした場合は、OutputVariablesを指定する必要がある。

# OutputVariables

ここでは、someを設定している。これは後続のタスクに対する変数のネームスペースのようなもので、この指定をすることにより、以降のタスクで、最初に設定した変数に対して、`$(some.foo)`もしくは環境変数の`SOME_FOO`でアクセスできるようになる。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3470/bc385630-c2be-50bd-c847-e3bf97987783.png)

# isOutputの意義

isOutputのオプションはつけなくてもよい。オプションをつけない場合はデフォルトFalseで、後続のタスクは、`$(foo)`もしくは`FOO`環境変数にアクセスできる。じゃあ、なぜisOutputオプションが必要なのだろうか？
想像でしかないが、変数をアウトプットするほうのタスクのユーザもしくは作者が、OutputVariablesを強制したいときに使うのだと思われる。例えば`condition`といった簡単にかぶるような名前をつけてコードを書きたい場合、そのままの変数名を後続のタスクに渡すのが不安な場合、isOutputを指定することで、コードを変えることなく、ネームスペースの使用を強制したいときに使うのだと思う。

# リソース

* [Azure DevOps – Task output to a variable](https://vincentlauzon.com/2018/11/14/azure-devops-task-output-to-a-variable/)
WPF/TextBlockの表示内容を変更したい

メモ

WPFで以下のようなxamlで定義されたTextBlockの表示内容を変更したいとき,
&lt;TextBlock&gt;に x:Name="textBlock" などの名前をつけておく.
その名前でxaml.csにおいて参照できる.

ツールボックスからドラッグドロップで追加しただけでは
&lt;TextBlock&gt; にx:Nameの属性が設定されず,xaml.cs内で参照できなかったのでメモ

```xml:MainWindow.xaml
<Window x:Class="WpfApp4.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp4"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Grid>
        <Button Content="ボタン1" HorizontalAlignment="Center" VerticalAlignment="Center" Width="150" Height="30" Click="Button_Click" Margin="317,96,326.333,294.667"/>
        <TextBlock x:Name="textBlock" HorizontalAlignment="Center" Margin="317,193,164.333,0" TextWrapping="Wrap" Text="TextBlock" VerticalAlignment="Top" Height="105" Width="312" FontSize="22"/>
    </Grid>
</Window>
```


```C#:MainWindow.xaml.cs
using System.Windows;

namespace WpfApp4
{
    /// <summary>
    /// MainWindow.xaml の相互作用ロジック
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }
        private void Button_Click(object sender, RoutedEventArgs e)
        {
            textBlock.Text = "ボタン1が押されました.";//.xamlで宣言した名前で参照
        }
    }
}
```
Hyperledger Fabricのチェーンコード内で関数を呼び出したい人生だった

###チェーンコードで関数呼び出しできない！！！！？？？？

チェーンコードを書いていたある日のこと、
JavaScriptで普段やるように関数の呼び出しを書いていたんですが,,,


あれ？
呼び出せない...
例えば以下のような感じ
InitとInvokeは省略してます。

```javascript:chaincode.js

let Chaincode = class {

   async foo(stub, args){
      this.hoge(stub,args);
   }

   async hoge(stub, args){
      //何らかの処理...
   }


}

shim.start(new Chaincode());

```

あれ、と思って色々試してみたんですが、出来ない

色々検索してみると似たような質問がちらほら

https://www.edureka.co/community/11854/can-i-invoke-a-chaincode-function-from-the-chaincode-itself

https://stackoverflow.com/questions/54017510/hyperledger-fabric-chaincode-function-calling-another-function-from-within-chai

う〜ん、なんか普通には出来ないっぽい。
そんな不便なことある？

そもそも何でこんなことをやろうとしているのかというと、
一度のトランザクションで複数のドキュメントをCouchDBに保存しに行きたい、ということです。

別々にチェーンコードを外から呼び出せばいいじゃんって一瞬思いましたが、それだとエラーが起きた時にロールバックが出来ない。




####試したこと１：stub.invokeChaincodeを使う
先ほどの質問の回答にあった方法を試してみました。
stub.invokeChaincodeの詳細については公式ドキュメントをご覧ください。
[公式ドキュメント](https://fabric-shim.github.io/release-1.4/fabric-shim.ChaincodeInterface.html)


本来stub.invokeChaincodeは
チェーンコードから別のチェーンコードを呼び出したい時に使うみたいですが
同じチェーンコードを指定すればいけるのだろうか。

さっきの質問の回答にも、自分自身を呼び出したいときはmodifyしないといけない、みたいなことが書いてありました。

そこで色々試してみました。
例えば

```javascript:chaincode.js

   async foo(stub, args){
      /*
      newArgs = {
        fcn:"hoge"
        params:[{パラメータ}]
      }
      */
      await stub.invokeChaincode("チェーンコード名", newArgs);
   }

   async hoge(stub, args){
      //何らかの処理...
   }

```

しかしうまくいかず。
関数自体は呼び出せているけれど
no ledger context
みたいなエラーが出てた気がする。

###試したこと２：Chaincodeクラスの外に置いてみる
サンプルのチェーンコードをみてみるとqueryなんかはクラスの外に置いてあるので
ダメ元でやってみましたがダメでした。

呼べるには呼べるのとチェーンコードのInvokeはsuccessfulと帰ってくるのですがステートには記録されていない
奇妙だ・・・

やっぱりステートを変える関数はChaincodeクラス内でしか呼べないんでしょうか。

###結局・・・

結局一つの関数に全ての処理をまとめて書いたら難なくいけました。

いやでも流石になんか手はある気がするんだけどな〜
まだHyperledger Fabricのトランザクションの中でチェーンコードがどういう挙動をするのかとか、
ステートDBとの関係とか、
細かいところが詰め切れてないので、
そこらへんまで理解できればもしかしたら解決策が見つかったり、
本当に出来ないのだとすれば、仕様上仕方ないよね、ってことがわかったりするんだろうか。
それとも僕がやろうとしていることがアンチパターンなのだろうか。


ドキュメント読みます

おしまい
評価をもらうためのポジティブサイクルとその参入ポイント

## 評価は運

- 隣のあいつと同じことをやっているのに、なぜか俺のほうが評価が低い
- どれだけ頑張っても評価されない
- 評価されるだけの仕事を与えてももらえない
- そもそも評価なんて運なんじゃないの？目立つ仕事もらえるかもらえないかの差

仕事場でマネージャーをしていると、評価に関するいろいろなコメントをもらうから
評価に対する自分の考えをまとめます！

## 評価は他人

そもそも、理解しておかねばならないのは、**評価は他人が行うもの**であること。

いくら自分が努力しても、それが**人**に伝わり、その努力の**価値**を認めてもらわなければ
評価されない。
評価を得ることがうまい人は、評価する人へのアピールがうまい。
これは、当たり前のこと。

## 評価は最初から決まっている

また、評価というのは、大抵最初から決まってる。
- 大型プロジェクトのマネージャ
- 新規領域でのプロジェクトリーダ
- 大手企業を顧客に持っている営業
- 大規模イベントに登壇するエンジニア
こういう機会を持っている人に評価をつけたい、と多くの評価者は評価の前から考えているんじゃないか。
そして、その取り組みに失敗したとしても**難しいことに挑戦したのだから**といって、評価がもらえることが
よくある。

これは、**評価する人が、目立つ機会を持っている人ばかり見ているからだ。**

## 評価のサイクル

では、評価を得るための機会はどうすれば手に入るのか。
評価は下記のようなサイクルで回っていると思ってる。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/209000/32e99ff9-e15d-95d1-2a26-3e87c32422de.png)

- **信頼**があるから、大きな仕事=**機会**を手に入れる
- **機会**の中で挑戦し、**成長**する
- **成長**することで**自信**をもつ
- **自信**があるから、その努力や成果を**発信**する
- **発信**するから、評価する人に**認知**される
- **認知**した結果、その人に**評価**を与える
- **評価**をした人を、**信頼**する


評価のサイクルはこうやって回ってる。

## 評価は認知から生まれる

最初に書いた通り、**評価は他人が行うもの**だ。
だから、評価する人に知ってもらう=**認知してもらわなければいけない。**

「なんで、俺は評価されないんだ！」


って言っている人は、大抵その取り組みを認知されていない。
**いくら努力しても、評価する人にそのことを認知してもらわないと評価にはならないんだ。**

評価する相手にまず、認知してもらう。
そのために、何が必要なのか。

それは、**自分の成果や努力を、相手に伝える=発信することだ。**

**「そうは言っても、評価に値するような自信もないから・・・」**
と言う人も多いのではないか。

しかし、発信しなければ相手には伝わらない。
そして、このサイクルの中で、認知・評価・信頼は、相手がすることなんだ。

その入り口、それが**発信**なんだ。

## とにかく発信すること。

こんなことを人に話すと「失敗によるマイナス評価な文化の会社もあるんだよ」なんて言われるけど、
自分はそういう会社にいたことがないので分からない。

でも、自分の成果や取り組みをちゃんと発信して認知してもらうことが評価の第一歩。

では、どう発信すればいいのか。

ここに悩む人が多いけど、自分は
「評価する人の上司が見るようなメールや記事を書いたり、評価する人の上司がいる会議で発言したり、評価する人の上司がいる飲み会で話してみたりする」
というように、評価する人の上司に向けて発信するのをお勧めする。

なぜか。

だって、評価する人からすれば
**「あいつ・・・、何やってんだよ」ってなるでしょ。**
変なことを言えば、自分の評価に傷がつくし、自分が知らないことを上司にいきなり言われたくもない。

ほらね、**認知**されるんだよ。

確かに失敗するかもしれないし、逆効果かもしれない。
**でも、そもそも評価をもらえないことに悩んでいるのであれば、これくらいの挑戦をしたほうがいいんじゃないかな？？**

そして、うまくいって評価のサイクルに乗ることができれば信頼が獲得できるんじゃないかな？？
ReactNativeでレスポンシブデザインを作る唯一の方法

![alt](https://user-images.githubusercontent.com/26253721/39765058-e8d0eae4-531b-11e8-9305-4c852f269517.png)
## flexは使い物にならない。
react-nativeは、標準でflexというレスポンシブシステムを持っている。
しかし、flexによるstyleの記法は、単純なものを作るには良いけど、複雑なものを作り始めると破城する。
flexの代わりになるライブラリを見つけたので紹介します。
このライブラリを使うと、flexを一切使わずにstyleを書けるようになるので、だいぶ楽になります。

## 実はreact native単体で、レスポンシブデザインを実現することはできない
実は、iosの

```
width: 100
```
とandroidの

```
width: 100
```
は、画面に対しての横幅が違うデザインになる。
つまり、

```js
const { width } = Dimensions.get('window');
...
width: width * 0.5
```
というように、Dimensionを使いwidthを指定しても、デザインは崩れてしまう。
解決策として、PixcelRatioを使うと、レスポンシブデザインを作成できるが、記述量が増えてしまう。
しかし、救世主が現れた！！！
## [react-native-responsive-screen](https://github.com/marudy/react-native-responsive-screen#readme)
レスポンシブデザインを作るには、このライブラリがとても役に立つ。
わずか13行で構成されたライブラリなので、カスタマイズも簡単だ！（する必要は感じないけどねw）
二種類の関数のみでレスポンシブデザインを実現する。
wp = デバイスの横幅でレスポンシブデザイン
hp = デバイスの縦幅でレスポンシブデザイン

サンプルコードを見てみよう

```js
import {widthPercentageToDP as wp, heightPercentageToDP as hp} from 'react-native-responsive-screen';

class Login extends Component {
  render() {
    return (
      <View style={styles.container}>
        <View style={styles.textWrapper}>
          <Text style={styles.myText}>Login</Text>
        </View>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: { flex: 1 },
  textWrapper: {
    // height: height * 0.7,
    height: hp('70%'), // デバイスの高さの70%
    // width: width * 0.8
    width: wp('80%')   // デバイスの横幅の80%
  },
  myText: {
    // fontSize: height * 0.05
    fontSize: hp('5%') // デバイスの縦幅の5%
  }
});


export default Login;
```
参考図
![responsive.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/183835/300f32cd-ed32-c779-8db4-6712754769d0.png)

## ライブラリの中身を見てみよう
pixcelRatioを使って、androidとiosの差を吸収している。
まさにコロンブスの卵的ライブラリだ!



```js
import {Dimensions, PixelRatio} from 'react-native';
const widthPercentageToDP = widthPercent => {
  const screenWidth = Dimensions.get('window').width;
  // Convert string input to decimal number
  const elemWidth = parseFloat(widthPercent);
  return PixelRatio.roundToNearestPixel(screenWidth * elemWidth / 100);
};
const heightPercentageToDP = heightPercent => {
  const screenHeight = Dimensions.get('window').height;
  // Convert string input to decimal number
  const elemHeight = parseFloat(heightPercent);
return PixelRatio.roundToNearestPixel(screenHeight * elemHeight / 100);
};
export {
  widthPercentageToDP,
  heightPercentageToDP
};
```

実務で使ってるけど、パフォーマンスも問題なくていい感じ。

## 元記事
https://medium.com/react-native-training/build-responsive-react-native-views-for-any-device-and-support-orientation-change-1c8beba5bc23
GoogleColabratory + GradientBoosting + GPU

GoogleColabratoryのGPUを使ってGradientBoostingライブラリ(LightGBMやXGBoost)の訓練時間を短縮したい！
というわけでGradientBoostingラでGPUを取り扱うためのセットアップ方法をまとめたいと思います。

# TL;DR
- XGBoostはGoogleColabratoryにGPUが使えるようにコンパイル済みのものがインストールされているので特に何かする必要はありません

- LightGBMはXGBoostとは異なり下記作業が必要になります
- **ランタイム > ランタイムタイプの変更 > GPU** へ変更後
以下コマンドをコピペしてGoogleColabratoryのセルへ貼り付け、実行

```
!git clone --recursive https://github.com/Microsoft/LightGBM
%cd /content/LightGBM/
!mkdir build
!cmake -DUSE_GPU=1 #avoid ..
!make -j$(nproc)
!sudo apt-get -y install python-pip
!sudo -H pip install setuptools pandas numpy scipy scikit-learn -U
%cd /content/LightGBM/python-package
!sudo python setup.py install --precompile
```

終わり

# 参考
- [Medium - lgbm-on-colab-with-gpu](https://medium.com/@am.sharma/lgbm-on-colab-with-gpu-c1c09e83f2af)
- [LightGBM - GPU-Tutorial](https://lightgbm.readthedocs.io/en/latest/GPU-Tutorial.html)
objdumpのarchitecture UNKNOWN!への対処

## エラー内容
あるバイナリファイルを逆アセンブリしようとobjdumpを利用したところエラーが発生した。
エラー出力

```
$ objdump -d binary_file

binary_file:     ファイル形式 elf32-little

objdump: アーキテクチャ UNKNOWN! 用に逆アセンブルできません
```

## 解決法
ググったところ、mオプションでアーキテクチャを指定してあげると想定通りの出力結果が得られる。
以下出力結果(一部抜粋)。

```
$ objdump -d binary_file -m i386

binary_file:     ファイル形式 elf32-little


セクション .init の逆アセンブル:

00400094 <.init>:
  400094:	06                   	push   %es
  400095:	00 1c 3c             	add    %bl,(%esp,%edi,1)
  400098:	9c                   	pushf  
  400099:	93                   	xchg   %eax,%ebx
  40009a:	9c                   	pushf  
  40009b:	27                   	daa    
  40009c:	21 e0                	and    %esp,%eax
```

今回はi386を指定したが何を指定すればエラーが解消するかはバイナリファイル次第。
指定可能なアーキテクチャはiオプションで確認できる。
Lravel Routeを追ってみた。

```\routes\web.php
Route::get($uri, $action);
```

これを追ってみます。

##Aliases
まずエイリアスを見てみます。

```config\app.php
'aliases' => [
'Route' => Illuminate\Support\Facades\Route::class,
],
```
となっていますね。
見てみましょう。

```Illuminate\Support\Facades\Route.php
<?php

namespace Illuminate\Support\Facades;

/**
 * @see \Illuminate\Routing\Router
 */
class Route extends Facade
{
    /**
     * Get the registered name of the component.
     *
     * @return string
     */
    protected static function getFacadeAccessor()
    {
        return 'router';
    }
}
```
この記述があるだけで、get()はありません。
ですが、この`'router';`が大事なんですね。

継承元のFacadeを見てみます。

```Illuminate\Support\Facades.php
namespace Illuminate\Support\Facades;

use Closure;
use Mockery;
use RuntimeException;
use Mockery\MockInterface;

abstract class Facade
{

public static function getFacadeRoot()
    {
        return static::resolveFacadeInstance(static::getFacadeAccessor());
    }

protected static function resolveFacadeInstance($name)
    {
        if (is_object($name)) {
            return $name;
        }

        if (isset(static::$resolvedInstance[$name])) {
            return static::$resolvedInstance[$name];
        }

        return static::$resolvedInstance[$name] = static::$app[$name];
    }

public static function __callStatic($method, $args)
    {
        $instance = static::getFacadeRoot();

        if (! $instance) {
            throw new RuntimeException('A facade root has not been set.');
        }

        return $instance->$method(...$args);
    }
}
```
まず`__callStatic`があります。
実装されていない静的メンバが実行された際に走る処理です。
get()と言うメソッドはここにもないので`__callStatic`の処理が走ります。

`getFacadeRoot();`では見ての通りです。
オーバーライドされた`getFacadeAccessor();`には`router`がreturneされていました。
よって`return static::resolveFacadeInstance('router');`となりメソッドが実行されます。

`resolveFacadeInstance('router')`では、オブジェクトかの判断やnullではないかの処理が設定されています。

そして、最後の`static::$app[$name];`この部分。
$appには`Illuminate\Foundation\Application.php`が格納されています。
つまりサービスコンテナで`router`で登録されているインスタンスを取得しreturnしています。
[サービスコンテナ一覧](https://readouble.com/laravel/5.3/ja/facades.html)

もう一度`__callStatic`に戻ります。
ちなみに__callStaticは第一引数の$methodに呼び出そうとしたメソッドが格納されます。

```Illuminate\Support\Facades.php
public static function __callStatic($method, $args)
    {
        $instance = static::getFacadeRoot();

        if (! $instance) {
            throw new RuntimeException('A facade root has not been set.');
        }

        return $instance->$method(...$args);
    }
```
$instanceにはrouterで登録されているインスタンスが格納されました。
つまりこのインスタンスですね`Illuminate\Routing\Router::Class`。

そして、最後のreturnで$methodを実行。
つまりこう言うことでしょう。

```php
Illuminate\Routing\Router->get();
```
なので、`Route::get()`が成り立つのですね。
と言うことはaliasesはサービスコンテナからインスタンスを生成するためだけに設定されているものなのでしょうか。
TypeScript+Vue の環境で動的コンポーネント

# 概要

Vue + TypeScript の環境で `v-bind:is` による動的コンポーネントの扱い方について調べたところ、あまり情報が見つからなかったので、色々試して 2パターンの解決法を見つけたのでメモ。

動的コンポーネントについてはこちら：[コンポーネントの基本 — Vue.js](https://jp.vuejs.org/v2/guide/components.html#%E5%8B%95%E7%9A%84%E3%81%AA%E3%82%B3%E3%83%B3%E3%83%9D%E3%83%BC%E3%83%8D%E3%83%B3%E3%83%88)


# 開発環境 

TypeScript (3.4.3)
Vue (2.6.10) 

(カッコ内は記事を書いている時のバージョン)

## JavaScript での例

```Vue
<template>
  <div>
    <ul class="tabs">
      <li @click="changeChild('hoge')">Hoge</li>
      <li @click="changeChild('fuga')">Fuga</li>
    </ul>
    <component :is="currentChild" />
  </div>
</template>

<script>
import HogeHoge from "HogeHoge.vue";
import FugaFuga from "FugaFuga.vue";

export default {
  data: function(){
    return {
      currentChild: HogeHoge
    };
  },
  components: {
    HogeHoge,
    FugaFuga
  },
  methods: {
    changeChild(name) {
      this.currentChild = name === "hoge" ? HogeHoge : FugaFuga;
    }
  }
};
</script>
```

## TypeScript の場合

### 方法その 1： バインドする変数の型を any にする。

```Vue
<template>
  <div>
    <ul class="tabs">
      <li @click="changeChild('hoge')">Hoge</li>
      <li @click="changeChild('fuga')">Fuga</li>
    </ul>
    <component :is="currentChild" />
  </div>
</template>

<script lang="ts">
  import HogeHoge from "HogeHoge.vue";
  import FugaFuga from "FugaFuga.vue";
  import { Component, Vue } from "vue-property-decorator";

  @Component({
    components: {
      HogeHoge,
      FugaFuga
    }
  })
  export default class OurParent extends Vue {
    currentChild: any = HogeHoge;

    changeChild(name) {
      this.currentChild = name === "hoge" ? HogeHoge : FugaFuga;
    }
  }
</script>
```

こうすると JavaScript と同じように import してきたコンポーネントをそのまま突っ込めますが、any に逃げる形になってしまいます。

### 方法その 2： バインドする変数の型を string にして、コンポーネント名で指定。

```Vue
<template>
  <div>
    <ul class="tabs">
      <li @click="changeChild('hoge-hoge')">Hoge</li>
      <li @click="changeChild('fuga-fuga')">Fuga</li>
    </ul>
    <component :is="currentChild" />
  </div>
</template>

<script lang="ts">
  import HogeHoge from "HogeHoge.vue";
  import FugaFuga from "FugaFuga.vue";
  import { Component, Vue } from "vue-property-decorator";

  @Component({
    components: {
      HogeHoge,
      FugaFuga
    }
  })
  export default class OurParent extends Vue {
    currentChild: string = "hoge-hoge";

    changeChild(name) {
      this.currentChild = name;
    }
  }
</script>
```

個人的にはこちらの方がインスペクター上で判別のしやすく、JavaScript での対応方法としても挙げられているので、良いと思います。

(こっちの方法は、最初 `components` に子コンポーネントを登録し忘れて若干詰まった、という話もあったりなかったりします。)
マテリアルデザインのダイアログではまる...

#参考サイト
◆Angular Material
　https://v5.material.angular.io/
◆【Angular】10分で分かるAngularMaterialのDialogの使い方
　http://issier.com/archives/240
　　※【md-】⇒【mat-】注意！！
◆Angular 4 マテリアルデザインのダイアログ
　https://qiita.com/TsuyoshiUshio@github/items/a5bc75817e39579227ad
◆AngularMaterialを使ったDialog(モーダル画面)の実装
　https://qiita.com/TsuyoshiUshio@github/items/a5bc75817e39579227ad
◆Angular MaterialのDiaglogを使った時のまとめ
　https://qiita.com/someone7140/items/96a1c9eec7ddd89e1b22
◆Angular Material Dialog: A Complete Example
　https://blog.angular-university.io/angular-material-dialog/
◆angular – Material MatDialog内のコンポーネントを動的にロードします
　https://codeday.me/jp/qa/20190402/535077.html

#困りごと
ダイアログは表示されるのに、引数で渡したデータ内容が画面に表示されない…なぜだ!?
参考サイトを見ていると１つ思い当たる節が。。。
　⇒　引数の定義が誤っていただけだった…きちんとChromeのデベロッパーツールでデバッグしておけばよかった。
PostgreSQLのDBの別サーバへの移行・バージョンアップ手順


# PostgresSQLのDBの移行・バージョンアップ手順

サーバAのPostgresSQLのDBを、別のサーバBに移行し、PostgresSQLのバージョンアップを行う手順を記載する。

# PostgreSQL関連パッケージをinstall

|作業ノード|サーバB|
|:--|:--|

```
yum install postgresql-server postgresql-devel postgresql-upgrade
```

# pidファイルのシンボリックリンク

後述のアップデートコマンド実行時に/tmp配下にpidファイルが生成されるので、/var/runにシンボリックリンクを作成

|作業ノード|サーバB|
|:--|:--|

```
ln -s /tmp/.s.PGSQL.50432  /var/run/postgresql/.s.PGSQL.50432
ln -s /tmp/.s.PGSQL.50432.lock  /var/run/postgresql/.s.PGSQL.50432.lock
```

# プロセスを停止

|作業ノード|サーバB|
|:--|:--|

```
systemctl stop postgresql.service 
```

# dbファイルを初期化

|作業ノード|サーバB|
|:--|:--|

```
su postgres
initdb /var/lib/pgsql/data

※ ロケール、エンコードは移行元のDBと同様にする必要があるので、--localオプションでロケールを、-Eオプションでエンコードを指定する
initdb --locale=C -E UTF8 /var/lib/pgsql/data
```

# 旧サーバDBをバックアップ

|作業ノード|サーバA|
|:--|:--|

```
tar cvf /var/tmp/old_pgsql.tar.gz \
/var/lib/pgsql/data \
/usr/lib64/pgsql/ \
/usr/bin/clusterdb \
/usr/bin/createdb \
/usr/bin/createlang \
/usr/bin/createuser \
/usr/bin/dropdb \
/usr/bin/droplang \
/usr/bin/dropuser \
/usr/bin/pg_basebackup \
/usr/bin/pg_config \
/usr/bin/pg_controldata \
/usr/bin/pg_ctl \
/usr/bin/pg_dump \
/usr/bin/pg_dumpall \
/usr/bin/pg_enc \
/usr/bin/pg_md5 \
/usr/bin/pg_receivexlog \
/usr/bin/pg_resetxlog \
/usr/bin/pg_restore \
/usr/bin/pg_upgrade \
/usr/bin/psql \
/usr/bin/postgres \
/usr/bin/reindexdb \
/usr/bin/vacuumdb \

※ 上記でアーカイブしたファイルをサーバBに転送する
```

|作業ノード|サーバB|
|:--|:--|

```
mkdir -p /usr/local/old
tar xf /var/tmp/old_pgsql.tar.gz -C /usr/local/old
```


# アップデートコマンドを実行

|作業ノード|サーバB|
|:--|:--|

```
pg_upgrade -d /usr/local/old/var/lib/pgsql/data \
 -D /var/lib/pgsql/data -b /usr/local/old/usr/bin -B /usr/bin

※

* -d : 旧バージョンのDBディレクトリを指定
* -D : 現バージョンのDBディレクトリを指定
* -b : 旧バージョンのbinディレクトリを指定
* -B : 現バージョンのbinディレクトリを指定

systemctl start postgresql.service 
```

# 参考
* [pg_upgrade日本語訳ドキュメント](https://www.postgresql.jp/document/11/html/pgupgrade.html)
* [PostgreSQL 9.4.19 でクラスタを正常にシャットダウンできずにpg_upgradeに失敗する不具合](https://postgrespro.com/list/thread-id/2404041)
InfluxDBをPythonから使う

# InfluxDBをPythonから使う

InfluxDataがInfluxDB-Pythonというライブラリを用意してくれているのでそれを使えば良いだけ。

### 参考サイト

https://github.com/influxdata/influxdb-python

### InfluxDB-Pythonのインストール

```
pip3 install influxdb --user
pip3 install --upgrade influxdb --user
```

### 依存関係

InfluxDB-PythonディストリビューションはPython 2.7, 3.5, 3.6, 3.7, そしてPyPyとPyPy3上ででサポートされていてテスト済みである。 

注意: Python <3.5 は現在テストされていない。

主な依存関係は:

- Requests: HTTP library for human beings (http://docs.python-requests.org/)  

他の依存関係は:

- pandas: for writing from and reading to DataFrames (http://pandas.pydata.org/)  
- Sphinx: Tool to create and manage the documentation (http://sphinx-doc.org/)  
- Nose: to auto-discover tests (http://nose.readthedocs.org/en/latest/)  
- Mock: to mock tests (https://pypi.python.org/pypi/mock)  


### ドキュメント

ドキュメントは[ココ](https://influxdb-python.readthedocs.io/en/latest/)  

### 例
```
>>> from influxdb import InfluxDBClient
>>> json_body = [
     {
         "measurement": "cpu_load_short",
         "tags": {
             "host": "server01",
             "region": "us-west"
         },
         "time": "2009-11-10T23:00:00Z",
         "fields": {
             "value": 0.64
         }
     }
 ]
>>> 
>>> json_body
[{'measurement': 'cpu_load_short', 'tags': {'host': 'server01', 'region': 'us-west'}, 'time': '2009-11-10T23:00:00Z', 'fields': {'value': 0.64}}]
>>> client = InfluxDBClient('localhost', 8086, 'root', 'root', 'example')
>>> client
<influxdb.client.InfluxDBClient object at 0x7f4fea0c4ef0>
>>> client.create_database('example')
>>> client.write_points(json_body)
True
>>> result = client.query('select value from cpu_load_short;')
>>> print("Result: {0}".format(result))
Result: ResultSet({'('cpu_load_short', None)': [{'time': '2009-11-10T23:00:00Z', 'value': 0.64}]})
```

### テスト

toxをインストールする:

```
$ pip3 install tox --user
```

複数のバージョンのPythonに対してinfluxdb-pythonをテストするためには、Toxを使うことが出来る:

```
$ tox
```
Vue・VueCLIのバージョンが分からん！

# 何なんですかこれは！
![vuenpm.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/296686/6afd5b9a-1eb6-f1f5-2301-b5e8f0407233.jpeg)

Vueのバージョン確認をしようと思い、ググったら色んなコマンドが出てきたので試したら全部バージョンが異なるじゃないですか！何ですかこれは！（npm初心者）

# 答え合わせ
```sh:
npm vue --version
```
👉これはタダのnpm本体のバージョンでした

```sh:
vue --version
```
👉VueCLIのバージョン（コマンドが"vue"だからそりゃそうだ！）

```sh:
npm list vue
```
👉これが純粋なVueのバージョン！
Beamerスライドに参考文献リストを載せる


[Beamerスライド](https://qiita.com/birdwatcher/items/5dd8a5f453bdc0c6940e)でbibtexを使って参考文献リストを出力する方法を述べる. 

#bibtexファイルを作る
`ref.bib`というファイルに参考文献のbibtexリストを作ることを想定する. 
[Google Scholar](https://scholar.google.co.jp/)で論文名や書籍名を検索して, 引用マーク「"」からbibtexを取得する. 

Step1: 
<img width="755" alt="step1.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/294661/71f6d347-d51e-96e3-528e-f70ef3c36363.png">
Step2: 
<img width="493" alt="step2.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/294661/49be8591-7dbc-bbd9-b6ad-ea0adca665ff.png">
Step3:
<img width="260" alt="step3.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/294661/fab801cb-3286-d15c-1553-f6ddc2ff8643.png">
このコードを`ref.bib`に貼り付ける. 

引用したい文献に関して以上のステップ繰り返して, `ref.bib`を完成させる. 
(例)

```latex:ref.bib
@book{boyd2004convex,
  title={Convex optimization},
  author={Boyd, Stephen and Vandenberghe, Lieven},
  year={2004},
  publisher={Cambridge university press}
}
@inproceedings{yoshida2018safe,
 author = {Yoshida, Tomoki and Takeuchi, Ichiro and Karasuyama, Masayuki},
 title = {Safe Triplet Screening for Distance Metric Learning},
 booktitle = {Proceedings of the 24th ACM SIGKDD International Conference on Knowledge Discovery and Data Mining},
 year = {2018},
 pages = {2653--2662},
 numpages = {10},
} 
```

#スライドに載せる
スライドのテンプレートは[こちら](https://qiita.com/birdwatcher/items/5dd8a5f453bdc0c6940e)を参照. 

```latex:slide.tex
\begin{frame}[allowframebreaks]{Reference}
	\scriptsize
	\beamertemplatetextbibitems
	\bibliographystyle{junsrt}
	\bibliography{ref}
\end{frame}
```

これを文献リストを載せたい箇所に書いておくと, 先程の例では, 本文中で`\cite{boyd2004convex}`や`\cite{yoshida2018safe}`で引用できる. 

- `\beamertemplatetextbibitems`: 参考文献リストで引用番号([1], [2]など)を表示するために必要. 書かないと書類マークになってしまう. 
- `\bibliographystyle{}`: 引用のスタイル. この例では本文の登場順に並ぶ. 詳細は[こちら](https://www.okomeda.net/wp/504/)を参照. 
- `\bibliography{}`: `.bib`ファイルの名前を書く
- `allowframebreaks`: スライドからはみ出たら自動でページを作成してくれるオプション

(例)
<img width="960" alt="ref.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/294661/5749c424-2606-8e83-8f3f-d66e1a45205e.png">

#コンパイル

- 日本語文献を含む場合

1. platex slide.tex
2. **pbibtex** slide
3. dvipdfmx slide.dvi

- 英語のみの場合

1. platex slide.tex
2. **bibtex** slide
3. dvipdfmx slide.dvi

もしくは

1. pdflatex slide.tex
2. **bibtex** slide

コンパイルは最低でも3回程度必要になる. (やってみるとわかる)
コンパイル用Makefileは[こちら](https://qiita.com/birdwatcher/items/5dd8a5f453bdc0c6940e)で公開中. 

`pbibtex`を使うか`bibtex`を使うかで, [使えるスタイル](https://www.okomeda.net/wp/504/)が変わってくる. 
基本的にpbibtexのスタイルには先頭に **j** がつく(jplain, junsrtなど)
※使うコマンドがスタイルに対応していないとエラーが出るので注意!!

#natbibを使う場合
texのプリアンブルに`\usepackage{natbib}`を書いておく. 
本文で引用する際は, `\citet{}`や`\citep{}`を使う. 

- `\citet{}`の出力例: `Boyd and Vandenberghe (2004)`
- `\citep{}`の出力例: `(Boyd and Vandenberghe, 2004)`

```latex:slide.tex
\begin{frame}[allowframebreaks]{Reference}
	\scriptsize
	\bibliographystyle{apalike}
	\bibliography{ref}
\end{frame}
```

スタイルはnatbib用のスタイルを利用する必要がある. 
たとえば, [こちら](https://www.overleaf.com/learn/latex/Natbib_bibliography_styles)を参照. 

#まとめ
bibtexを使って効率的な資料作成を目指そう. 
論文では必須事項.
我为中国人创作了翻译。

# 私は中国語への翻訳機を作成しました

日本語の文章を構文解析して日本人が読める**偽**中国語翻訳機を作った記事『[我偽中国語翻訳機作成了](https://qiita.com/shoichiro-k/items/5d28be844f664100387b)』が、たくさんいいねされていてうらやましい。

構文解析しなくても近いものが翻訳APIでちょちょいとできるんじゃね、と思ってやってみた。

[以前](https://qiita.com/kg1/items/2887cc108a8a69e57543)に使ってみたことがあったので、IBM Cloud の Language Translator を使った。

でも、Language Translator の既存の翻訳言語モデルに
日本語から中国語へ直接変換するモデルは現時点ではないみたい。
英語は各言語に直接変換するモデルがあるみたい。

|翻訳言語|モデル|
|:--|:--|
|日本語 ⇔ 英語|あり|
|中国語 ⇔ 英語|あり|
|日本語 ⇔ 中国語|なし|

ということで英語を中継して中国語を作成するプログラムにします。

| 発言      |➡ |  中継 |➡|    最終   |
|:---------------:|:--:|:------------------:|:--:|:-----------------|
| 日本語          | ➡ | 英語 |➡|       中国語       |

以前に同じようなことをやりました。
[Watson APIを利用してPythonで多言語通訳botをSlackに作る](https://qiita.com/kg1/items/2887cc108a8a69e57543)


# IBM Cloud - Language Translator の利用準備


- IBM Cloudのアカウントを作成
- Language Translator のサービスインスタンス作成
- 作成したインスタンスのサービス資格情報から apikey を取得

こちらの url でインスタンス作成
[IBM Cloud - Language Translator](https://cloud.ibm.com/catalog/services/language-translator)

アカウント作成からインスタンス作成まで [こちらの記事](https://qiita.com/kg1/items/88be91c5ecde8600220e) 参考。サービスのバージョンアップで画面イメージが違っていますが、やることは同じです。


- pythonライブラリ ibm-watson のインストール  

```
pip install --upgrade ibm-watson
```


[APIリファレンス](https://cloud.ibm.com/apidocs/language-translator#data-handling)

# IBM Cloud APIを使って翻訳してみる

## 実装

```python:watson_language_translator.py
from ibm_watson import LanguageTranslatorV3

language_translator = LanguageTranslatorV3(
    version='2018-05-01',
    iam_apikey='{apikey}',
    url='https://gateway.watsonplatform.net/language-translator/api'
)

langs = [['ja','日'], ['en','英'], ['zh-cn','中']]
# langs = [開始言語, 中継言語, 出力言語]

for _ in range(10):
    print('■ 日本語を入力してね。１回英語を中継して、中国語に翻訳するよ。')
    text = input('%s> ' % (langs[0][1],))
    for i in range(len(langs)-1):
        translation = language_translator.translate(
            text=text,
            source=langs[i][0],
            target=langs[i+1][0])
        text = translation.result['translations'][0]['translation']
        print('%s：%s' % (langs[i+1][1], text,))
    print()

```

## 結果

```
>python watson_language_translator.py
■ 日本語を入力してね。１回英語を中継して、中国語に翻訳するよ。
日> 私は中国語への翻訳機を作成しました
英：I have created a translator for Chinese.
中：我为中国人创作了翻译。

■ 日本語を入力してね。１回英語を中継して、中国語に翻訳するよ。
日> 私はお酒を飲みたい
英：I want to drink.
中：我想喝

■ 日本語を入力してね。１回英語を中継して、中国語に翻訳するよ。
日> 私は本日定時退社します
英：I'm leaving the company today.
中：我今天要离开公司

■ 日本語を入力してね。１回英語を中継して、中国語に翻訳するよ。
日> 私は理解しました
英：I understood.
中：我明白了

■ 日本語を入力してね。１回英語を中継して、中国語に翻訳するよ。
日> 私は明日、伊豆大島に行きたい
英：I want to go to Izu Oshima tomorrow.
中：我明天要去伊豆大岛

■ 日本語を入力してね。１回英語を中継して、中国語に翻訳するよ。
日> 私は昨日、日本の料理を食べました
英：Yesterday, I ate Japanese food.
中：昨天我吃了日本菜

■ 日本語を入力してね。１回英語を中継して、中国語に翻訳するよ。
日> 今日は10時に仕事が終わります
英：I'm done at 10 o'clock today.
中：我今天十点就完成了

■ 日本語を入力してね。１回英語を中継して、中国語に翻訳するよ。
日> あなたは何時に終わりますか？
英：What time do you end up?
中：你几点结束?
```

# 結論

- 日本人の読める**偽**中国語は、翻訳APIで作れなかった。  
中国語はむずかしいってこと。  
- 英語を経由することで中国語に翻訳した時には意味、情報が落ちるケースがあった。  
ひとつの英単語で広い意味を持ってたりするため。  
例えば drink だけで、酒を飲むという意味がある。