OmniAICreator/Qiita-1.07M huggingface dataset:
いろんなプログラミング言語のバージョンをコード内で確認する方法

プログラミング言語のバージョンをそのコードの中で確認する方法を集めてみた。

## Elixir

```elixir
System.version() # => "1.8.1"
```

## Erlang

```erlang
erlang:system_info(otp_release). % => "21"
erlang:system_info(version).     % => "10.2.3"
```

## Go

```go
import (
    "fmt"
    "runtime"
)

{
    fmt.Printf("Go: %s\n", runtime.Version())
}
```
結果

```
Go: go1.12.1
```

## Groovy

```groovy
GroovySystem.version // => 2.4.3
```

## Java

```java
System.getProperty("java.version"); // => 1.8.0_152-release
```

## JavaScript(Node.js)	

```javascript
process.versions.node // => '11.9.0'
```

## Julia

```julia
julia> VERSION
v"1.5.0"
```

## Kotlin

```kotlin
KotlinVersion.CURRENT // => 1.2.41
```

## Python

```python
import sys
sys.version_info
# => sys.version_info(major=3, minor=6, micro=8, releaselevel='final', serial=0)

import platform
platform.python_version_tuple()
# => ('3', '6', '8')
```

## R

```r
sessionInfo()
# => R version 3.5.1 (2018-07-02)
# 以下略
```

## Ruby

```ruby
RUBY_VERSION # => "2.6.3"
```

## Scala

```scala
scala.util.Properties.versionNumberString // => 2.11.12
```

## Rust

Rustは取れないのだろうか…。
SAP Analysis for Microsoft Excelで在庫一覧をつくってみた。0回目

#はじめに
この記事では、数回にわたってSAP社の製品であるAnalysis for Microsoft Excelを用いて、ERP内の在庫一覧テーブル（MATDOC）を表示するチュートリアルを行います。

※個人の勉強のために書いているため、内容に関しては責任を持ちません。

##SAP社とは
SAP社はドイツに本社を置くヨーロッパ最大のソフトウェア会社です。
SAPのシステムは、
    - 会計システム
    - 物流システム
    - 販売システム
    - 人事システム
から構成されており、それぞれがデータ的に一元化されているため、リアルタイムな分析が可能です。

##Analysis for Officeについて
Analysis for OfficeはExcelのアドインです。
Excelの上SAP S/4HANA上のデータを簡単に抽出しピボットテーブルのように直感的データのディメンションを変更でき、迅速なデータ分析を可能にします。
過去に作成したワークブックを保存しておけば、アクセスする度に最新のデータを取得しExcel上の数値が更新されます。
Analysis for Officeを導入することで、今まで手作業や関数を多用していた報告資料の作成から解放されます。

詳しいAnalysis for Officeのメリットは[ここ](https://www.sapjp.com/blog/archives/14919)をご覧ください。

#連載予定
1回目：[SAP ABAP Development Tools in Eclipseのセットアップ](https://qiita.com/ryusuke8113/items/d3e64f1b9baf0fb514f7) 
2回目：3つのView、CDSについて
3回目：MATDOCを表示してみる。
4回目：在庫数量の単位変換をしてみる。
5回目：association,aggressionについて
6回目：TBD

#さいごに
仕事の合間に少しずつ書いていくので不定期更新になるとは思いますが、少しでも多くの方に読んでいただけると幸いです。
[gnuplot]立体図形の描画

#gnuplotで立体図形の描画
<img width="422" alt="screenshot 1.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/285948/81319aea-c73e-3a65-e3fe-20efb9b2c21b.png">
xyz座標軸に立体を配置したく, ある程度扱えるgnuplotを用いた. 他のソフトウェアの方がもっと見栄え良くできるかもしれないが, 個人的にはgnuplotでのクオリティに満足はしたので, 投稿をすることにした.

#作り方
ターミナル上でgnuplotを起動するには, 一般的に

```
gnuplot
```
と入力をすると思われるが, 今回は等比率で描画したいので,

```
gnuplot -geometry 480x480
```

としてgnuplotを起動する. そして, コードを記述したtxtファイルを用意して

```
load "plot.txt"
```

と読み込んで, 実行してあげれば良い. plot.txtの中身は

```
set ticslevel 0     #z軸方向に詰める
unset key           #反例をなくす
set grid            #罫線を描画
set xlabel "X axis" #軸名の設定
set ylabel "Y axis"
set zlabel "Z axis"
splot "data.txt" using 1:2:3 w l lt rgb "black" lw 2
replot "data2.txt" using 1:2:3 w l lw 2
replot "data3.txt" using 1:2:3 w l lw 2             #冒頭の図の青色部分の直方体の描画
replot "data4.txt" using 1:2:3 w l lw 4
```
とした. dataには描画したい立方体の頂点を入力していけば良い. 例えば, 冒頭の図の青色の立方体の場合は, data3.txtに頂点情報が入っており, その中身は以下である. 図形は閉じて欲しいので, 最初と最後の頂点情報は等しくしてあげることには注意が必要である.

```
 1.0 -0.5 0.5  #ここと
 1.0  0.5 0.5
-1.0  0.5 0.5
-1.0 -0.5 0.5
 1.0 -0.5 0.5  #ここは一致させる

 1.0 -0.5 2.5  #ここと
 1.0  0.5 2.5
-1.0  0.5 2.5
-1.0 -0.5 2.5
 1.0 -0.5 2.5  #ここも同じく一致させる
```
【Unity】シーンはヒエラルキービューに置くと開発効率が上がる

## 【Unity】シーンはヒエラルキービューに置くと開発効率が上がる
どういうことかと言いますと、とにかくこちらの記事を読んでみて下さい。
「[Unityで複数のシーンを同時に編集する](https://gametukurikata.com/basic/editmultiscene)」

Unityで複数のシーンを同時に編集する方法がとても分かりやすくまとまっています。

僕は、この記事を読んで、ヒエラルキービューに関心のあるシーンを並べて、LoadとUnloadして開発していくと効率が良いことに気がつきました。
皆さんもぜひやってみて下さい。
## 終わりに
私は現在、Web3のサービスの開発をしています。詳しくはこちらの記事をご覧下さい。
        [無料でイーサリアムが当たる、Web3時代の寄付サイトを作った話](https://note.com/kenroda/n/n814347fbdcd7)
MFAを「Google Authenticator」 から 「Authy」 に乗り換えました

![download.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/398359/3f345a2d-d254-220b-447d-040835f73e4b.png)

## いきさつ
発端は会社の先輩からの情報で、MFAを複数のデバイスで共有できるようにしているという話を聞いたことでした
私はMFAをAWSの認証などでに利用していますが、これまでは一番有名であろう(実際は何も考えずに一番目にヒットしたものを利用しただけ)「Google Authenticator」を使っていました。しかしながら先輩の話をもとにいろいろ調べなおした結果、**「Authy」に乗り換えることにしました**

## MFAとは
MFA(多要素認証)はユーザー名とパスワードなどの要素のほかにMFAデバイスからの認証コードを別要素として組み合わせて認証することでセキュリティの強化を図る仕組みです。
AWSでも強い権限を持つルートアカウントなどはMFAにて認証することが推奨されています。
https://aws.amazon.com/jp/iam/details/mfa/

またMFAにはいくつかタイプがあるようです。
たとえばAWSでは  **ハードウェアデバイス**、**仮想デバイス**、**SMSテキストメッセージ** などがあるようです。
わたしは費用や機能面を考慮して手軽な仮想デバイスタイプで認証しています。

## 「Authy」vs「Google Authenticator」vs「IIJ Smart Key」
![download.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/398359/64099ae4-aa39-0136-3f23-6658d3a0da02.jpeg)


[AWSのページ](https://aws.amazon.com/jp/iam/details/mfa/)や、ググった結果などから、「Authy」、「Google Authenticator」、「IIJ Smart Key」のどれかがよさそうです。


以下のサイトを参考にこれらを比べてみました。
https://mettyaeeyan.com/2certification/

|  | Authy | Google Authenticator | IIJ Smart Key |
|:-:|:-:|:-:|:-:|
| シェア | 〇 | ◎ | △ |
| 検索性 | 〇 | △ | 〇 |
| **複数端末管理/バックアップ** | 〇 | △ | △ |
| **PC利用** | 〇 | × | × |
| アプリロック | 〇 | × | 〇 |
| 日本語 | × | 〇 | 〇 |

私が重要視したのは以下の点でした。

#### 複数端末管理 / バックアップ ができる
MFAデバイスを紛失したり、故障して使えなくなったりすると、**認証ができなくなります**。  
AWSでは[MFAデバイスの紛失・故障時の対応方法](https://docs.aws.amazon.com/ja_jp/IAM/latest/UserGuide/id_credentials_mfa_lost-or-broken.html)にもある通り、ルートアカウントであればEメールや電話番号での復帰ができるようですが、**IAMユーザの場合、ユーザでは復帰できない**ようです。  
そのため複数端末での認証共有やバックアップが重要になります。  
「IIF Smart Key」や「Google Authenticator」はキー毎のQRコードの読み取りが必要でありキーが多くなると手間です。それに対して**「Authy」ではすべてのキーが紐づいたアカウント自体を複数端末で共有**するため楽です。
  
#### PCで利用できる
仮想MFAデバイスのアプリはモバイルアプリが多いですが、Chromeの拡張機能がある**「Authy」ならばPCでも利用可能**です。
すぐにバッテリーを使い切ってしまうスマホ中毒にはこの機能はありがたい。

## 最後に
複数端末でMFAを管理できるようになり、一安心です。
PCでも使えるようになったし、モバイルアプリの使い心地についても**検索機能がついたりやアイコンがデフォで表示されたりと大満足**です。
ただ**クラウド上にデータが保存される**ことになるので、その点が気になる人は別のアプリが良いかもです。
モノビットエンジンクラウドでリアルタイム通信のオンラインゲームを作る：準備編

#はじめに
今回はモノビットエンジンを使用してオンラインゲームを作ってみたいと思います。
やったことや詰まったことを書いていく備忘録的な感じでまとめます。
何回かに分けて最終的に完成を目指していく予定です。
何から手を付けていいか分からない！って方の参考になればと思います。

#構成
Unity 2018.3.3.f1、
クライアント側は**MonobitUnityEngine2.0**(以下MUN)を、サーバ側は**モノビットエンジンクラウド**を使います。

#今回やること
モノビットエンジンクラウド公式ガイドに沿って、Unity新規プロジェクトにモノビットエンジンを導入する。
付属のUnityちゃんサンプルを動かして通信の確認を行う。

#Unityにモノビットエンジンを導入
![image01.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/401086/9a1e4483-3a87-bfd3-92ba-3d831e553598.png)
**[モノビットエンジンクラウド公式ガイド](https://web.cloud.monobitengine.com/usage?page=registration)**にアクセスして画像のStep3までを完了すればOK
1. モノビット公式アカウント登録
2. MUNクライアントアセットダウンロード
3. ダウンロードしたunitypackageをインポート
4. MonobitServerSettingsのパラメータ設定

#サンプルを動かして通信を確認
![image02.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/401086/7503d673-d7e4-be90-17f3-e7461cefc93f.png)
**[サンプル解説ガイド](http://www.monobitengine.com/doc/mun/contents/Sample/RandomMatchingReconnect.htm)**にアクセス
クライアントを2,3台起動して他クライアントでもUnityちゃんの動きが同期できていることを確認する。

#最後に
モノビットエンジンクラウドは、アカウント登録からUnityに導入するまで時間もかからず簡単に実装できました。
公式のマニュアルも充実しており、解説も画像付きで分かりやすかったです。

今回はここまで。
次回からはサンプルの中身に触れていきたいと思います。

#資料
- [Monobit Engine Cloud Beta 公式サイト](https://web.cloud.monobitengine.com/top?)
- [Monobit Engine Cloud Beta 公式ガイド](https://web.cloud.monobitengine.com/usage?page=registration)
- [Monobit Unity Networking (MUN) official document RandomMatchingReconnect  サンプルページ](http://www.monobitengine.com/doc/mun/contents/Sample/RandomMatchingReconnect.htm)
二進数に馴染みがない新人プログラマの皆様へ

新卒だったりキャリアチェンジだったり、いろいろな経緯でソフトウェアエンジニアとしてこの4月から第一歩を踏み出した皆さん、この業界へようこそ！

4月も中旬を過ぎて、そろそろこの業界の理不尽さにも慣れて来た頃でしょうか？　自分自身が文系大卒でプログラマになるべく新人研修を受けた頃のエピソードを思い出したので記事を書いてみます。

「突然ですが、皆さんは片手でいくつまで数えられますか？」

NCRの新人研修で講師の方が発した第一声です。

「普通は5つまでしか数えられないと思いますが、コンピューターの世界では片手で31まで数えることができます。そして、このビットのオンオフで情報を表現するということがコンピューターの基礎です。」

文系だったり、キャリアチェンジでこの業界に入ってこられた方は二進数に対して馴染みがないかと思います。近年ではビット操作の機会も少なくなりましたので、ますます二進数の影は薄くなっていますが、ひとたび必要となると「0x0D = 1101」というビットパターンを思い出せなくなることもままあります。

そんな時、この技を知っていれば自分の5本指を使ってビットパターンを思い出すことができます^^;

<blockquote class="twitter-tweet" data-lang="ja"><p lang="ja" dir="ltr">NCRの新入社員研修で最初に教わった「片手で31まで数える方法」 <a href="https://twitter.com/hashtag/%E3%82%B3%E3%83%B3%E3%83%94%E3%83%A5%E3%83%BC%E3%82%BF%E3%82%B5%E3%82%A4%E3%82%A8%E3%83%B3%E3%82%B9%E5%9F%BA%E7%A4%8E?src=hash&amp;ref_src=twsrc%5Etfw">#コンピュータサイエンス基礎</a> <a href="https://twitter.com/hashtag/%E3%83%93%E3%83%83%E3%83%88?src=hash&amp;ref_src=twsrc%5Etfw">#ビット</a> <a href="https://twitter.com/hashtag/2%E3%81%AE5%E4%B9%97%E5%BC%95%E3%81%8F1?src=hash&amp;ref_src=twsrc%5Etfw">#2の5乗引く1</a> <a href="https://t.co/pCNnPpfzst">pic.twitter.com/pCNnPpfzst</a></p>&mdash; Shunji Sumida (@narista) <a href="https://twitter.com/narista/status/1118874553596334080?ref_src=twsrc%5Etfw">2019年4月18日</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script> 

皆様のエンジニア生活が明るく実り多きものになるようお祈りしています！
【vba】処理中に他の操作を受け付けないようにする

vba処理中に「保存」をしたり既に開いているBookを閉じると、vba処理がとまっていることがある。
特にエラー表示もないので、「いつの間にか止まってる…」って感じでどうにか回避したい。

ということで、vba処理中に他の操作を受け付けないような方法を調べた。
<br>
<br>
■フォームコントロールの場合

①ユーザーフォーム作成

```vb:ユーザーフォーム
'sleepのAPI使う為に記述
Private Declare PtrSafe Sub Sleep Lib "kernel32" (ByVal ms As LongPtr)

'ユーザーフォームがshowで呼ばれて表示されたときに呼ばれる
Private Sub UserForm_Activate()

    'ユーザーフォームを表示させるお作法
    Me.Repaint

    '時間のかかる処理を記述
    '※sleepで無理やり時間のかかる処理を記述
    Dim count As Integer
    count = 0
    Do While count < 10
        'ユーザーフォームに秒数表示
        Processing.timeLabel.Caption = count & "秒"
        '時間かかるときのお作法
        DoEvents
        '強制１秒待機
        Sleep 1000
        'カウントアップ
        count = count + 1
    Loop
    
    'ユーザーフォームを消す
    Unload Me

End Sub
```
<br>
②①で作成したユーザーフォーム表示用のプロシージャ作成

```vb:ユーザーフォーム表示プロシージャ作成
'標準モジュールに下記プロシージャを記述する。
Public Sub process()

    Processing.Show

End Sub
```
<br>
③上記プロシージャを呼び出すボタンを作成
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397001/0d7ca659-a3fc-0f76-09a1-ed2c2d781387.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397001/8a2274af-6562-7197-34ec-e052a55f48f6.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397001/b19af108-928d-b0cc-17f0-eff207953015.png)

<br>
④③で作成したボタンを押下すると、10秒間ユーザーフォームが表示され、その間他の操作はできない。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397001/df060ed4-0b1e-aa37-c717-79f1507a4830.png)

<br>
<br>

■ActiveXコントロールの場合
①ActiveXコントロールのボタンを作成する。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397001/9269a706-4efd-a335-8400-95830547e2b2.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397001/a21f673a-8775-e3e9-9d95-b43caf4760ea.png)

<br>

②デザインモードにして、①のボタンをダブルクリックする。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397001/934c0cc5-b57f-8a1a-7c25-9d8957fd675a.png)

<br>

③clickイベントでユーザーフォームを表示する処理を記述。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397001/88ec870b-13d4-d460-08db-4f48768aad72.png)

<br>

④デザインモードを解除して、①で作成したボタンをクリックする。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397001/9d7f2c37-dc3f-466a-ce06-debd5bb641b8.png)
ajax(jQuery)でファイルをアップロードする

同じような記事はかなりありますが、よく忘れるのでメモ。

#ajaxでファイルのアップロード
```html
<form>
    <input type="file" name="upfile">
    <button id="upButton" type="button">送信</button>
</form>
```

```javascript
let $upfile = $('input[name="upfile"]');
let fd = new FormData();
fd.append("upfile", $upfile.prop('files')[0]);

$('#upButton').on('click', function () {
    $.ajax({
        url:'index.php',
        type:'post',
        data: fd,
        processData: false,
        contentType: false,
        cache: false,
    }).done(function (data) {
        // 成功時の処理
    }).fail(function() {
       // 失敗時の処理
    });
});
```

```php:index.php
$upfile = $_FILES['file'];
```

#formの中身をまとめて送信
```html
<form>
    <input type="file" name="upfile">
    <input type="text" name="foo" value="bar">
    <input type="hidden" name="hoge" value="fuga">
    <button id="upButton" type="button">送信</button>
</form>
```

```javascript
let $form = $('form');
let fd = new FormData($form.get(0));

$('#upButton').on('click', function () {
    $.ajax({
        url:'index.php',
        type:'post',
        data: fd,
        processData: false,
        contentType: false,
        cache: false,
    }).done(function (data) {
        // 成功時の処理
    }).fail(function() {
       // 失敗時の処理
    });
});
```

```php:index.php
$upfile = $_FILES['upfile'];
$foo = $_POST['foo'];
$bar = $_POST['hoge'];
```

#参考URL
JavaScript(jQuery)からPHPのAPIを利用する
https://qiita.com/mpyw/items/62e6e415f86eb30a5ff4

[JavaScript] Ajaxでファイルをアップロード【jQuery使用】
https://qiita.com/yasumodev/items/cffb735f46ffd489a4db

ajaxでファイルをアップロードする方法（メモ）
https://qiita.com/BRS_matsuoka/items/ba79a2f500a10ddc0923

Ajaxを用いてテキストと画像ファイルを投稿する
https://qiita.com/sho012b/items/f2558db5dad97d7e1b1d
正規表現_抽出考察①

　テキストから任意の文字列を抽出する際における備忘録。

#  背景
　筆者が設計ツールから出力されたテキストから特定の文字列抽出を行おうとした際に、
設計ツールのバージョン間で抽出対象のフォーマットに差異が生じていた。
そのため、フォーマットにある程度差異があっても期待した抽出が行えるような抽出方法を考察する。
# 考察方法
　下記に示す条件で構成される文字列から果物の固有名詞のみを抽出する方法を考察する。

**～条件～**
1.文字列に日本語は登場しない。
2.文字列先頭には必ず**Fruit**が記載される。
3.**果物**の名前は半角英数字及び空白の範囲で自由。
4.**果物**の後には空白と:の挿入が許される。
5.**果物**の後には空白の挿入が許される。


例を3つ、下記に記載する。

**FruitApple**
**Fruit Ban ana**
**Fruit:Mleon　**

上記文字列から抽出する期待値は**Apple**、**Banana**及び**Melon**である。
　次節にて、テストパタン（文字列）を作成し、一通りの抽出方法で期待値を抽出する。

# テストパタン作成
```python:regex.py

# -*- coding: utf-8 -*-

import re

test_str = []
test_str.append(r"FruitApple")
test_str.append(r"Fruit Banana")
test_str.append(r"Fruit  Melon")
test_str.append(r"Fruit: Apple")
test_str.append(r"Fruit:  Banana")
test_str.append(r"Fruit :Melon")
test_str.append(r"Fruit  :Apple")
test_str.append(r"Fruit : Banana")
test_str.append(r"Fruit  :  Melon")
test_str.append(r"FruitApple ")
test_str.append(r"FruitBanana  ")
test_str.append(r"Fruit M e l o n")
test_str.append(r"Fruit: : : : Apple")
test_str.append(r"Fruit : : :   : Ba77        ")  #とりあえず果物に数字を入れたく。

regex = r"^Fruit[: ]*(.+?) *$"

for i in test_str:
    try:
        print(re.search(regex,i, re.M).group(1).replace(' ',''))
    except AttributeError:
        print('Nothing')
```
# 実行

ragex.pyを実行する。

``````python: 
$ python3 ragex.py
Apple
Banana
Melon
Apple
Banana
Melon
Apple
Banana
Melon
Apple
Banana
Melon
Apple
Ba77
``````

# 解説
 正規表現である__regex = r"^Fruit[: ]*(.+?) *$"__の考え方は以下の通り。
・Fruit後の**[: ]**は条件4の文字に対応。これにより、__(.+?)__の文頭に空白及び__:__が混入しない。
・__(.+?)__は条件3に対応。果物名には空白も存在する可能性があるので、__.__とした。
・末尾の __$"__は条件5に対応。__$__を挿入しないと、文末の空白を認識することができず、__(.+?)__の非貪欲マッチの結果、抽出される文字は一文字だけになってしまう。

 上記の正規表現で文字列から果物名を抽出できるが、空白が存在する場合もあるので、__.replace(' ','')__を用いて抽出した果物名に含まれる空白を除外している。
rbenv install 遅くて痺れを切らした話

####はじめに
初学者のアウトプット備忘録記事です。
ご指摘アドバイスあればよろしくおねがいします。



今日のハマりというか、エラーでもないんだけど。。。
詰まったことです。

#rbenv install インストールが遅い!!!!

はい。
今日はAWSの環境構築をするカリキュラムをやってまして。

そんで、

その途中でrubyをインストールするんですが、

ターミナルにて

```
[ec2-user@ip-172-31-25-189 ~]$ rbenv install 2.3.1 　　#コマンド入力した
Downloading ruby-2.3.1. xxxxx~~~~~~
Installing ruby-2.3.1...           #ここから全く動かない!!!5分経っても変わらず!!

```

ターミナルでrbenv install 2.3.1コマンドするもInstalling ruby-2.3.1...から全く変化がないため。

ん？？？

なんや？？？これ？・？？？？

バグった？止まった？

5分くらい待ってもターミナル上で何も変化がなかったので痺れを切らしてしまい、
途中で止めて、また再インストール、

そんで、また、、、、繰り返す。。。。

俺は一体何をしてるんだ？

macが悪いのか？？

いや、どう考えても俺は悪くないだろ!!!と心の中で半ギレになりながらも、


痺れを切らして何回もやり直す、、、

これ無理なんじゃね？？？と思いググったら


**インストールには時間がかかる(長いと10分程).......チーン....**



そういうことだったのかぁ。。。。と分かり普通に10分程待ったら無事インストールできました。

自分と同じように痺れを切らしてやり直した仲間達がインターネットの世界にはいっぱいいたみたいです。


#####参考にした記事
 
rbenvでrubyのダウンロードが遅い時の対処法
https://dev.classmethod.jp/tool/rbenv-too-slow/

他にもググると色々でてきます。


ってことでさいなら。
気をつけよう!!
Django入門におすすめの本・サイト

# はじめに

Djangoを学びたいけれど、どこから始めれば良いのか？という声を聞くので、自分の経験から有用なサイト・書籍などをまとめました。

# 1.無料チュートリアル

[Django Girls Tutorial](https://tutorial.djangogirls.org/ja/)

[Django公式サイトのチュートリアル](https://docs.djangoproject.com/ja/2.2/intro/tutorial01/)もあるのですが、こちらのDjango Girls Tutorialは、よりプログラミング初学者向けの内容となっていておすすめです。

Django2.06をインストールし、作ったアプリをPythonAnywhereというクラウドサービスにデプロイし(配置し)、インターネット上に公開する、という内容となっています。

なお、PythonAnywhereではなく、Herokuにデプロイしたい場合は、以下の記事が参考になるかと思います。

[静的ファイルを扱うDjangoアプリをPyCharmで作ってSECRET_KEYは秘匿しつつGitHub経由でHerokuにデプロイする - Qiita](https://qiita.com/shonansurvivors/items/ff2dc23ed0962c2a6f12)

# 2.サンプルアプリケーション

[Djangoチュートリアル - 汎用業務Webアプリを最速で作る - Qiita](https://qiita.com/okoppe8/items/54eb105c9c94c0960f14)

以下の基本的な機能を持ったWebアプリケーションの作り方を学べます。

- データの登録・参照(検索)・更新・削除
- ユーザーの管理・認証

この記事で特に良い点としては以下になります。

- Djangoの特徴のひとつであるクラスベース汎用ビューを活用した少ないコードで各種の機能を実現しており、そうした手法でのDjangoアプリの作成方法の参考になる

- 全ソースコードが掲載されており、Djangoの各モジュールでのコードの書き方で迷った時にお手本となる
  - https://github.com/okoppe8/Django-Simple-CRUD-Sample

# 3.ブログ

[Narito Blog](https://narito.ninja/blog/)

Djangoに関して様々な情報が掲載されており、参考になります。
(普通にGoogle検索して、このブログに行き着くことも多いかと思います)

# 4.有料動画(Udemy)

[プログラミング初心者でも安心、Python/Django入門講座](https://www.udemy.com/pythondjango-a/)

定価だと高額ですが、頻繁に行われているセール時には1200〜2400円ぐらいの価格になるので、その時に購入するようにしてください。

# 5.有料オンライン学習サイト

[PyQ](https://pyq.jp/)

環境構築不要で、ブラウザで学習が行えます。

Djangoに限らずPythonの基礎や機械学習も取り扱う学習サイトですが、学ぶ順番は自由なので、Djangoの章だけを短期集中的に学ぶ、といったことも可能です。

# 6.書籍

[現場で使えるDjangoの教科書 《基礎編》](https://www.amazon.co.jp/dp/4802094744/)

Djangoについて体系的に解説されており、理解が深まります。

また、Djangoの各種ベストプラクティスについても学ぶことができます。

# 7.勉強会

[モグモグDjango読書会](https://mogumogu-django.connpass.com/
)

前述の「現場で使えるDjangoの教科書」の読書会です。

現時点で次回の開催はまだ予定されていないようですが、数少ないDjangoの勉強会なので、チェックしておくと良いのではと思います。

勉強会の雰囲気を掴みたい方は下記の参加レポートを参考にしてみてください。

[モグモグDjango読書会に参加しました](https://blog.shonansurvivors.com/entry/2019/01/28/004527)

# 8.公式ドキュメント

[Djangoドキュメント](https://docs.djangoproject.com/ja/2.2/contents/)

やはり公式ドキュメントは欠かせません。

プログラミング初心者であったとしても、ここまでDjangoの学習を進めてきた人であれば公式ドキュメントも抵抗無く読めるかと思います。

# 最後に

この記事があなたの参考になることを願います。良きDjangoライフを！
Nuxt.js + TypeScript な環境で Nuxt.js v2.6 にバージョンアップしたらハマった

少し前ですが、[2019/4/5 に Nuxt.js v2.6.0 がリリース](https://github.com/nuxt/nuxt.js/releases/tag/v2.6.0) されました！

Nuxt.js + TypeScript な環境である自分のプロジェクトでも、v2.4.3 から v2.6.0 にバージョンアップしたのですが、その時に型周りでハマったのでメモとして残しておきます。

# 型のエラーが大量に発生...

`yarn add nuxt` で Nuxt.js を最新版にバージョンアップし、`yarn dev` で開発環境を起動したところ、`Type 'Vue' is not assignable` というエラーが大量のコンポーネントで発生しました。

```
error  in /path/to/my-project/src/components/Organisms/HogeComponent/HogeComponent.ts

ERROR in /path/to/my-project/src/components/Organisms/HogeComponent/HogeComponent.ts(4,27):
TS2345: Argument of type '{ components: { FugaComponent: Vue; }; props: { headers: { type: () => any[]; required: true; }; items: { type: () => any[]; required: true; }; buttonText: { type: StringConstructor; default: string; }; buttonTo: { type: StringConstructor; default: string; }; showButton: { ...; }; defaultSort: { ...; }; error: { ...; ...' is not assignable to parameter of type 'ComponentOptions<Vue, DefaultData<Vue>, DefaultMethods<Vue>, DefaultComputed, PropsDefinition<Record<string, any>>, Record<string, any>>'.
  Types of property 'components' are incompatible.
    Type '{ FugaComponent: Vue; }' is not assignable to type '{ [key: string]: VueConstructor<Vue> | FunctionalComponentOptions<any, PropsDefinition<any>> | ComponentOptions<never, any, any, any, any, Record<string, any>> | AsyncComponentPromise<any, any, any, any> | AsyncComponentFactory<...>; }'.
      Property 'FugaComponent' is incompatible with index signature.
        Type 'Vue' is not assignable to type 'VueConstructor<Vue> | FunctionalComponentOptions<any, PropsDefinition<any>> | ComponentOptions<never, any, any, any, any, Record<string, any>> | AsyncComponentPromise<any, any, any, any> | AsyncComponentFactory<...>'.
          Type 'Vue' is not assignable to type 'AsyncComponentFactory<any, any, any, any>'.
```

「`components` に登録しているコンポーネントの型がおかしいよ」って意味のようなのですが、バージョンアップする前は問題ありませんでした。

# 原因を調べる

`HogeComponent.ts` では `FugaComponent` を `components` に登録しています。

```ts
import FugaComponent from 'components/Organisms/FugaComponent';
import Vue from 'vue';

export default Vue.extend({
  components: { FugaComponent },

  ...

});
```

先程のエラーメッセージによると、「`components` に割り当てられるのは `VueConstructor<Vue> | FunctionalComponentOptions<any, PropsDefinition<any>> | ComponentOptions<never, any, any, any, any, Record<string, any>> | AsyncComponentPromise<any, any, any, any> | AsyncComponentFactory<...>` のいずれかの型だよ」ということみたいです。
ですが、`FugaComponent` は `Vue` 型です。上記のいずれの型でもないからエラーになったみたいです。

# vue-shims.d.ts の修正で直った

`FugaComponent` が `Vue` 型なのは、`vue-shims.d.ts` で `*.vue` が拡張子のファイルを `import` したらそれを `Vue` 型とみなすようにしているからです。

https://github.com/nuxt-community/typescript-template/blob/master/template/index.d.ts

これを「`VueConstructor<Vue>` 型にすれば直るのでは？」と考え、以下のように修正しました。

```ts:vue-shims.d.ts
declare module '*.vue' {
  import { VueConstructor } from 'vue';
  const d: VueConstructor;
  export default d;
}
```

すると大量に出ていたエラーは嘘のように消えました！
正直理由はよくわかっていないのですが、ひとまず問題なさそうなのでこの方法でエラーを回避していますmm
Unity：何百万ものオブジェクト 未来都市 Megacity を試してみた。

# はじめに

*こんにちは、のんびりエンジニアのたっつーです。*
*[ブログ](https://www.fast-system.jp/)を運営しているのでよろしければ見てください。*

Unity 2019.1 が正式リリースとなりましたね！
[公式のリリースノート](https://blogs.unity3d.com/jp/2019/04/16/introducing-unity-2019-1/) を確認していて、気になっていた ***Megacityと言う巨大な都市を車で飛び回れる*** ゲームが公開されていたので試してみました。

![megacity4.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/227880/41e322fb-4b5b-912c-f7f2-477ed6130171.gif)

詳しくは[ブログの記事](https://www.fast-system.jp/unity-megacity-demo/)を参照ください。

# 使い方

以下に使い方を書いていきますが、Megacity の情報が少ないため間違っていたら申し訳ございません。
その際にはコメントいただければ記事を修正いたしますので是非教えてください！

## 必要な環境

以下の環境が必要となりますのでご注意ください。

- Unity 2019.1.0 Beta 7（私は、2019.1.0f2 で試しました）
- ディスクの空き容量が必要（４０GBくらい）
- それなりのGPUが必要（私は GTX 1060 を使いました）

あとは、Windows Build Support（IL2CPP）をインストールした方がよいです。

![image-177-768x442.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/227880/66aefd42-1a75-c82e-a43d-a50b112938cb.png)

## ダウンロード

まずは、こちらからダウンロードしてください。
ページ下部にある「Megacity を今すぐダウンロード」をクリックしてください。

- ファイルサイズが７GBほどあるので注意
- ダウンロードが失敗する事があるので、ダウンローダーを使った方がよいかもしれません・・・（私は、懐かしの Irvine を使ってみました）

![image-166.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/227880/e9b880ee-a39d-01b0-16d0-a5ee3c8d1c53.png)

## 実行の仕方

ZIPファイルをダウンロードしたら、適当なフォルダに解凍してください。

Unity 2019.1 でそのフォルダを開くと、そのまま実行できますが、起動がすごく大変です。。。

Unity が立ち上がるまで 50 分ほどかかりました！！

お茶でも飲んでゆっくりしましょう。

![unity-1024x732.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/227880/22f051e8-9928-071b-9131-1f17bf036946.jpeg)

起動時の直後はメモリが３．５GBほどですが、実行すると７GBくらいまで上がるので注意してください。

![image-170.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/227880/dc985c58-b9ec-ea60-5834-ba0087d0420d.png)

## 実行結果

さっそく、Unity の再生ボタンを押して、実行してみましょう。
以下実行した時のGIFを張り付けます、重いのでFPS落としたりリサイズしたりしていますのでご了承ください。

![megacity4.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/227880/41e322fb-4b5b-912c-f7f2-477ed6130171.gif)

プロファイラーで確認すると、だいたい５０FPSくらいかなと思います。

![image-171.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/227880/b6655a78-370f-84e7-8605-a9590bd025b3.png)

## 低画質セッティング

ここの詳細については、[ブログの記事](https://www.fast-system.jp/unity-megacity-demo/)を参照ください。

# 最後に

ゲーム起動直後にマニュアルでの操作もできますのでぜひ試してみてください。

この広大なビルの間を飛び回れる感動はなかなかいいものです。

*よければ ブログ「[初心者向けUnity情報サイト](https://www.fast-system.jp/)」の方にも色々記載しているのでぜひご参照いただければと思います。*
ApplyChanges(InstantRun)が"multiple process"がなんとかで動かないのをなんとかする

# はじめに
ApplyChanges(AndroidStudio3.3以前はInstantRun)は非常に便利な機能です。
使いこなすことでAndroidの開発速度を向上させることが出来ます。
しかし、もともとあまりInstantRunが使われていなかったプロジェクトではいきなり動かしてもきちんと動いてくれないことがあります。

# 現象

ApplyChanges(InstantRun)でアプリをビルドすると

```
Instant Run applied code changes and restarted the app.The app was restarted since it uses multiple processes.
```

というメッセージが表示されて、アプリが再起動される。Activity単位のホットスワップが出来ない。

# 解決方法

ホットスワップが出来ない原因はメッセージに書いている通りです。
ApplyChanges(InstantRun)は複数プロセスが動くアプリに対応していないので、AndroidManifestから`android:process`を定義しているserviceを全て削除することでうまく動くようになります。
この複数プロセスというのは依存しているライブラリも含むので、マージ後のAndroidManifestも確認する必要があります。

# おわりに

今回問題の発生したプロジェクトではこれでうまくホットスワップが使えるようになりました。
最初から英文を読めばすぐに解決していた感じですが、メッセージの表示が「問題がなかった」感の強い緑色のトーストで表示されていたために、アレ？となってしまいました。
また、本文とはあまり関係がないのですが、AndroidStudio3.4がリリースされ、ApplyChangesが使えるようになりました。
不安定だったInstantRunを色々改良したもののようです。
InstantRunが不安定で忌避していた方も、もう一度試してみてはいかがでしょうか？

# 参考

https://stackoverflow.com/questions/35680302/instant-run-doesnt-work-due-to-multiple-process

https://developer.android.com/studio/run/index.html#instant-run
mrubyでの３０日開発日記（６日目）

#今日やったこと
* 数学大百科を確立のところまで読んだ
* hiroのコードリーディング
* glfwのドキュメントを読んだ


#今日の発見

数学をやっているうちに、数学と物語というのは似ていると思った。これは大きな発見だった。小説家志望だった僕として、それが架け橋になるのが嬉しい。ますます数学が好きに鳴った。

ゲームは相変わらず、読んで理解をするフェーズだ。一応時間を見つけてはやっている。とりあえず、glfwを使ってvulkanで３Dを表示するところまでは決まった。まずは、どのように作るのかを考えなくては。そのために、mrubyだけでなく、C単体での実行も必要となってくるな。

フローとして

１．Cで出力してみる
２．それをmrubyに移植する。

このフローで明日からやってみる。

#今日のコラム

明日は予定があるので、qiitaでの投稿はしません。ですが、今日買ったゲームの教本あるのでそれを明日は読みたいと思います。

###Ciao!
コーディングテストに打ち勝つ

ITエンジニアが転職活動をする中で、コーディングテストに出会うことがあると思います。
私もちょうどコーディングテストに出会い色々と対策を行いました。
これからコーディング試験に臨む人の力になればと思い、簡単にまとめておきます。

# コーディングテスト
エンジニアとしての最低限持っていてほしい実装力、アルゴリズムの構築力が問われる試験だと思います。
私の知る限り、下記の３種類があります。
 - オンラインサイトでの試験
 - 電話で画面を共有しながら問題を解いていく試験
 - オンサイトでホワイトボードに問題を解いていく試験（Googleなどで実施されるやつ）

筆者は一番上に３回ほど出会いました。今回は、このオンライン試験形式についてまとめようと思います。

# オンライン試験
### 出題範囲
間違いなくアルゴリズムの問題は出ます。範囲は幅広く、基本的な動的計画法などはおさえておく必要があります。
後は職種や技術領域に応じて、知識問題や特殊な問題が出たりします。
筆者はSQLの問題やDeep Learningの知識問題にも出くわしたことがあります。

### 時間
1時間から2時間程度です。家で受験する場合は、コーヒーを淹れるなど集中できる環境の整備を事前にしておくことをオススメします。

### 選択言語
C,Java,Python,Python3...など基本的には自由に選択できるはずです。
ただ、[参考サイト](https://medium.freecodecamp.org/coding-interviews-for-dummies-5e048933b82b)にも記載してありますが、よほど使い慣れている言語が無い限りは、pythonがおすすめです。圧倒的に楽です。業務でjavaを使ってますが、効率重視であえてpythonを選択しました。
オンラインサイトだと予測変換が効かないため、予測変換をせずとも実装できるようによく使うような構文、表現くらいは暗記しておく必要があります。

### Tips
- 使い慣れたエディタを利用
    - ローカルで使い慣れたエディタを用意しておき、答えがわかったらブラウザ上のエディタにコピペがベターです。
- わからなかったら即ぐぐる
    - せっかくのオンライン試験です。拘らずにわからなかったらぐぐりましょう。もちろん試験後にわからなかった部分の復習は必須です。

# 試験対策
色々なWebページで試験対策方法が書かれていますが、私の取った方法を書いておきます。

## LeetCodeで高評価のeasy問題を解きまくる。
[LeetCode](https://leetcode.com/)は、海外で有名なコーディング試験対策サイトです。
OS、アルゴリズム、SQLなどカテゴリごとに問題があり、それぞれeasy, medium, difficultの難易度に分かれています。
さらに、その問題毎に問題を解いた方の評価（good or bad）が書かれています。
また、問題を解いた後に、自分の回答が実行時間・メモリ使用量が他の回答者と比較してどれくらいか、がわかります。

私はeasyの難易度でgoodの比率が50%以上の問題を良問として、一日一問以上解いていきました。合計50問くらい解いたかな、と思います。また、なかなか時間が取れない方は[ここ](https://medium.freecodecamp.org/coding-interviews-for-dummies-5e048933b82b)でとりあげられている問題だけでも良いかもしれません。
個人的には、easyの問題をbruteforceでなく、しっかりとアルゴリズムを理解しながら解くことをオススメします。bruteforceは、誰でもできてしまうので…。

脱線ですが、問題ごとに解法議論ページがあります。めちゃ賢いプログラマかいるので一瞥をおすすめします。私が50Stepで書いたプログラムが2Stepにまとめて書かれてるのを見て、手が震えました。

## Codilityで苦手な問題の種類を解く。
[Codility](https://app.codility.com/programmers/lessons/1-iterations/
)は楽天などが採用しているらしいコーディング試験サイトです。
こちらはアルゴリズム系のみで、20問くらいは無料で解けます。
LeetCodeは解けたがどうかが重視されますが、Codilityは解けた上でパフォーマンスチェックや外れ値もカバーできているか、テストされます。
そのため、Leetcodeで基本パターンを学習した後に、Codilityでパフォーマンスや外れ値制御を習慣づけるのが大切だと思います。

## 他
Atcoderやproject eulerなど利用してもいいかもしれません。
競プロは、それでそれで面白いと思いますが、今回はテストに打ち勝つのが主目的だったのでこれらのサイトは利用しませんでした。

# さいごに
私は上記のLeetCode, Codilityで試験対策を行い、当日はpython3を利用したところ2勝1負でした。
業務でpython3を書くことはあまりありませんが、上記の対策サイトで使うだけで最低限は使いこなせるようになると思います。

# 参考
https://medium.freecodecamp.org/coding-interviews-for-dummies-5e048933b82b
　※英語もそんなに難しくないので、mediumの原文を読んでもいいと思う。
https://qiita.com/tmsausa/items/1ea54a2af12dbf36065e
http://hirotaka-hachiya.hatenablog.com/entry/2014/09/01/204720
【Ruby on Rails】CSVインポート




csvインポート機能実装手順を記載してみました。
ご参考程度にどうぞ。

# 1.Railsプロジェクト作成

###1-1.Railsプロジェクト作成
```
#terminal
rails new sample
```

###1-2.Controller,View,Model作成
```
#terminal
rails g controller Users
rails g model User name:string age:integer
rails db:migrate
```

###1-3.CSV出力用サンプルデータを作成
```db/seeds.rb
User.create!(
  id: 1,
  name: "seinosuke",
  age: 24
)

User.create!(
  id: 2,
  name: "takanosuke",
  age: 31
)

User.create!(
  id: 3,
  name: "konosuke",
  age: 30
)
```

###1-4.DBにデータ格納
```
#terminal
rails db:seed
```

###1-5.Controllerにアクション追加
```app/contollers/users_contoller.rb
def index
  @users = User.all
end
```

###1-6.View作成
```app/views/users/index.html.erb
<h1>ユーザー一覧</h1>

<table>
  <thead>
    <tr>
      <th>ID</th>
      <th>名前</th>
      <th>年齢</th>
    </tr>
  </thead>

  <tbody>
    <% @users.each do |user| %>
      <tr>
        <td><%= user.id %></td>
        <td><%= user.name %></td>
        <td><%= user.age %></td>
      </tr>
    <% end %>
  </tbody>
</table>

```
###1-7.Route編集
```config/routes.rb
resources :users
```

###1-8.rails s でサーバ起動し、URL：/useresを指定してデータの表示を確認
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/324184/70455f1b-edd9-c52f-9518-12e288447689.png)



#2.CSVアップロード機能実装
###2-1.ruby標準ライブラリであるcsvを追加
```config/application.rb
require 'rails/all'
require 'csv'
```

###2-2.Gemであるroo（Excel, CSV, OpenOffice, GoogleSpreadSheetを開くことが可能）を追加してbundle install
```
#Gemfile
gem 'roo'
```

###2-3.Viewにcsvファイルアップロード用の入力フィールドを追加
```app/views/users/index.html.erb
<%= form_tag import_users_path, multipart: true do %>
  <%= file_field_tag :file %>
  <%= submit_tag "インポート" %>
<% end %>
```


※以下のような入力フィールドが表示される
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/324184/9e295a58-948d-6491-2536-5cd59cd8875e.png)


###2-4.Routeを追加
```config/routes.rb
Rails.application.routes.draw do
  resources :users do
    collection { post :import }
  end
end
```

###2-5.Controllerでファイル受領、リダイレクトするimportを追加
```app/controllers/users_controller.rb
  def index
    @users = User.all
  end
  
  def import
    # fileはtmpに自動で一時保存される
    User.import(params[:file])
    redirect_to users_url
  end
```

###2-6.Modelでcsv読み込み、DBに登録するインポート処理を実装
```app/model/user.rb
class User < ApplicationRecord
  def self.import(file)
    CSV.foreach(file.path, headers: true) do |row|
      # IDが見つかれば、レコードを呼び出し、見つかれなければ、新しく作成
      user = find_by(id: row["id"]) || new
      # CSVからデータを取得し、設定する
      user.attributes = row.to_hash.slice(*updatable_attributes)
      # 保存する
      user.save
    end
  end

  # 更新を許可するカラムを定義
  def self.updatable_attributes
    ["id", "name", "age"]
  end
end
```

###2-7.以下アップロード用ファイルを準備
id,name,age
4,hiroto,60

###2-8.アップロード(csv内データが表示されていることを確認)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/324184/ca9665d4-464c-53df-bce2-e26bf6e6a553.png)

終わり
[Linux] Background service?? daemon??

自分メモです。！

```terminal
sudo vi /etc/systemd/system/jupyter.service
```


```terminal
sudo systemctl daemon-reload
```

```terminal
sudo systemctl enable jupyter

->Created symlink /etc/systemd/system/multi-user.target.wants/jupyter.service → /etc/systemd/system/jupyter.service.
```

```terminal
sudo systemctl start jupyter
```

```terminal
sudo systemctl status jupyter
```

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/137182/ba91bfee-9262-a7d0-7260-e88d5691cfcf.png)

```terminal
udo systemctl restart jupyter
```


sudo kill -9 [PID]
文字列でも計算(演算)できるんだって

前回:https://qiita.com/New_enpitsu_15/items/1813d05e4671ea99f6fc
次回:https://qiita.com/New_enpitsu_15/items/1b0f404b0ade21dbe2cd
目次:https://qiita.com/New_enpitsu_15/private/479c69897780cabd01f4

Pythonでは、文字列にも演算子を使うことができます。

#概要

例えば、"+"で文字列同士を結合。

```
>>> "Apple" + "Pen"
'ApplePen'
```

```
>>> AP = "Apple" + "Pen"
>>> print(AP)
ApplePen
>>> PP = "Pen" + "Pineapple"
>>> print(PP)
PenPineapple
```

と、変数に代入した場合でも同じような処理を行えます。

```
>>> PPAP = AP + PP
>>> print(PPAP)
ApplePenPenPineapple
>>>
```

加えて、"*"で文字に数値をかけることで数値回数繰り返すことができます。

```
>>> "str" * 3
'strstrstr'
>>>
```

#利用例

例えば、`input()`を使ってユーザー名を入力させたものを表示したり

```Python
user_name = input()#HBenpitsu
print("プレイヤーの名前を" + user_name + "で登録しました。")
#プレイヤーの名前をHBenpitsuで登録しました。
input()
```

いろーーーーーんなことができます。今のところ具体的な活用例は示せそうにありませんが、
これを活用すればCUI(黒い画面)でも比較的見栄えのいい画面が実現できます。

#終わりに

今回　"+" と "*" だけ紹介しましたが、文字列の計算、__文字列操作__はさまざまなものがあります。
CUIにプリントするだけではなく、テキストファイルの編集、などなど__いろいろなことに、文字列操作は使われます__。
詳しくは説明しませんが、調べてみるといいかもしれません。

様々な文字列操作がまとめられている記事です。: [Python文字列操作マスター](https://qiita.com/tomotaka_ito/items/594ee1396cf982ba9887)

#####余談
```Python
print("A","B")
#A B
print("A","B",sep="")
#AB
A = (1,2,1,3,7,6,4,5)
print(*A,sep=",")
#1,2,1,3,7,6,4,5
Python 種々の最適化ライブラリ

# はじめに
線形計画の簡単な例を種々の最適化ライブラリを使用して解いてみます。

## 使用するライブラリ
Pulp
Scipy 
Google Ortools

# コード例
[Github](https://github.com/MassSkt/optimization_comparison)

## 問題設定
最大化する目的関数　100x + 100 y

制約条件
x + 2y <=16
3x + y <= 18
x >0
y>0

## Pulp
```python
import pulp
# Problem 1

# Numerical model
m = pulp.LpProblem(sense=pulp.LpMaximize) 

# valiables to optimize
x = pulp.LpVariable('x', lowBound=0) 
y = pulp.LpVariable('y', lowBound=0) 

# Objective function to optimize ( maximize)
m += 100 * x + 100 * y

#  Constraints
m += x + 2 * y <= 16 
m += 3 * x + y <= 18 

# Solve
m.solve()
print(pulp.value(x), pulp.value(y)) # 4, 6
```

## scipy

```python
from scipy.optimize import fmin,minimize

# Problem1


# Objective
def func(X):
    return -(100*X[0]+100*X[1])

# constraint function
def cons1(X):
    return 16-(X[0] + 2*X[1])
def cons2(X):
    return 18-(3*X[0] + X[1])
def cons3(X):
    return np.abs(X)

# set constraits (negative constraint)
cons = (
    {'type': 'ineq', 'fun': cons1},
    {'type': 'ineq', 'fun': cons2},
    {'type': 'ineq', 'fun': cons3},
)
X = [1.0,1.0] #init

#result = minimize(func, x0=X, constraints=cons, method="SLSQP")
result = minimize(func, x0=X, constraints=cons, method="COBYLA")

print(result)
```


## Google Or-tools
```python
from __future__ import print_function
from ortools.linear_solver import pywraplp

solver = pywraplp.Solver('SolveIntegerProblem',
                         pywraplp.Solver.CBC_MIXED_INTEGER_PROGRAMMING)


# Problem1

# set variables
# x and y are integer non-negative variables.
x = solver.IntVar(0.0, solver.infinity(), 'x')
y = solver.IntVar(0.0, solver.infinity(), 'y')


# constraints
constraint1 = solver.Constraint(-solver.infinity(), 16)
constraint1.SetCoefficient(x, 1)
constraint1.SetCoefficient(y, 2)

constraint2 = solver.Constraint(-solver.infinity(), 18)
constraint2.SetCoefficient(x, 3)
constraint2.SetCoefficient(y, 1)

# Objective  .
objective = solver.Objective()
objective.SetCoefficient(x, 100)
objective.SetCoefficient(y, 100)
objective.SetMaximization()

"""Solve the problem and print the solution."""
result_status = solver.Solve()
# The problem has an optimal solution.
assert result_status == pywraplp.Solver.OPTIMAL

# The solution looks legit (when using solvers other than
# GLOP_LINEAR_PROGRAMMING, verifying the solution is highly recommended!).
assert solver.VerifySolution(1e-7, True)

print('Number of variables =', solver.NumVariables())
print('Number of constraints =', solver.NumConstraints())

# The objective value of the solution.
print('Optimal objective value = %d' % solver.Objective().Value())
print()
# The value of each variable in the solution.
variable_list = [x, y]

for variable in variable_list:
  print('%s = %d' % (variable.name(), variable.solution_value()))

```
ReactにおけるComponentを解説！

#概要
今まで、５記事ほどReactについてまとめて参りましたが、今回はもう一歩踏み込んでReactの__Component__についてご説明したいと思います。Reactを使う上では欠かせない__Component__とはどういったものなのか...それでは参りましょう！

前回までの記事

1. [ReactでHelloWorldをしてみよう！](https://qiita.com/micropig3402/items/b90afc78f439f9bec81a)

1. [ReactでHello Worldをする前に...](https://qiita.com/micropig3402/items/27031fb50580ad8497fc)
1. [ReactのJSXについて理解を深めよう！](https://qiita.com/micropig3402/items/9d44536c40522363dd09)
1. [Reactにおけるトランスパイラー【Babel】の役割](https://qiita.com/micropig3402/items/064394428791144f5488)
1. [【webpack】をサクッとまとめる](https://qiita.com/micropig3402/items/7779413b0dfeba51ec5b) 

#Reactにおける__Component__とは
![1_ruk9c2uz62aEdb8Nm5PWHw.jpeg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/343290/d309098f-6605-4faf-c276-f9b4d9414a7b.jpeg)

__Component__を一言で表すと__『再利用可能なUI部品』__となります。
そしてこの__Component__には

__1. Class Component__
__2. Functional Component__

の2つの種類が存在します。

#Class Component
Class定義によって作成するComponentのことを__Class Component__と言います。実際のコードを見てみましょう！

```React:App.js
import React, {Component} from 'react';

class App extends Component {
  render() {
    return (
      <React.Fragment>
        <label htmlFor="pig">pig</label>
        <input
          type="text"
          onChange={() => {
            console.log('I love micropig');
          }}
        />
      </React.Fragment>
    );
  }
}

export default App;
```
<img width="1280" alt="スクリーンショット 2019-04-18 21.21.55.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/343290/cfee9186-d145-0f6e-de15-81b061c40a6a.png">

このApp.jsでは`class App`が`Component`を継承して存在しています。この`App`のことを__Class Component__と呼びます。
#Functional Component
一方で、関数の定義によって作成するComponentのことを__Functional Component__と言います。実際のコードを見てみましょう！

```React:App.js
from 'react';

const App = () => {
  return (
    <div>
      <Pig />
      <Pig />
      <Pig />
    </div>
  );
};

const Pig = () => {
  return <div>oink oink</div>;
};

export default App;
```
<img width="1280" alt="スクリーンショット 2019-04-18 21.32.12.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/343290/8cd63208-ec74-d275-cd64-0f54b14c9e07.png">

このコード中の`App`と`Pig`が__Functional Component__となります！

#リファレンス
- [最近のフロントエンドのコンポーネント設計に立ち向かう](https://qiita.com/seya/items/8814e905693f00cdade2)
- [理解しておきたいコンポーネント指向](https://qiita.com/nabepon/items/723dc53ad584b3457ea7)
- [React.jsで社内システムを作る（Reactコンポーネント編）](https://doda.jp/d-c-b/article/180213.html)
- [React の Class Component と Functional Component の書き方](https://qiita.com/takutoki/items/6a4a607cf00efa032e98)
Developer Roadmap 2019 を見ながらやったことあるものを確認した

https://postd.cc/the-2018-devops-roadmap/
https://github.com/kamranahmedse/developer-roadmap
元ネタはこちら。

何かチェックリストのようなものがあれば便利なんだけど、無いよね？

https://qiita.com/uma8/items/5bcd0cea7d77694ab0a8
これを見て、とりあえず丸付ければいいかと思ってやってみた。


![intro.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43406/75c41efb-2fdd-fecc-a1db-1c5be28053c0.png)

概要は知ってるというレベルから説明できるレベルまで色々混ざっている。
気にせずだいたい分かるという体で。


![frontend.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43406/6efbbf04-b949-e38f-0ff6-c8fed1fa8fa1.png)

npm、yarnやWebpackに丸付けたけど、使ったことはあるというレベル。
なんかこの辺に手を出すにはもう数年寝かせておきたいのでシェルスクリプト書いてる。

SASSとかLessもテーマの初期ファイルで使っていたら使わざるを得ないので使ってる感じ。

大抵の装飾はjQueryでやってる。
大きなプログラムを書く場合は Closure Tools系を使ってる。その場合はjQueryは無し。
10年以上前から淡々と更新されていて使い勝手は変わらない安心設計。バージョンという概念が無いしね。あるタイミングでmasterを取ってくる感じ。
今は絶滅危惧種というか絶滅した？

テストも昔はJsUnitとかSeleniumとかやった。これも10年レベルで前のことなので丸付けていいかどうか。今やるとしてもたぶん素のJsUnitとか使いそう。

PWAは、PWAをやろうと思わなくても高速化を目指すとなるとある程度の項目はかぶっている。
Type Checkers は Closure Compiler。
Desctop Applications は、これも昔ブラウザにオフラインとIndexedDbが搭載されたときにやった。

何か困ったことがあったら新しいことに手を出すかもしれないけれど、今の所困ってないので数年はこのままかもしれない。



![devops.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43406/867847a8-4f56-1ae8-d029-439600bade65.png)

GoとかElixirとかは、一時期コマンドラインツールをbashから脱しようとして少しやったんだけど脱せなかった。
業務ではPHPとJavaだけ。HaskellかScalaは業務に投入しようと思って結構やったんだけどサーバー管理の参考文献なくてやめた。

バックエンドはそんなに頻繁に技術が移り変わらないのでまあまあやってることになってるっぽい。


![devops.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43406/c9cb07f6-6448-daf9-e724-20c62780f6cf.png)

DevOpsは迷いどころ。
上半分は教科書的だよね。

DockerやKubernetesは一通り触ってやっぱりやめてsystemd-nspawnに落ち着いたけど項目がない。LXCはあるのに。

GCPはある程度触っただけで業務はさくらクラウドを使っている。
なのでここに書いてあることをさくらでやるにはかなり茨の道っぽい。


2019って書きつつ、2010とかでもほとんど変わらなかったかもしれない。
マイブームは自作フレームワークからフレームワーク無しでいいやに変わって、クラス書かずに関数ベタ書きしたいとか思い始めてかなり作り方が変わったんだけど。

最近のマイブームは、PostgreSQLのjson_aggをPHPでjson_decodeして一発でデータ構造ごと取得するというやり方。
ORMでマッピングするよりjson_decodeでいいかなって。


たぶん世の中の流れは大量アクセスをさばくとかになってるんだろうけど、仕事では各層サーバー１台でさばけるレベルなんだよねえ…。
世の中っていうか東京とそれ以外とかだったりするんだろうか。
docstringのstyle3種の例

# docstring の style

案件で様々なstyleのdocstringを書いていると、つい混ざってしまうため自分の整理用にまとめます。

## reStructuredText

```python
def func(arg1, arg2, arg3):
  """Hello, func

  Lorem ipsum dolor sit amet, 

  :param string arg1: First argument
  :param arg2: Second argument
  :type args2: list[int]
  :param arg3: Third argument
  :type args3: dict[str, int]
  :return: Return value
  :rtype: str or None
  :raises ValueError: if arg1 is empty string.
  """
```

> - param, parameter, arg, argument, key, keyword: 引数の説明です。
> - type: 引数の型です。可能ならリンクを生成します。
> - raises, raise, except, exception: この中から投げられる例外(いつ投げられるか？)を定義します
> - var, ivar, cvar: 変数の説明をします
> - vartype: 変数の型です。可能ならリンクを生成します。
> - returns, return: 返り値の値について説明をします
> - rtype: 返り値の型です。可能ならリンクを生成します。

[Sphinxドメイン — Sphinx 1.7.10+ ドキュメント](https://www.sphinx-doc.org/ja/1.7/domains.html#info-field-lists)

## Google style

```python
def func(arg1, arg2, arg3):
  """Hello, func

  Lorem ipsum dolor sit amet, 

  Args:
    arg1 (str): First argument
    arg2 (list[int]): Second argument
    arg3 (dict[str, int]): Third argument
  
  Returns:
    str or None: Return value

  Raises:
    ValueError: if arg1 is empty string.
  """
```

> Args:
> 各変数名の一覧を記載します。 名前の後に、コロンとスペースで区切った説明を書きます。 説明が 80 文字で収まらない場合は、2 文字か 4 文字のぶら下げインデントを使います。
> Returns: (ジェネレータの場合は Yields:)
> 型と戻り値のセマンティクスを説明します。 関数が None しか返さない場合は、このセクションは必須ではありません。
> Raises:
> インターフェースに関連するすべての例外の一覧を記載します

[Google Python スタイルガイド — PyGuide - 2.29](http://works.surgo.jp/translation/pyguide.html)

セクション一覧

> - Args (alias of Parameters)
> - Arguments (alias of Parameters)
> - Attributes
> - Example
> - Examples
> - Keyword Args (alias of Keyword Arguments)
> - Keyword Arguments
> - メソッド
> - Note
> - Notes
> - Other Parameters
> - Parameters
> - Return (alias of Returns)
> - Returns
> - Raises
> - References
> - See Also
> - 課題
> - Warning
> - Warnings (alias of Warning)
> - Warns
> - Yield (Yieldsの別名)
> - Yields

[sphinx.ext.napoleon – NumPy および Google スタイルの docstring をドキュメントに取り込む — Sphinx 1.5.6 ドキュメント](http://www.sphinx-doc.org/ja/stable/ext/napoleon.html#id1)

[GoogleスタイルのPython Docstringsの例 — Sphinx 1.5.6 ドキュメント](http://www.sphinx-doc.org/ja/stable/ext/example_google.html#example-google)

## Numpy style

```python
def func(arg1, arg2, arg3):
  """Hello, func

  Lorem ipsum dolor sit amet, 

  Parameters
  -------
  arg1 : str
    First argument
  arg2 : list[int]
    Second argument
  arg3 : dict[str, int]
    Third argument
  
  Returns
  -------
  str or None
    Return value

  Raises
  -------
  ValueError
    if arg1 is empty string.
  """
```

[numpydoc docstring guide](https://numpydoc.readthedocs.io/en/latest/format.html)

[NumPyスタイルPython Docstringsの例 — Sphinx 1.5.6 ドキュメント](http://www.sphinx-doc.org/ja/stable/ext/example_numpy.html#example-numpy)
getDisplayMedia()でブラウザから画面をキャプチャーする方法。

# 目的
getDisplayMedia()でブラウザから画面をキャプチャーする。

# 概要
* `getDisplayMedia()`を使うと、ディスプレイまるごとやChromeのタブ、起動しているアプリ画面をキャプチャーできる。
* 取得したキャプチャーは[MediaStream Recording API](https://developer.mozilla.org/en-US/docs/Web/API/MediaStream_Recording_API)を使用して録画したり、WebRTCセッションとして送信できる。

# ゴール
![Kapture 2019-04-18 at 21.27.11 (1).gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/396925/d33ea333-f014-cb44-e477-8425f49b1787.gif)



# 開発環境
* OS: macOS Mojave 10.14.4
* ブラウザ: Google Chrome 73.0.3683.103
* エディター: Visual Studio Code 1.33.0
* ローカルサーバー: [Live Server](https://github.com/ritwickdey/vscode-live-server)（VSCode拡張機能）

# 対応ブラウザ
![スクリーンショット 2019-04-18 21.38.36.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/396925/af183822-4ef8-370a-4e99-4f9c577a1e45.png)
参照:[Media​Devices​.get​Display​Media()
](https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getDisplayMedia#Browser_compatibility)

# サンプルソース
## javascript
```javascript:js/index.js
"user strict";

const mediaStreamConstraints = {
  video: true
};

const localVideo = document.querySelector("video");

function gotLocalMediaStream(mediaStream) {
  const localStream = mediaStream;
  localVideo.srcObject = mediaStream;
}

function handleLocalMediaStreamError(error) {
  console.log("navigator.getUserMedia error: ", error);
}

navigator.mediaDevices
  .getDisplayMedia(mediaStreamConstraints)
  .then(gotLocalMediaStream)
  .catch(handleLocalMediaStreamError);

```

## html
```html/index.js
<!DOCTYPE html>
<html lang="jp">

<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>WebRTC - getDisplayMedia()</title>
</head>

<body>
  <h1>WebRTC - getDisplayMedia()</h1>
  <video autoplay playsinline></video>
  <script src="index.js"></script>
</body>

</html>
```

# 引用元
[Media​Devices​.get​Display​Media()](https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getDisplayMedia)
Ruby 2.7に導入されてるPattern Matching 使ってみる

雑すぎる備忘録

## 余談

今日から `rubykaigi2019` が始まった。生まれて初めて `experimental` な安定前のバージョンを使う。rubyが永遠に世界で人気であればいいのに。日本万歳

## * 2.5.3
 `in` !!!!!!!!!!!!!!

```
$ rbenv versions
  system
  2.5.0
  2.5.1
* 2.5.3 (set by /Users/ryosukehujisawa/Desktop/sns-lang/.ruby-version)
  2.7.0-dev
```

```
$ ruby /Users/ryosukehujisawa/Desktop/test.rb
/Users/rh/Desktop/test.rb:2: syntax error, unexpected keyword_in, expecting keyword_when
in 0 then true
^~
```

## 2.7.0-dev

```
$ rbenv versions
  system
  2.5.0
  2.5.1
  2.5.3
* 2.7.0-dev (set by /Users/rh/.rbenv/version)
```

```
$ ruby /Users/rh/Desktop/test.rb
/Users/rh/Desktop/test.rb:1: warning: Pattern matching is experimental, and the behavior may change in future versions of Ruby!
```

## 実装

```ruby
case 0
in 0 then true
else false
end
```

## リファレンス

[Ruby 2.7 — Pattern Matching — First Impressions](https://medium.com/@baweaver/ruby-2-7-pattern-matching-first-impressions-cdb93c6246e6)
Grafanaの変数を使って複数パネルを楽に作成する

#TL; DR
Grafanaで同じようなパネル複数作りたいとき、変数を使用すれば作業時間の短縮になるのでその手順を説明します。
下記の記事のときとは手順が少し変わっているので、新しいバージョンを使っている方の参考になれば幸いです。
[Grafanaで同じグラフを大量に作る (Repeating Rows and Panels)](https://qiita.com/craftone/items/35e66293cdd26aa1c261)

#環境
- grafana6.1
- Data Source: elasticsearch

# 手順
##1. 画面右上の「Dashboard Setting」を選択し、Variables⇒Newをクリックする
##2. 変数の設定をする
Name：変数の名前
Type：Queryを選択する
Data Source：Elasticsearchを選択する
Refresh：変数を更新したときのダッシュボードのリフレッシュ方法
⇒ここでは「On Dashboard Load」を選択
Query：クエリを記載（書き方は[こちらを参照](https://grafana.com/docs/features/datasources/elasticsearch/)）
Sort：変数のソート方法（アルファベット順、数字順等）
Multi-value：同時に選択した値を見ることを可能にする
Include All option：値に「All」を含める
![pic](https://drive.google.com/uc?export=view&id=1mS51AilR7SDOXrnfkIOsAZrcPolnZknb)
Multi-value、Include All optionは有効にするのがおすすめです。
値のプレビューで一覧に表示されているか確認しましょう。
設定が終わったら「Update」をクリックします。
## 3. パネルの編集する
パネルのEditから先ほど作成した変数を使ってクエリを書きます。
※変数は頭に"$"をつけるのを忘れずに。
![pic](https://drive.google.com/uc?export=view&id=11jjJlCCIHDP98LV-Sf8oU0X7iyn3LNQL)
続いて、パネルのタイトルも変数を使って指定します。
Repeatingのところで、Repeat：先ほど指定した変数、Direction：複数パネルを表示する方向（水平向きか垂直向きか）を選択します。
今回は、垂直方向を選択したので垂直方向にグラフが増えていくようにしました。
![pic](https://drive.google.com/uc?export=view&id=1OI1CJ-8bt2KiIGwiCCCFgPJOPd1ENKN7)
## 4. パネルを一気に作成する
先ほど作成した変数のドロップダウンが画面右上に表示されているので、クリックして「All」を選択してみましょう。
![pic2](https://drive.google.com/uc?export=view&id=1yvmULVjOx8J3bnaLfI7vmbwmEx8XeMH-)
変数に含まれているホストの数分グラフをあっという間に作成することができました！

#はまったところ
本当に小さなミスなんですが、変数の設定画面にてHideの欄に「Variables」を選択していたためにパネルが自動作成されずに困って数時間無駄にしました。しょうもない。。。

#最後に
変数を使うことで、いちいち一つずつパネルを作成しなくてもいいので作業時間を大幅に削減することができますよ！
今回はホスト名を変数としましたが、ホストの数が増えたとしても**何も設定変更せずにパネルを自動的にダッシュボードに反映することができる**のでかなり便利です。
ぜひ使ってみてください。