OmniAICreator/Qiita-1.07M huggingface dataset:
VSCodeでSSH開発（RemoteDevelopment）

#目的
VSCodeのRemoteDevelopment機能を利用すると、SSHで接続したサーバ内のファイルをSSHクライアント側のVSCodeで編集できるらしい。
ホストOSのWin10は綺麗なままで、ゲストOSにAnacondaなどインストールし開発できるかトライしたく、まずはVSCodeでの接続にチャレンジ。


  - Windows10: ホストOS。SSHクライアント。
  - Ubuntu19.04: Win10のHyper-V上に建てたゲストOS。SSHサーバ。

参考にしたのは下記ページ
https://blog.masahiko.info/entry/2019/06/15/202003

#Windows10でのSSH
Win10 1803より標準機能としてOpenSSHが利用できるようになったとのこと。
Hyper-V上のUbuntuにSSH接続し、VSCodeでリモート開発するためにまずはOpenSSHで環境準備をする。

#SSHサーバの設定
UbuntuにしろWin10(1803以降)にしろ、デフォルトでSSHクライアントとしての機能は有効化されていることが多いが、SSHサーバ機能は自身でインストールが必要である。
今回はUbuntuをSSHサーバとするため、下記コマンドを投入。

```bash:bash
$sudo apt-get install openssh-server
```

#OpenSSHでの鍵生成
Win10 1803以降ではOpenSSHが標準機能として利用できるようになっている。
PowerShellで以下コマンドを投げ、鍵ペアを生成する。

```powershell:PowerShell
PS C:\Users\hoge> ssh-keygen
Generating public/private rsa key pair.
Enter file in which to save the key (C:\Users\hoge/.ssh/id_rsa): [未入力EnterでOK, 多分鍵名を指定する部分]
Created directory 'C:\Users\hoge/.ssh'.
Enter passphrase (empty for no passphrase): [秘密鍵にパスフレーズを設定する]
Enter same passphrase again: [もう一度パスフレーズを投入]
Your identification has been saved in C:\Users\hoge/.ssh/id_rsa.
Your public key has been saved in C:\Users\hoge/.ssh/id_rsa.pub.
The key fingerprint is:
SHA256:[ハッシュ値が表示される] hoge@DESKTOP-XXXX
The key's randomart image is:
```
#SSHサーバへの鍵の転送
PowerShellへのコマンドを投げ、SSHクライアント(Win10)からSSHサーバ(Ubuntu)へ公開鍵`id_rsa.hoge`を送る。

```powershell:PowerShell
PS C:\Users\hoge> scp C:\Users\hoge\.ssh\id_rsa.pub hoge@[SSHサーバのIPアドレス]:~/.ssh/authorized_keys
```

#configファイルの作成
上記の手順で%USERPROFILE%配下にフォルダ`.ssh`が生成されているはず。`C:\Users\hoge\.ssh\config`というファイルを作成する。

```config:config
Host [任意の名前]
    HostName [接続先SSHサーバのIPアドレス]
    User [SSHサーバにログインするためのユーザ]
    IdentityFile C:\Users\hoge\.ssh\id_rsa #秘密鍵のパス
#ポート番号は指定しなくても接続できた。
```

#VSCode-Insidersのインストール
2019.08時点ではSSH開発機能Remote Developmentは、インサイダー版でしか利用できないとのこと。そのためVSCode-Insidersをインストールする。安定版と共存可能なので安心。（インサイダー版はアイコンが緑！）
https://code.visualstudio.com/insiders/


 <font color="DarkGray">※補足
一応、安定版VSCode Ver1.36以降でも対応しているらしいが、接続の際の挙動が不安定のため（何回も秘密鍵のパスフレーズを求められたり）、インサイダー版を紹介。</font>

#Remote Developmentの設定
VSCode-Insidersの`Extensions(Ctrl+Shift+X)`で`Remote Development`と検索し、拡張機能をインストール。
Remote Developmentをインストールすると下記機能がすべて使えるようになる(らしい)。

  - Remote-SSH
  - Remote-Containers
  - Remote-WSL

#VSCode-Insiders, 最大の罠
VSCode-Insidersの`設定(Ctrl+,)`で`Remote SSH`で検索。
以下設定にチェックを入れる。


>Remote.SSH: **Show Login Terminal**
Always reveal the SSH login >terminal


秘密鍵にパスフレーズを設定している場合、このチェックが無いとうまくいかない~~とどこかで読んだ気がするがあまり覚えていない~~。

#Remote-SSH接続
準備は完了したので、VSCodeサイドバーから`Remote-SSH`を選択する。configファイルに書き込んでいるホスト名が表示されているはずなので接続する。
別ウィンドウが立ち上がってくるので、秘密鍵のパスフレーズを入力、さらにUbuntuユーザのログインパスワードを入力することで接続完了。

#まとめ
とりあえずVSCodeでの接続はうまくいった。今後はゲストOS側にAnacondaなどをインストールし、ホストOS側からちゃんと動かせるかを確認していきたい。
これができれば最終的には、持ち出し用の軽いPCから使い慣れたエディタで家のサーバをいじれるのでは！など夢が広がる～。
Gridgedge [Aizu Competitive Programming Camp 2018 Day 2 D]


# Gridgedge [Aizu Competitive Programming Camp 2018 Day 2 D]

ダイクストラ法。全ての地点に関して距離と経路数をそれぞれ記録しておく。距離テーブルをdist、経路数テーブルをpathとする
(x,y)から(nx,ny)に移動する時、
1. dist[y][x]+1 < dist[nx][ny]の時（新記録更新した場合）path[ny][nx]=path[y][x]
2. dist[y][x]+1 = dist[nx][ny]の時、（同じ経路長の場合）path[ny][nx]+=path[y][x]
3. dist[y][x]+1 < dist[nx][ny]の時、(より短い経路長ですでに到達していた場合)探索打ち切り。


https://onlinejudge.u-aizu.ac.jp/beta/room.html#ACPC2018Day2/problems/D


```python

r, c, sx, sy, gx, gy=list(map(int,raw_input.split()))
dist=[[np.inf for i in range(r)] for j in range(c)]
path=[[0 for i in range(r)] for j in range(c)]
que=deque()
que.append((sy,sx))
dist[sy][sx]=0
while que:
    y, x=que.popleft()
    for i,j in ((y,x+1),(y+1,x),(y-1,x),(y,x-1),(c-1,x),(y,r-1),(0,x),(y,0)):
        ny,nx=i,j
        if 0<=ny<c and 0<=nx<r:
            if dist[ny][nx]<dist[y][x]+1:
                continue
            if dist[ny][nx]>dist[y][x]+1:
                dist[ny][nx]=dist[y][x]+1
                path[ny][nx]=1
            else:
                path[ny][nx]+=1
            que.append((ny,nx))
            
            
print(dist[gy][gx],path[gy][gx])
```
CarrierWaveでS3にアップロードした画像が表示されない時の対処

簡単なチャットアプリケーションを開発する学習で
Rails、Heroku、CarriaWave 、S3を使用して画像をアップロードした際に
以下のようになり、画像が正しく表示されませんでした

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/414101/965f25e8-3a25-dd4b-6d45-e9173ff5514b.png)
対処した時のことを忘れないように、記事を投稿したいと思います。

# 原因を探ってみる

まずは、そもそも画像がAmazon S3の管理画面にアップロードできているのかを確認
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/414101/f9cbf2ff-d6fc-4cdc-660a-0213c49a1d34.png)


問題なくアップロードされていました。

ファイルの記述方法は間違っていないかを確認

```carrierwave.rb
require 'carrierwave/storage/abstract'
require 'carrierwave/storage/file'
require 'carrierwave/storage/fog'

CarrierWave.configure do |config|
  config.storage = :fog
  config.fog_provider = 'fog/aws'
  config.fog_credentials = {
    provider: 'AWS',
    aws_access_key_id: Rails.application.secrets.aws_access_key_id,
    aws_secret_access_key: Rails.application.secrets.aws_secret_access_key,
    region: 'ap-northeast-1' 
  }

  config.fog_directory  = 'バケット名'
  config.asset_host = 'https://s3-ap-northeast1.amazonaws.com/バケット名'
end
```

んー、カリキュラムの指示通りかけてるな

どこが悪いのかさっぱり！

# 解決方法
キーワードを変えながら検索をしていると同じような問題を書いてあるページを発見しました。
読んでみると、
>「原因はconfig/initializers/carrierwave.rb内の、urlの指定が間違っていたからでした。以下のように asset_hostのurlの指定を修正すると、無事にストレージから画像を取得できました。」
(https://remonote.jp/rails-production-carrierwave-s3-error より引用)

carrierwave.rbの書き方ミスとのこと
カリキュラムの書き方を信じるのもよくないですな
以下のようにコードを修正しました

```carrierwave.rb
require 'carrierwave/storage/abstract'
require 'carrierwave/storage/file'
require 'carrierwave/storage/fog'

CarrierWave.configure do |config|
  config.storage = :fog
  config.fog_provider = 'fog/aws'
  config.fog_credentials = {
    provider: 'AWS',
    aws_access_key_id: Rails.application.secrets.aws_access_key_id,
    aws_secret_access_key: Rails.application.secrets.aws_secret_access_key,
    region: 'ap-northeast-1' 
  }

  config.fog_directory  = 'バケット名'
  config.asset_host = 'https://s3-ap-northeast1.amazonaws.com/バケット名' #url間違い
  config.asset_host = 'https://バケット名.s3.amazonaws.com' #このように修正
```

すると、画像を投稿した際に表示されるようになりました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/414101/8ce50603-2542-2456-9af1-76e1d84fd143.png)

ふぅ・・なんとかなりました

# 最後に
いかがでしたでしょうか？
初投稿なので読みづらかったり分かりづらい点もあるかと思います。
コードの書き方は変わっていくので常に追っていかないといけないなと改めて思いました
同じエラーで悩んでいる人の助けになれたらいいなと思います

# 参考元
「本番環境でCarrierWaveでS3にアップロードした画像が表示されない問題」の対処
https://remonote.jp/rails-production-carrierwave-s3-error
WordPressのセキュリティ対策を全くしていないサイトが真っ先にすべきこと

# 結論

**2段階認証入れましょう。**

## あなたのサイト管理者ID丸見えです

`${domain}/?author=${id}`をつけると、大体のWordPressで構築されているサイトの管理者ID見えます(正確には`${domain}/author/${user_id}`にリダイレクトされます)。

下記画像の通り。
<img width="834" alt="スクリーンショット 2019-08-04 14.53.22.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/133718/09799838-4456-1632-e375-b71641d90628.png">

最近のWordPressだとRestAPIがデフォルトでONなので、`${domain}/wp-json/wp/v2/users`でもユーザー情報が丸見えです。

<img width="678" alt="スクリーンショット 2019-08-04 14.56.43.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/133718/6d3a4e95-535e-9624-b98a-78453aa05b92.png">

そして無対策サイトは`${domain}/wp-login.php`でBasic認証もなくログイン画面も丸見えなことが多いです。

## そして

管理者IDを指定して`ブルートフォースアタック`
Docker使うとすぐに攻撃できます。

```
$ docker run --rm -it -v /tmp/wpscan/cache:/wpscan/cache --log-driver none infoslack/wpscan --url http://hogehoge.com --wordlist fugapassword.lst--username admin
```

## そもそもここまで管理者ID丸見え対策やっても
[wpscanteam/wpscan](https://github.com/wpscanteam/wpscan)で大体丸裸になっちゃいますが...

## とりあえず

**2段階認証入れましょう。**
DockerでYii2の開発環境を作った時にハマったこと -1-

Yii2でWebアプリを作るにあたって、Dockerでfrontend, backend, mysqlのコンテナを作った。

アプリケーション側からはちゃんとmysqlのデータを取得できたりするのを確認済み。

で、いざ新しいテーブル等を作るためにmigrateしようとしたらエラーになる。

おなじみのこんなエラー。

`Exception 'yii\db\Exception' with message 'SQLSTATE[HY000] [2002] php_network_getaddresses: getaddrinfo failed: nodename nor servname provided, or not known'
`

でも、common/config/main-local.phpに書かれているDBの設定は読み込まれているし、なんでつながらないんだろうと悩むこと一週間。


そうだ、frontendコンテナとmysqlコンテナの間は名前解決できているけれど、consoleからいきなりmysqlコンテナに接続しにいこうとしてもダメなんじゃないか。


ということで、console/config/main-local.phpにcomponents/dbの設定を追加。

接続先のdsnには、mysql:host=127.0.0.1を指定した。

無事にmigrateできた。

ふぅ、なかなかの難敵だな、Dockerは。
AWSアカウントが停止されてしまった時にした対応

ここ最近全くエラーを吐かなかったJenkinsのジョブが突然エラーを吐き出した。

```
fatal error: An error occurred (InvalidAccessKeyId) when calling the ListObjectsV2 operation: The AWS Access Key Id you provided does not exist in our records.
```

アクセスキーがダメになったのか、調べるためにサインインしようとすると、

<img width="990" alt="Screen Shot 2019-08-04 at 15.11.18.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/132627/a87cae2f-8215-94a3-7d5f-faea6165b356.png">

ん？アカウントが停止中？
おかしい。ちゃんとクレジットは登録しているはずなのに。。。

しかも支払履歴を確認しても、

<img width="1394" alt="Screen Shot 2019-08-04 at 15.12.48.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/132627/79c9dfe6-939a-1921-4d2c-c146fdc1b07a.png">

アカウントはBasicで使っているだけなので、もちろん請求履歴もなかった

ここ１年くらい使っていたので、今更問題が発生するのもおかしいと思いながら、
再度クレジットカードを登録し直してみると、AWSからメールが届いた。

```
Greetings from Amazon Web Services,

We received an error while confirming the payment method associated with your Amazon Web Services account.

To use some Amazon Web Services, you must provide a valid payment method. Please update your payment method information at the following page:

https://console.aws.amazon.com/billing/home#/paymentmethods

Some common reasons why an authorization might fail are:

* Amazon is not set up to accept the CVV2 security code associated with credit cards. Your bank may be able to temporarily lift this requirement.

* The authorization is for a low dollar amount ($1.00), which your bank may decline.

* If you signed up for multiple AWS services, a $1.00 authorization may be performed for each service. Your bank may approve the first authorization and decline subsequent ones depending on their security policies.

* Some banks have restrictions on Internet transactions. You may want to check with your credit card company to see if they have such a restriction.

We recommend you contact your bank to determine the exact reason for the decline, or to ask them to take steps on their end to approve the authorization. Once your bank is ready to approve the authorization, please contact us back and we will retry this authorization for you.

https://aws-portal.amazon.com/gp/aws/html-forms-controller/contactus/aws-account-and-billing

You can contact AWS Customer Service via the Support Center: https://aws.amazon.com/support

If you feel you have received this e-mail in error, please include these details in your case.

Thank you for using Amazon Web Services.

Sincerely,

Amazon Web Services
```

まあ要約すると、

お前の登録している支払方法を確認してみたら使えなかったよ。
カード会社にちょっと連絡してみてくれるかな。

とのこと。

試しに登録している楽天カードに問い合わせてみると、
110円くらいの請求が来ていて、それがどうもロックされて上手く支払ができていないとのことだった。

さらによくよくAWSからのメールを確認してみると

```
* Amazon is not set up to accept the CVV2 security code associated with credit cards. Your bank may be able to temporarily lift this requirement.
```

ということでおそらくこれが原因で1$の請求ができなかった模様。

楽天カードにロックされている請求のロックを解除してもらって、
AWSに再度請求を送ってもらうように問い合わせした。

でもなんで支払履歴に何も情報がないんだろう。。。
利用停止中だから支払履歴から支払してね。
みたいなこと言っているけど、これじゃどうしようもないじゃん
Node.jsをバージョン管理しながらインストールするまでの道

# はじめに
Node.jsをUbuntu18.04にインストールするための手順を記していきます。必要なものは以下の４つです。実際、バージョン管理をせずにただNode.jsをインストールするならanyenvやnodenvは必要ありません。ただ、今後扱っていく上で便利なので、このような手順を追っていった方が良さそう。

- Node.js
- anyenv
- nodenv
- yarn

# Node.jsとは
Node.jsとは、サーバサイド側でもjavascriptが動作可能な環境。フロントエンド側で動くための言語であるjavascriptがNode.jsを使えば、サーバサイド側でも動くことができるというものらしい。これにより、別言語でサーバサイド側の処理を書かなくてもいいと言うメリットがある。

# anyenv
**envと呼ばれる言語のバージョン管理ツールをインストールするためのツール。今回はnodenvをインストールするために扱う。今後、他のenv系も簡単にインストールでき、それらを一括で管理できたりして扱いやすい。

### anyenvのインストール
anyenvをホームディレクトリの .anyenvにクローンする。

```bash
$ git clone https://github.com/anyenv/anyenv ~/.anyenv
```
.bashrcに下記の部分を追加する。
anyenvにパスを通して、設定をする。

```bash:.bashrc
export PATH="$HOME/.anyenv/bin:$PATH"
eval "$(anyenv init -)"
```

その後、反映させるためにシェルを再起動。

```bash
$ exec $SHELL -l
```

### anyenvでnodenvをインストール
anyenvを使い、nodenvをインストールします。その後、シェルを再起動。

```
$ anyenv install ---init
$ anyenv install nodenv
$ exec $SHELL -l
```
# nodenvとは
Node.jsのバージョン管理ツール。同様なバージョン管理ツールにnvmやnodebrew等がある。これを利用することで別のプロジェクトごとに違うバージョンのNode.jsを扱うことが可能。

### nodenvでnode.jsをインストール
下記のコマンドでグローバル環境に好きなバージョンを入れることができる。

```bash
$ nodenv install 12.7.0
$ nodenv global 12.7.0
```

以下のように表示が出れば、ok。同時に、npmもインストールされてることがわかる。

```bash
$ node -v
v12.7.0
$ npm -v
6.10.0
```

もし、プロジェクトごとに別のバージョンのnode.jsを入れたいならば、プロジェクトのフォルダの中で下記のコマンドを打てばよい。

```bash
$ nodenv install 11.12.0
$ cd hoge
$ nodenv local 11.12.0
```


# Yarn
npmと同様にnode.jsのモジュールパッケージの追加や削除をするためのツール。パッケージ間の依存関係もどうにかしてくれるらしい。npmよりもパッケージのインストール時間が短い。私はパッケージのインストールにyarnを使っているが、もちろんnpmを使っても問題はない。

### Yarnのインストール

```bash
$ npm install -g yarn
```
これで必要なものは終了。それぞれの扱い方などは下の参考サイトなどを見てください。

# 参考サイト
- [anyenvのgithub](https://github.com/anyenv/anyenv)
- [nodenvのgithub](https://github.com/nodenv/nodenv)
- [初心者向け！3分で理解するNode.jsとは何か?](https://eng-entrance.com/what-is-nodejs#Nodejs-2)
- [anyenvとnodenvでNode.jsのバージョン管理をしよう！](https://www.to-r.net/media/anyenv/)
- [nodenv を使って Mac に Node.js の環境を構築する](https://qiita.com/1000ch/items/41ea7caffe8c42c5211c)
- [yarnチートシート](https://qiita.com/morrr/items/558bf64cd619ebdacd3d)
- [npmのpackage.jsonと依存関係を理解しよう！](https://bagelee.com/programming/npm-package-json-dependencies/)
- [Yarn公式サイト](https://yarnpkg.com/ja/)
csv (txt) ファイルからデータを読み込む

# 目的
Python3を使って測定装置がはき出すX（波長、電圧、時間など）ｰY（吸光度、電流など）がリストになったcsv(txt)ファイルからデータを読み出す。

# 話の前提
- Python3/pandasが使える
- pd.DataFrameが各行各列に名前をつけられるマトリクス形式のデータ構造であることを知っている。
- Jupyter notebookを使っている（必須ではない）
- 測定ファイルはdata.csv

```data.csv
日時：2019/1/1
開始波長（nm）：300
終了波長（nm）：800

>>>>>>>
波長, 吸光度
300, 0.00000
310, 0.00010
320, 0.00100
>>>>>>>
```
多くの測定データファイルは上記のようにヘッダー部分（日時や装置名などのメタデータが書かれた部分）と測定結果をリストにしているメイン部分に分かれている。今は、メインのデータをPython3で取り込み、その後の加工に使いたい。

# 方法
入力

```Python
import pandas as pd

f = 'data.csv'
df = pd.read_csv(f, sep=',', skiprows=6, skip_footer=1, header=None)
df.columns = ['WL', 'ABS']
print(df)
```

出力

```
    WL     ABS
0  300  0.0000
1  310  0.0001
2  320  0.0010
```

# 解説
pandasのもつ`read_csv`という関数を使う。この関数には多くのの引数があり、柔軟にCSVファイルを読み込むことができる（https://pandas.pydata.org/pandas-docs/stable/reference/api/pandas.read_csv.html）。

今回明示的に指定した引数は以下の通り。

- ファイル名`f`：読み出すファイルの名前。一番最初の引数とする。

- `sep`：separatorの略で、データ間を切り分けるための目印となる文字種を指定できる。CSVはその名の通り、Comma Separated Valuesの略なので、今回のケースではカンマを指定する。実は、この引数はそもそも`sep=','`、とカンマが指定されており、このケースでは明示的にこの値を指定する必要はない。ただし、多くの測定器の出力ファイルがtsv (tab separated values）の形式であるので、その場合は`sep='¥t'`と指定する。

- `skiprows`：頭から何行目までを飛ばして読み込みを開始するかを指定する。今回は`波長, 吸光度`まで不要だったので6とした。

- `skip_footer`：ファイル末尾に不要な行があるときに指定する。今回は最後の`>>>>>>>`の１行分が不要なので１とした。

- `header`：各列名を指定する行番号を`skiprows`で飛ばした後の0行目から指定する。今回はファイル中に`波長, 吸光度`という行があるが、後ほど自分で指定したかったので、`header=None`と指定して、どの行も列名として読み込まないようにした。

最後に`df.columns = ['WL', 'ABS']`でDataFrameの列名をアップデートする。
KotlinでAtCoder135の問題Cを解いてみた

# はじめに

毎週木曜日に知人とモブプロをやってるのですが、
そこで始めてAtCoderの過去問を解く経験をしました。
そのときはAtCoder135の問題をJavaScriptで解いたのですが、
問題Cだけ最後まで解けなかったので、自宅でKotlinで解いてみました。

対象の[問題はこちら](https://atcoder.jp/contests/abc135/tasks/abc135_c)


ちなみにKotlinは勉強中くらいのレベルで、
業務で使ったことはおろか、なにかアプリを開発したこともありません。


なお、本記事では回答として提出した内容が表示されるので、
もしネタバレを気にする方はお気をつけください。


# KotlinでAtcoder135の「C - City Savers」

2019年8月4日現在では、Version1.0までしか対応していません。
今回は特に困りませんでしたが、コルーチンなどは使えないのでそこは要注意かと思います。

実際に提出した回答は以下の通りです。

```Main.kt
fun main(args: Array<String>) {
    val n:String? = readLine()
    val monstersInput:String? = readLine()
    val saversInput:String? = readLine()
 
    if (n == null || monstersInput == null || saversInput == null) return
 
    val monsters:List<String> = monstersInput.trim().split(" ")
    val savers:List<String> = saversInput.trim().split(" ")
 
    var count:Long = 0
    var nextAttack:Long = 0
    for (i in savers.indices) {
        var monster = monsters[i].toLong()
        val saver = savers[i].toLong()
        if (nextAttack > 0) {
            if (monster < nextAttack) {
                count += monster
                monster = 0
            } else {
                count += nextAttack
                monster -= nextAttack
            }
        }
 
        if (monster < saver) {
            count += monster
            nextAttack = saver - monster
        } else {
            count += saver
            nextAttack = 0
        }
    }
 
    if (nextAttack > 0) {
        val lastMonster = monsters.last().toLong()
        count += if (lastMonster < nextAttack) lastMonster else nextAttack
    }
 
    println(count)
 
}
```


## ハマったポイント

### 未使用変数

提出当初、変数nは使用しておらず、
未使用変数の警告が発生していました。

これが原因でAtCoder側でエラーになっており、
とりあえずnullチェックいれて回避しました。


### パッケージは不要だった

最初 `package citysavers` を付けていたのですが、
これが原因で提出後にエラーになっていました。

提出した際のエラーメッセージがわからないため、原因が分からず非常に悩みました。
他の人の回答を見て気づけたので、他の回答を参考にできるのはありがたい仕組みです。


# 感想
他の人の問題はちらっと見た感じですが、
知らないメソッドや構文を使われている方が居たので、参考にしたいと思います。
具体的には for文での`until`、入力データの取得に用いている`repeat` あたりは知らなかったので、
復習しておきたいと思います。

AtCorder自体、実行速度やメモリを競うプログラミングコンテストだと思っていたため、
自分にはまったく関係ないと思っていました。
ですが、単純に回答完了までの早さを競うのであれば、
業務に置き換えても早く実装が完了するに越したことはないので、良い鍛錬になるなぁと思いました。

また、同じ問題について他人の解答を見れるのが、
一人で勉強しているエンジニアには非常にありがたいことです。
特に自分にとって新しい言語を勉強しているが、
まわりに聞ける人が居ない環境にいる人には大変よい仕組みだなぁと思います。


# おわりに

始めてAtCorderをやってみて、
Kotlinでやる際の注意点、やってみた感想をアウトプットしてみました。

慣れてないので難しいのと、これまでがそんなにコーディングに関して勉強していない(求められない)環境だったので、
難易度は高めに感じました。

個人的に新しい言語を学ぶ際に非常に有意義に感じたので、
Kotlinで過去問を一通り解いてみようと思います。
Reactを使ってJSXの内容をレンダリングする（create-react-app）（React基礎講座1）

# はじめに

webページにレンダリングをする必要最小限の `React App` を実装するのに必要なことを書いていきます。

# 開発環境

- codesandbox（POPULAR TEMPLATESはReactでCreateする）

不要なファイルは削除しています。

## `import` について

`import`自体は、ES2015（ES6）から導入されたメソッドで、これを使うと、JSのパッケージ（モジュール）の中身（関数や変数やクラスなど）を使えるようになります。

なので、読み込めばこのファイル`index.js`で定義されていない関数や変数やクラスなどの、JSのモジュールを`index.js`で使えるようになります。

```js:index.js
import React from "react";
```

これは、`react`というパッケージ（モジュール）から、`React`を`import`していると言うことになります。上記を追加することで、`React`を読み込んで`render`メソッドなどを使えるようにしています。

## `render()` について

```js:index.js
import { render } from "react-dom";
```

これは、`react-dom`というパッケージ（モジュール）から、`render`というページにレンダリングするメソッドを`import`していると言うことになります。

`render()` は2つの引数を必要とします。

```js
render(JSX, target)
```

- JSX: JSの拡張言語で、HTMLのようなもの
- target: 作成したReactアプリを、どこの`DOM Elements`に紐づけるかの指定

と言うことで、結果、以下のようになります。

```react
render(<h1>Hello, React</h1>, document.getElementById('root'))
```

このよう書くと、React（のrennder）が、`index.html`にあるタグの中の`<div id="root"></div>`の中に、JSXで記入した内容をレンダリングします。

# コード

```react:index.js
import React from "react";
import { render } from "react-dom";

render(<h1>Hello, React</h1>, document.getElementById("root"));
```

## 結果

<img width="1630" alt="スクリーンショット 2019-08-04 00.06.07.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/14191/847b97eb-7745-34fc-23dd-568e710cf4e4.png">

## JSX は HTML ではない

JSXですが、とてもHTMLに近いシンタックスですが、JSのファイルのなので、本来HTMLはかけないし、実際、HTMLではありません。
では、なぜwebページにHTMLぽく表示されるのかというと、`babel`などの開発環境が`JSX`を`React Element`（JSのオブジェクト）にトランスパイルしてくれているからです。JSのオブジェクトなので、変数代入や、console.logでの表示など、JSの操作が可能になります。

JSのオブジェクトになった段階で、`render()`メソッドでレンダリングを可能にしています。

例えば、JSXを変数（`jsx`）に代入して、console.logさせることも可能です。

<img width="1323" alt="delicate-butterfly-nvry9_-_CodeSandbox.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/14191/52b6050d-ffdf-68ad-9b53-8d21af264f25.png">

### jsにおけるオブジェクトとは

詳細には記述しませんが、オブジェクトとは、名前をキーにした配列です。Rubyでいうハッシュです。連想配列と言ったりもするJSのデータ型の1つです。

# 参考

- 改訂新版JavaScript本格入門 ~モダンスタイルによる基礎から現場での応用まで | 山田 祥寛
Windowsでsolcを使ってsolidityをコンパイルする方法

Ethereumの学習をしています。
solidityを使用してコントラクトのコードを組んでいる時にWindows環境でコンパイルする方法を覚え書きとして方法を残しておきます。


**solc実行ファイルのダウンロード**
以下のリンク先からコンパイラであるsolcをダウンロードします。
solidityのライブラリなどを使用する場合、ライブラリで使用されているバージョンに合ったコンパイラをダウンロードする必要があります。
https://github.com/ethereum/solidity/releases

私の場合、使用していたライブラリが「0.4.24」となっていたので「0.4.24」をダウンロード
https://github.com/ethereum/solidity/releases/tag/v0.4.24


ダウンロードするファイルは「solidity-windows.zip」を選択する。
解凍すると以下のとおり、「solc.exe」が入っているので、任意のフォルダに配置してpathを通すと完了です。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/476876/7d2e6745-5bdc-9b7b-8585-2e7af103e441.png)
[WIP]terraformのdynamic blocksを用いたresourceの記述例と参考リンク 

## 概要
dynamic blocksを用いたresourceの記述例と参考リンク  
terraform初心者の自分為のdynamic blocksの書き方メモ  
時間がある際に追記します

## 開発環境
- OSX Mojave 	10.14.4
- terraform      0.12.5

## dynamic blocks参考資料リンク
- [dynamic-blocks-and-splat-expressions](https://github.com/hashicorp/terraform-guides/tree/master/infrastructure-as-code/terraform-0.12-examples/dynamic-blocks-and-splat-expressions)
- [advanced-dynamic-blocks](https://github.com/hashicorp/terraform-guides/tree/master/infrastructure-as-code/terraform-0.12-examples/advanced-dynamic-blocks)
- [Terraform 0.11→0.12で追加された新機能](https://dev.classmethod.jp/tool/terraform-0-12-new-features/)

## 記述例

- aws_autoscaling_policyのstep_adjustment

```terraform
variable "asg_steps" {
  type = list(map(string))
  default = [
   {
     scaling_adjustment           = 1
     metric_interval_lower_bound  = 1
     metric_interval_upper_bound  = 1000
   },
   {
     scaling_adjustment           = 2
     metric_interval_lower_bound  = 1000
     metric_interval_upper_bound  = 2000
   },
   {
     scaling_adjustment           = 3
     metric_interval_lower_bound  = 2000
     metric_interval_upper_bound  = null
   },
  ]
}

resource "aws_autoscaling_policy" "asg_policy" {
  name                   = "auto scaling grouop policy"
  adjustment_type        = "ExactCapacity"
  autoscaling_group_name = aws_autoscaling_group.ecs_asg.name
  policy_type = "StepScaling"

  dynamic "step_adjustment" {
    for_each = var.asg_steps
    content {
      scaling_adjustment          = step_adjustment.value["scaling_adjustment"]
      metric_interval_lower_bound = step_adjustment.value["metric_interval_lower_bound"]
      metric_interval_upper_bound = step_adjustment.value["metric_interval_upper_bound"]
    }
  }
}
```

スキップする項目(metric_interval_upper_bound)は代入値を'null'にすることで書式を合わせてます
【Mac】Python 3 これから環境を整える用のMemo

#はじめに

プログラミングをダラダラと学んでいたが、いよいよ本腰を入れて手を動かそうと思う。
環境構築はしょっちゅうするものでもないからMemo。Pythonのことをググっているとあらゆる方法やパッケージものからインストールしたりなんだりで良く分からなくなったため、再度アンイストールしてやり直し。ひとまず落ち着いたので整理しておく。

#インストール
インストールの前に、既に入っているかをチェック

```
$ python3 -V
```

インストールされていなければ[Python公式サイト](https://www.python.org/)からダウンロード
<img width="1254" alt="スクリーンショット 2019-08-04 13.32.57.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/315033/94e9a24b-9ff0-c043-1fde-af1995bb1e03.png">

（記事投稿時点では3.7.4）

インストールされている場所が分からなくなった時は

```
$ which python
```


ググったり書籍をみると「pyenv」や「anaconda」などのバージョン管理ツールでのインストールが載っているが、

**pyenv**
 → ver3.6以降は非推奨に。3.6以降は venv を推奨とのこと。
venvはpython3.3以降からは標準ライブラリになっているのでインストールは不要。

>pyvenv スクリプトは Python 3.6 で非推奨となり、代わりに python3 -m venv を使い、仮想環境を動かす Python インタープリタを取り違える可能性を防ぎやすくします。

[公式ドキュメント](https://docs.python.org/ja/3.6/library/venv.html#module-venv)より

**anaconda**
　→ Anacondaは「データサイエンティスト」以外いらないんじゃないか説なども気になったが、今回ははちゃめちゃになった環境を整えたい趣旨のためパス。pathが通ってないだのなんだので動かなかったことも、はちゃめちゃに感じた原因かもしれない。

#その他のMemo
**pip**
pipはパッケージの管理ツール。python3.4以降は標準で付属されているようなのでインストール方法は割愛。

バージョンを最新にしておく

```
$ sudo pip install pip --upgrade
```

**標準ライブラリ、サードパーティー製パッケージ**
pythonは標準ライブラリが豊富。というかpythonはライブラリで輝く。

**標準ライブラリ**
絶対覚えれない自信がるから、[公式ドキュメント](https://docs.python.org/ja/3/library/index.html)へのショートカット


**パッケージ**
まずはvenv環境を作成するために、pythonの-mオプションにvenvを指定して、作成する環境名を指定（ここではenv）

```
$ python3.7 -m venv env
```

venv環境にインストールする方が良さそうなので、面倒だけど毎回環境をactivateしてからインストール。

```
$ source env/bin/activate
(env)$
```

例えば「Requests」をインストールしたい場合は以下。

```
(env)$ pip install requests
```

env/lib/python3.7/site-packages配下にインストールされているはず。

環境を抜けるには

```
$ deactivate
```

これでひとまず色々な学習は進められそう。
Java学習メモ（メソッド）

Java Silverの勉強を始めたので、自分の忘備録としてUPします。
ざっくりとしたメモなので、詳細は記載してません。

メソッド定義における戻り値型について。

int型を戻すメソッド
 int method(int num){
     return num * 5;
 }

戻り値を返さない場合
 void method(int num){
      System.out.println(num);
 }

戻り値を返さないのに戻り値型を宣言するとコンパイルエラーになる。
また、宣言した戻り値型と異なる型で返そうとしてもコンパイルエラーになる。
SEIL/x86 FujiをOracle VirtualBoxで使用する

#概要
SEIL/x86は、VMイメージで提供されているソフトウェアルータです。
公式にはVMware、Hyper-V、KVMの3種類のバーチャルマシンで動作するイメージが公開されています。
ただしVMwareイメージ内にOVF形式のファイルがあるので、これを適用する事でSEIL/x86をVirtualBox上で使用する事が可能になります。

[SEIL公式サイト](https://www.seil.jp/)
[SEIL/x86](https://www.seil.jp/product/seil-x86.html)

#準備
以下が既に準備できているものとします。

**1. Oracle VirtualBox** (作業PCにインストール済である事)
**2. SEIL/x86 VMイメージ** (WMware用イメージがダウンロード済である事)

今回必要なOVFイメージはVMwareのイメージファイルに添付されています。
Hyper-Vイメージ等、他のVM用のイメージファイルしか手元にない場合はVMwareイメージを再度ダウンロードし直してください。
SEIL/x86のフル機能を使うための 起動キーファイルと、機能キーファイルは必要に応じて入手してください。

#手順
Oracle VirtualBoxを起動します。
メニューから**[ファイル]→[仮想アプライアンスのインポート]**を選択します。
![クリップボード02.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/476879/3413f990-ea6d-d023-a280-25c12a07b833.png)

ファイル選択ウィンドウが開くので、ダウンロードしたVMイメージを解凍したフォルダを指定して**seilx86.ovf**を開きます。
![クリップボード04.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/476879/73890435-4710-72f2-970b-377762bdfd65.png)

ファイルを指定したら最後に**[インポート]**ボタンを押下してOVFファイルをインポートします。
![クリップボード06.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/476879/1a8b09d1-153a-953c-bb10-cd16c974037d.png)

以上でVirtualBoxにSEIL/x86をインポートは完了です。
インポートされたSEIL/x86は**「vm」**という名称が付いているので、設定画面から適当な名前に変更してください。
![クリップボード08.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/476879/a8a5c2ba-5bd0-0378-e987-afb85075bb13.png)

#その他
本稿はVirtualBoxにSEIL/x86のバーチャルマシンを登録するための手順を記したものです。
**起動キー**及び**機能キー**の登録など、通常のSEIL/x86の初期手順については割愛いたします。
Raspbian Busterでスクレイピング環境構築

#■環境
Raspberry pi 3B+
Raspbian Buster(10.0 kernel 4.19.58)
Selenium　3.141.0
chromium-chromedriver ~~61.0.3163.79~~　65.0.3325.181 ※
Chromium 74.0.3729.157
python 3.7.3
pip3 18.1

~~※chromium-chromedriverは65だと動作しないとの情報だったので、こちらを使用します。
　なお、~~執筆時点のchromium-chromedriverの最新版は65.0.3325.181（2018-03-28）です。
　61では実行時にエラーがでましたが、最新版に更新したら解決しました。

#■手順
1. Seleniumをインストールする。

`pip3 install selenium`

2.　chromium-chromedriver（debファイル）をダウンロードする。
`curl -O http://launchpadlibrarian.net/361669488/chromium-chromedriver_65.0.3325.181-0ubuntu0.14.04.1_armhf.deb`

ちなみに、chromium-chromedriverの他のバージョンはこちらから確認できます。
https://launchpad.net/ubuntu/trusty/armhf/chromium-chromedriver

3.　ダウンロードしたchromium-chromedriverをインストールする。
`sudo dpkg -i chromium-chromedriver_65.0.3325.181-0ubuntu0.14.04.1_armhf.deb`

※古いバージョンがインストールされている場合もこれで上書きできます。

#■動作確認
VNC等でラズパイにアクセスし、以下のスクリプトを実行すると、Chromiumが起動し、指定のページが開きます。（このソースではMSNが開く）

```python3:scrape.py
#! /usr/bin/env python3
# -*- coding: utf-8 -*-

import sys
sys.path.append('/home/pi/.local/lib/python3.7/site-packages/')　#使用中のPythonのバージョンに合わせて編集してください。
from selenium import webdriver

browser = webdriver.Chrome(executable_path="/usr/lib/chromium-browser/chromedriver")
browser.get('https://www.msn.com/')

```
`python3 scrape.py`

#■参考
https://qiita.com/Brutus/items/7381a13fa395f9b73855
https://qiita.com/tamanobi/items/60e4f427f7651f275567
rspec : subjectがなくてもテストは通る。その場合の書き方。

#subjectを使った場合

```spec/requests/articles_spec.rb
require 'rails_helper'

RSpec.describe "Articles", type: :request do
  describe "GET /api/v1/articles" do
    subject { get(api_v1_articles_path) }  ←ここでリクエストのpathをsubjectで指定。こうすることで subject　のみの記述で同じリクエストを指定できる。ドライに書ける。

    let(:article_count) { 5 }
    before do
      create(:user, :with_articles, article_count: article_count)
    end

    it "articlesの一覧を取得できる" do
      subject　　←このsubject一行で、上で指定したpathを同じ意味になる。(同じpathにリクエストを送る)
      res = JSON.parse(response.body).count
      expect(res).to eq article_count
    end

  end
end
```


#subjectを使わない場合

```spec/requests/articles_spec.rb
require 'rails_helper'

RSpec.describe "Articles", type: :request do
  describe "GET /api/v1/articles" do

    let(:article_count) { 5 }
    before do
      create(:user, :with_articles, article_count: article_count)
    end

    it "articlesの一覧を取得できる" do
      get(api_v1_articles_path)　　　←subjectを使わずにpathの指定
      res = JSON.parse(response.body).count
      expect(res).to eq article_count
    end

  end
end
```

参考
https://qiita.com/takutotacos/items/f65b47d18c124110eebd
wp構築メモ

# WordPress構築のおおまかな流れ
##
1.CentOS7を用意する
2.各種パッケージをインストールする
3.ポート開放する
4.DBの設定をする
5.wordpressをインストールする
6.phpのバージョンアップをする
7.selinuxの設定など
8.wordpressへアクセスし、設定する
おおまかな手順は以上です。
## パッケージをインストールする
Apache, PHP

```
# yum install httpd php php-mysql wget
---HTTPポート解放
# firewall-cmd --add-port=80/tcp --zone=public --permanent
# firewall-cmd --reload
# firewall-cmd --list-all --zone=public
# systemctl start httpd
# systemctl enable httpd
```

##mariadbをインストールする
```
# yum install mariadb mariadb-server
# systemctl start mariadb
# systemctl enable mariadb
```

##DBのパスワードを設定する
```
mysql -u root
MariaDB [(none)]> update mysql.user set password=password('$パスワードを自由に入力') where user = 'root';
MariaDB [(none)]> flush privileges;
MariaDB [(none)]> exit;
```

##wordpress用のDBを作成する
```
# mysql -u root -p
# Enter password:
MariaDB [(none)]> create database wordpress;
MariaDB [(none)]> show databases;
MariaDB [(none)]> exit;
```
##WordPressのインストールをする
```
wget https://ja.wordpress.org/latest-ja.tar.gz
# mv latest-ja.tar.gz /var/www/html/
# cd /var/www/html/
# tar -xzvf latest-ja.tar.gz 
# chown -R apache:apache wordpress
```
##apacheの設定をする
```
# vi /etc/httpd/conf/httpd.conf
```
httpd.conf内を以下のように変更。

```
DocumentRoot "/var/www/wordpress"
```
httpd.conf内のどこかに以下を追記。

```
<Directory "/var/www/html/wordpress">
Options Indexes FollowSymLinks
AllowOverride All
Order allow,deny
Allow from all
</Directory>
```

##phpのバージョンを5.6にする
```
# yum install epel-release
# rpm -Uvh http://rpms.famillecollet.com/enterprise/remi-release-7.rpm
# sudo yum remove php-*
# sudo yum install --enablerepo=remi,remi-php56 php php-devel php-mbstring php-pdo php-gd php-xml php-mcrypt php-mysql
```



##apacheを再起動する
```
# systemctl restart httpd
```
##SELinuxを一時的に無効にする
```
# getenforce
Enforcing
# setenforce 0
```
## wordpressの設定
ブラウザからhttp://xxx.xxx.xxx/wordpress/wp-adminもしくはhttp://xxx.xxx.xxxにアクセス
###「さあ、始めよう」をクリックする

###ＤＢユーザー名とパスワードを入力して「送信」ボタンをクリックする
###「インストール実行」をクリックする
##SELinuxを再度有効化する
```
# setenforce 1
```
#参考
1.https://qiita.com/pugiemonn/items/6f642ffb0165f69dab3d
2.https://qiita.com/heimaru1231/items/84d0beca81ca5fdcffd0
3.http://www.matsubarasystems.com/wordpress/wordpress-install-writeconfig-probrem
Java学習メモ (while文、do-while文)

Java Silverの勉強を始めたので、自分の忘備録としてUPします。
ざっくりとしたメモなので、詳細は記載してません。

while文、do-while文でも{}を省略することが可能である。
しかし、{}を省略した場合、繰り返されるのは1文だけなので注意すること。
以下の例文だと繰り返されるのは「System.out.println("1文目");」のみである。

 int cnt = 0;
 while(cnt++ < 10)
    System.out.println("1文目");
 　　System.out.println("2文目");

1行ではなく、1文である点も要注意。
改行していなくても「;」で区切っていれば1文目しか繰り返しはされない。

また、{}を省略した際に2文以上記述するとコンパイルエラーになる。
 int cnt = 0;
 do
    System.out.println("1文目");
 　　System.out.println("2文目");
 while(cnt++ < 10);
FlutterでFacebookっぽい下タブをタブを作る

Facebookアプリケーションがリニューアルをしたようで下タブの挙動が少し変わっています。

(詳しくはお手元のFacebookアプリをご確認ください)

こんな挙動をFlutterで実現してみました。

作ったのがこちら

![output.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/139360/f5f66d57-ddee-ccd3-67d1-a486cbbd4fdd.gif)



## 実装

コピペで動くようにしています。

```dart

import 'package:flutter/material.dart';

class Home extends StatefulWidget {
  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> with SingleTickerProviderStateMixin {
  TabController _tabController;

  final List<Tab> tabs = <Tab>[
    Tab(
      icon: Icon(Icons.home),
    ),
    Tab(
      icon: Icon(Icons.my_location),
    ),
    Tab(
      icon: Icon(Icons.pages),
    ),
    Tab(
      icon: Icon(Icons.person),
    ),
    Tab(
      icon: Icon(Icons.exit_to_app),
    ),
    Tab(
      icon: Icon(Icons.card_membership),
    ),
  ];

  @override
  void initState() {
    super.initState();
    _tabController = TabController(length: tabs.length, vsync: this);
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          backgroundColor: Colors.white,
        ),
        bottomNavigationBar: SafeArea(
          child: TabBar(
            tabs: tabs,
            controller: _tabController,
            indicator: UnderlineTabIndicator(
              borderSide: BorderSide(color: Colors.blue, width: 5),
              insets: EdgeInsets.fromLTRB(0.0, 0.0, 0.0, 40),
            ),
            unselectedLabelColor: Colors.grey,
            indicatorColor: Colors.blue,
            indicatorSize: TabBarIndicatorSize.tab,
            indicatorWeight: 2,
            indicatorPadding:
                EdgeInsets.symmetric(horizontal: 18.0, vertical: 8),
            labelColor: Colors.black,
          ),
        ),
        body: TabBarView(
          physics: NeverScrollableScrollPhysics(),
          controller: _tabController,
          children: tabs.map((tab) {
            return _createTab(tab);
          }).toList(),
        ));
  }

  Widget _createTab(Tab tab) {
    return Center(
      child: Text(
        "Tab",
        style: TextStyle(fontSize: 24.0),
      ),
    );
  }
}


```

以上です。
Figmaでアートボードを拡大縮小するときに中身を拡大縮小しないようにする

FigmaでWebデザインなどやるときに起こる微妙なトラブル。まだ日本語でそれっぽい情報がなかったので。

# 問題
コンテンツの量が思ったより多くなったからアートボードの端を引っ張って伸ばそうとすると、中にある画像やらなんやらが全部一緒に伸びてアカーンとなる。

Sketchならアートボードのメニューに「adjust content on resize」というチェックボックスがあって、それを外したら大丈夫なんだけど、Figmaには今のところない。

# 解決
アートボードを引っ張るときにMacなら`Command`キー、Windowsなら`Ctrl`キーを押しながら操作することで、中身に影響せずにアートボードだけを拡大縮小できる。

# 参考ページ
https://spectrum.chat/figma/feature-requests/adjust-content-on-resize~60fd09b6-d054-49e5-84c1-bbe3162cbeb3
【web開発 Git】Gitコマンド早見表

**初期設定**

```sh
$ git config --global user.name "XXXX"
$ git config --global user.email "XXXX@hogehoge.com"
```
**localリポジトリ作成、追加、remoteへのpush**

```sh
$ git init
$ git add -A                  # 全ファイルをadd
$ git add <ファイル名>          # 指定ファイルのみadd
$ git commit -m "comment"     # addされたファイルにコメント付与
$ git commit -am "comment"    # addとコメント付与同時実行
$ git remote add origin https://github.com/XXXX/XXXXXX.git
$ git push -u origin master
```
**remoteからclone**
クローンは \$ git init と \$ git pull を一括してしくれ、リモートリポジトリの各種設定もしてくれるためミスがない。基本これを使うべき。また \$ git pull は \$ git fetch と \$ git merge を一括したもの。

```sh
$ git clone https://github.com/XXXX/XXXXXX.git
```
**localの変更確認**

```sh
$ git status
```
**localとremoteの差分表示**

```sh
$ git diff <ファイル名>
```
**commit変更履歴参照**

```sh
$ git log
```
**addの取り消し**

```sh
$ git reset HEAD <ファイル名>
```
**commitの取り消し**

```sh
$ git reset --hard HEAD^
```
--hard：コミット取り消した上でワークディレクトリの内容も書き換えたい場合
--soft：ワークディレクトリの内容はそのままでコミットだけを取り消したい場合
HEAD^：直前のコミット
HEAD~{n} ：n個前のコミット

**commitの修正**

```sh
$ git commit --amend "新しいコミットメッセージ"
```
**push取り消し**

```sh
$ git reset --hard <戻したいコミットのハッシュ値>
$ git push -f
```

**localブランチ**

```sh
$ git branch <ブランチ名>                        # ブランチ作成
$ git checkout <ブランチ名>                      # ブランチ切り替え
$ git checkout -b <ブランチ名>                   # ブランチ作成 & 切り替え
$ git branch -m <古いブランチ名> <新しいブランチ名>  # ブランチ名変更
$ git push -u origin <ローカルのブランチ名>        # ブランチのpush
$ git branch <ブランチ名> origin/<ブランチ名>      # remoteのブランチをlocalに
$ git branch -a                                 # 全てのブランチ確認
git diff <ブランチ名> <ブランチ名>                 #ブランチ比較
```
プログラミングノート(Python3その１)

備忘録もかねて簡単なプログラミングノートを作成していきます。

##開発環境
まず、以下よりPythonのインストールを行います
https://www.python.org/
Pythonには、2系と3系があります。
2系は、2020年1月1日をもってサポート終了となります。これから始めるという方は、3系を選択しましょう。
記載時(2019/08/04)の最新バージョンは、3.7.4です。
これは個人的なことですが、最新バージョンだと既存のライブラリが対応していないことがあるため、最新より2つか3つ古いバージョンを使っています。
インストールの仕方については、以下を参照してください。
https://www.python.jp/install/windows/install_py3.html
また、統合開発環境については割愛します。以下が参考になると思います。
https://udemy.benesse.co.jp/development/web/python-environment.html

##プログラムの実行
プログラムの実行は、コマンドラインで実行可能です。
python プログラムファイル名(例：sample.pyなど)と打ち込み実行させます。
※もし実行されない場合は、フルパス(絶対パス)にしてみる。
また、REPL(対話実行モード)という実行もあります。こちらは、プログラムを1行ごとに実行します。REPLの実行方法は、コマンドラインで「python3」もしくは「python」と打ち込み実行します。>>>と表示されていればOKです。

##変数について
変数を使うには、「変数 = 値」とすればOK。
C言語やJavaなどのように変数の型を宣言したりはしません。
~~文字列を代入すれば文字列型(String)、数値を代入すれば数値型となります。数値に関しては、整数・実数(小数)の区別はありません。~~
⇒文字列を代入すれば文字列として、数値を代入すれば数値として扱われる。
　数値には、int(整数)型やfloat(浮動小数点)型がある
~~一度文字列を代入したものに数値、数値に代入したものに文字列を再代入することはできません。~~
⇒再代入はできます。変数はラベルの役割なので、ラベルの付け替えをするイメージ
また、TrueもしくはFalseで表されるブール型も存在する。
####<変数名に使える文字>
| 文字種類 | 実際の文字 | 使用例 |
|:-----------|:------------|:------------|
| アルファベット| a-z | price、resultなど |
| 数字(2文字目以降※1)| 0-9 | plan3、test2など |
| アンダースコア(※2) | _ | orange_price、a_pointなど |
| 漢字・ひらがな・カタカナ | 漢字、あ～ん、ア～ン | 値段、ポイントなど |
| ギリシャ文字 | α、βなど | pointα、pointβなど |
※1・・・1文字目に数字は使用できません
※2・・・先頭に「_」をつけることはできますが、プライベートな変数を明示するために使用される

##定数について
Pythonでは、Javascriptのconstなどのように定数はサポートされていません。
ただし、明示的に定数として表すため、大文字のアルファベット(+アンダーバー)で表記する
例）PI = 3.14、MAX_BUFFER_SIZE = 1024など

##「None」について
Noneとは、値が存在しないことを表すオブジェクトです。他言語では、nullです。
空の値とは厳密に違います。空の値とは、0(空の数値型)や""もしくは''(空の文字列)のことです。
~~使い方としては、値が存在するか確認する場合に使用します。~~
例）変数xに値が存在するか

```python
  # 変数xにNoneを入れ、値がないという状態にする
　>>> x = None
　>>> x is None
  True # 変数xは値が存在しない

　>>> x = ""
  >>> x is None
  False # 空の文字列が値として存在する
```

***
本日は、ここまで

※ shiracamusさまより誤った部分について指摘がありました。
　コメント欄も参考にしていただくと幸いです。
可変長引数構文（Go の関数の引数定義）

こんにちは。
Go の関数の引数定義で、可変長引数構文を試してみました。

- 参考にしたのは、"[Passing arguments to ... parameters](https://golang.org/ref/spec#Passing_arguments_to_..._parameters)" (The Go Programming Language Specification) です。
- 0個、1個、複数個を与えて試しました（```T{}``` も与えてみました）。

```console
$ go run sum2.go 
1
1
3
3
```

```sum2.go 
package main

import (
 	"fmt"
)

type B struct {
	b  int
}

func sum2(a int, bs ...B) int {
	var b B
	if len(bs) > 0 {
		b = bs[0]
	}
	return a + b.b
}

func main() {
	fmt.Println(sum2(1)) // ==> 1
	fmt.Println(sum2(1, B{})) // ==> 1
	fmt.Println(sum2(1, B{2})) // ==> 3
	fmt.Println(sum2(1, B{2}, B{5})) // ==> 3
}
```
PyOpenGL glGenBuffersでエラー

PythonからOpenGLを使ってとあるプログラムを開発中です。

初歩的なところですが、glGenBufferwsを実行して以下のエラーが出てはまったので対処方法を紹介します。

#OpenGLのエラー
OpenGL.error.NullFunctionError: Attempt to call an undefined function glGenBuffers, check for bool(glGenBuffers) before calling

#対処方法
glutInit と glutInitDisplayMode と glutCreateWindow を先に実行すること。

OpenGLの初期化が完了していないのが原因です。
python グラフプロットとファイル保存

◆プログラムの目的：グラフプロットし、ファイル保存する(png,pdf)

◆処理手順概要：
ランダム数発生させ、グラフを作成。
結果をファイル保存してから、GUIとして画面に表示する。
※先に plt.show()　してしまうと、plt.savefigしても空白ファイルになってしまう。
　必ず先にファイル保存してから、画面表示　の順番が大切。

◆環境
windows10
anaconda3
python3.7.3

◆実行方法
１. test_plot.py ファイルを作成する
・テキスト編集の場合、ファイル保存時の文字コードは UTF-8N, 改行コード　CR+LF
・annaconda spyderソフトで起動の場合　自動的にUTF-8Nで保存される  　

２. anaconnda prompt を起動
      cd .pyファイルがあるフォルダ
　　　 python test_plot.py
     正常実行したら output_graph.png, output_graph2.pdf が作成される

◆参考：http://iatlex.com/python/matplotlib_intro1

◆関連
下記参考に3Dグラフも描くことができた
https://qiita.com/mojaie/items/c993fbb3aa63d0001c1c

今後として
下記参考にグラフ外観の変更もできるようにしたい
http://pynote.hatenablog.com/entry/matplotlib-surface-plot

インタラクティブな操作をできるようにしたい
https://riptutorial.com/ja/matplotlib/example/23577/matplotlib-widgets%E3%81%AB%E3%82%88%E3%82%8B%E3%82%A4%E3%83%B3%E3%82%BF%E3%83%A9%E3%82%AF%E3%83%86%E3%82%A3%E3%83%96%E3%82%B3%E3%83%B3%E3%83%88%E3%83%AD%E3%83%BC%E3%83%AB

◆ソースコード
◇test_plot.py

```
# -*- coding: utf-8 -*-
"""
Created on Sun Aug  4 11:56:12 2019

@author: user
"""
import matplotlib.pyplot as plt
import numpy as np
 
y = np.random.rand(100)
x = np.linspace(1, 5, 100)
 
plt.plot(y)

plt.savefig('out_graph.png', dpi=300, orientation='portrait', transparent=False, pad_inches=0.0)

plt.savefig('out_graph2.pdf', orientation='portrait', transparent=False, bbox_inches=None, frameon=None)

plt.show()


```

◆結果　output_graph.png
![out_graph.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/423803/200f0204-bb42-80f3-9182-d6c066f85077.png)
【PHP】文字列を一文字づつ分解して配列に格納したい(str_split)

## 【PHP】文字列を一文字づつ配列に分解

##str_split()
PHPで○番目の文字や最後の文字を切り出したい、などの場面がよくあります。
こうした場合、文字列を一文字づつの配列にしてあげると色々処理ができて便利です。結構探すのに時間かかってしまったので備忘録もかねてメモ。

例えば、文字列の"hello world"を配列形式で('h','e','l','l','o','w','o','r','l','d');のようにしたい。

##使い方
上記の場面で便利な関数はstr_split()です。こちらの関数を上記に適用すると下記のようになります。

```
$str = "hello world";

$array = str_split($str);

print_r($array);
```

出力結果;

```
Array
(
    [0] => h
    [1] => e
    [2] => l
    [3] => l
    [4] => o
    [5] =>  
    [6] => w
    [7] => o
    [8] => r
    [9] => l
    [10] => d
)
```


数値に対しても、同じようにstr_spritで配列に格納をすることができます。（こっちのケースの方が使用することが多いかも？）
*ただし文字列として格納されます。厳密にint型で扱いたい場合はint_val等の型変換が必要になリます。

```
$num = 123456789;

$array1 = str_split($num);

print_r($array1);
```

出力結果；

```
Array
(
    [0] => 1
    [1] => 2
    [2] => 3
    [3] => 4
    [4] => 5
    [5] => 6
    [6] => 7
    [7] => 8
    [8] => 9
)
```


##まとめ
str_splitを使うと、文字列を配列に変換できる

##追記
こうした関数の処理を手軽に確認したい時、僕はよくpaiza.ioを使ってます。
https://paiza.io/ja
[.NET][消費税] 税込価格から本体価格を逆算する式（四捨五入／切り捨て／切り上げ）

税込価格から本体価格を算出する方法は、消費税の端数処理方式によって異なります。
たとえば税率8%で税込価格が110円の場合、切り上げ方式で端数処理した消費税なら本体価格は101円ですが、切り捨て方式で端数処理した消費税なら本体価格は102円です。

以下、端数処理方式別の算出式です。
※rate には、0.05m, 0.08m, 0.10m などの消費税率（正の値）が入ります。

## 四捨五入方式で端数処理した税込価格 → 本体価格

```c#:C#
Math.Ceiling((priceWithTax - 0.5m) / (1m + rate))
```

```vb:VB.NET
Math.Ceiling((priceWithTax - 0.5D) / (1D + rate))
```

## 切り捨て方式で端数処理した税込価格 → 本体価格

```c#:C#
Math.Ceiling(Math.Abs(priceWithTax) / (1m + rate)) * (priceWithTax >= 0 ? 1 : -1)
```

```vb:VB.NET
Math.Ceiling(Math.Abs(priceWithTax) / (1D + rate)) * If(priceWithTax >= 0, 1, -1)
```

## 切り上げ方式で端数処理した税込価格 → 本体価格

```c#:C#
Math.Truncate(priceWithTax / (1m + rate))
```

```vb:VB.NET
Math.Truncate(priceWithTax / (1D + rate))
```
Duolingo の Level と XP の関係

[Duolingo](https://www.duolingo.com/) は、言語をゲーム感覚で学ぶ教材です。
問題をひとつ完了すると、11 ~ 15 XP を得ます。そして、どんどんXPを貯めると Level が上がります。
Level と XP の関係を表にしてみました。これは全ての言語に共通です。

| Level | XP |
| --- | --- |
|2  |60  |
|3  |120  |
|4  |200  |
|5 |300  |
|6  |450  |
|7  |750  |
|8  |1125  |
|9 |1650  |
|10 |2250 |
|11 |3000 |
|12 |3900 |
|13 |4900 |
|14 |6000 |
|15 |7500 |
|16 |9000 |
|17 |10500 |
|18 |12000 |
|19 |13500 |
|20 |15000 |
|21 |17000 |
|22 |19000 |
|23 |22500 |
|24 |26000 |
|25 |30000 |
Raspberry piでbridgeを作成

ネットワークの検証にブリッジを使う必要が出てきたので、Raspberry pi3でブリッジ機能を設定したので、備忘録として残しておきます。

作成したブリッジを使ってDLNA通信の検証を行いました。

# 使用機材
  - Raspberry pi3 Model B+
  - [USB-LANケーブルアダプタ EDC-GUA3-B](https://www.elecom.co.jp/products/EDC-GUA3-B.html)
  - Cat 5EのLANケーブル

# 操作内容
USB-LANケーブルアダプタをRaspberry piにつけた後、下記の流れで設定することで、ブリッジを実現できます。
SSH接続で設定する場合は、念のため、下記の操作が完了するまでLANケーブルをアダプタに接続しない方がいいです。

## 入力コマンド

```terminal
apt-get install bridge-utils #bridgeを実現するためのパッケージをインストール
sysctl net.ipv4.ip_forward=1 #パケットをフォワーディングするように設定
brctl addbr br0 #ブリッジインタフェースを設定
#ブリッジインタフェースbr0に転送する二つのインタフェースを設定
brctl addif br0 eth0
brctl addif br0 eth1
brctl show #上記の設定が反映されているか確認
#インタフェースの有効化（インタフェースがUPされていれば不要）
ip link set eth0 up
ip link set eth1 up
ip link set br0 up
vim /etc/network/interfaces #下記の設定例をもとに変更
vim /etc/dhcpcd.conf #下記の設定例をもとに変更
sudo reboot
```
## 設定ファイルの参考例

### /etc/network/interfaces

```terminal:/etc/network/interfaces
source-directory /etc/network/interfaces.d

auto br0
iface br0 inet manual
bridge_ports eth0 eth1
```

### /etc/dhcpcd.conf
ファイルの最終行に下記の設定を反映させます。

```terminal:/etc/dhcpcd.conf
（省略）

# fallback to static profile on eth0
#interface eth0
#fallback static_eth0
denyinterfaces eth0 eth1
interfaces br0
static ip_address=192.168.1.1
static_routers=192.168.1.254
```

# DLNA通信の検証
作成したブリッジを使って、DLNA機器がどれだけパケット遅延を許容するか検証してみました。
Panasonicの「どこでもDIGA」の宅内視聴モードを利用して、遅延をかけた状態でもスマートフォンでDLNAサーバ（録画レコーダ）から録画番組リストを取得できるか、取得出来たら録画番組データを取得できるか実験してみました。

## 構成
[スマートフォン]←→[ルータ]←→[ブリッジ]←→[DLNA機器（DMR-BW550, Panasonic）]

## 使用コマンド（ブリッジ上）
```terminal
sudo tc qdisc add dev eth0 root netem delay 1ms
sudo tc qdisc del dev eth0 root netem delay 1ms
sudo tc qdisc add dev eth0 root netem delay 2ms
sudo tc qdisc del dev eth0 root netem delay 2ms
sudo tc qdisc add dev eth0 root netem delay 3ms
sudo tc qdisc del dev eth0 root netem delay 3ms
sudo tc qdisc add dev eth0 root netem delay 7ms
sudo tc qdisc del dev eth0 root netem delay 7ms
```

## 結果
ひとまずブリッジは正常に動作しました。
肝心のDLNA通信ですが、パケット遅延0msのときは想定通り、録画番組リストの取得と録画番組の再生ができました。
ただパケット遅延を1ms発生させた時点で録画番組リストの取得が不安定（2回に1回は失敗）になり、録画番組の再生は全て失敗しました。
2ms以上は録画番組リストの取得すら100%失敗しました。

この様子だと[このサイト](http://secondbest.hatenablog.com/entry/20111012/1318428541)で書かれていた通り、2019年9月現在でもDTCP-IPの「RTT 7 ms」の制限はあるみたいです。
スマートフォンとRaspberry pi間でVPN構築して直接通信したいと思っていたのですが、実現は難しいでしょう。

# 参考
- [RaspberryPiが二重にIPアドレスを取得してしまった件](https://yuutosi.net/post-912/)
- [Raspberry Pi でパケット遅延器](https://blog.techlab-xe.net/archives/5509)
RPGアツマールのグローバルシグナル

# 概要

RPGアツマールには非同期ネットゲームを想定したAPIが存在します
その中の「グローバルシグナル」を使ってみた記事です

以前、ユーザーシグナルについての記事を書いているので
基本的な解説は重複しているところがあります

* [RPGアツマールのユーザーシグナルでいいね！を送る][link1]
[link1]:https://qiita.com/shirogane/items/3d8955a69a554e9ff2f8

# 作ったもの

* レイドバトル(エンディング後の要素にしています)
  * https://game.nicovideo.jp/atsumaru/games/gm9445
  * ボスに与えたダメージをグローバルシグナルで送りあってレイドバトルを実現しています

作ったものの具体的な説明については別な記事で書こうと思います

# シグナルとは

* 公式のドキュメントはこちらです
  * https://atsumaru.github.io/api-references/signal

ユーザー間での情報のやり取りを、シグナルという機能によって行えます
シグナルには100byte以内の情報(文字列)を入れることができます

例えば、送り側で以下のようなjsonの文字列を作って送信します

```javascript
{ SignalId:1, SaveIdx:1, Hp:10000 }
```

受け側ではシグナルを取得すると送られた上記の文字列を取得できます
jsonを解釈することで、送り側から送られたSignalIdとSaveIdxとHpの値が分かるという流れです

送り側のユーザーIDや名前はこれとは別に付与されているので含めなくて大丈夫です

シグナルには「ユーザーシグナル」と「グローバルシグナル」があります

## ユーザーシグナル

指定したユーザー間で情報をやり取りするときはユーザーシグナルを使います
送り先のユーザーIDを引数に指定して目的のユーザーに送信します
使い方のイメージは以下の記事にまとめています

* [RPGアツマールのユーザーシグナルでいいね！を送る][link1]

## グローバルシグナル

全ユーザーに対して情報を送るときにはグローバルシグナルを使います
ユーザーシグナルとの違いは

* 全ユーザーに対して送信する
* 自分発信のシグナルを受信する

という辺りです

# グローバルシグナルの動き

本記事ではグローバルシグナルを解説します
全ユーザーに対して送る「グローバルシグナル」の動きを解説します

送り側は
`window.RPGAtsumaru.experimental.sendSignalToGlobal()` 
を実行します

1回送ると全ユーザーが取得できるようになります

送り側とたくさんの受け側(自分も含む)がいて

<img width="400" alt="図1.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/107395/1b4abdab-6214-4777-5964-0a4fd3c84073.png">


1件送るとこうなって・・・

<img width="400" alt="図1.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/107395/7c07fd9f-0b35-4552-6732-2c0fc52de9bd.png">


また1件送るとこうなって・・・

<img width="400" alt="図1.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/107395/3e042517-831f-072b-5b54-99b34da581ec.png">

サーバーに蓄積されていくイメージです

受け側は
`window.RPGAtsumaru.experimental.getGlobalSignals()`
を実行します

各ユーザーごとに、
1回の実行で先程送られた2件を全部取得します

<img width="400" alt="図1.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/107395/61816172-4b0b-7395-abb2-206ffe61ee74.png">

またこの後に、送り側から3件目、4件目を送信してから、
受け側でシグナルの取得を行うと、受け側では1~4件目を全部取得してしまいます

APIの実行では全部取得してしまうので、
ゲーム側で新しいシグナルだけを読みたい場合は、
どこまで取得したかの情報をクライアントで持っておく必要があります

公式プラグインの `AtsumaruGlobalSignalExperimental.js` が、
この辺りの制御をうまくやっていて、全シグナルを取りつつ、
ゲーム側には新しいシグナルしか渡さないようになっています

シグナルの情報が移動するイメージはユーザーシグナルとほぼ同じですが、
送る時はユーザーIDを指定せずに全員が取得できるように送ります
全員が取得できるということは**自分も**取得できてしまいます

## 公式プラグインを読み解く

* [RPGアツマールのユーザーシグナルでいいね！を送る][link1]

ユーザーシグナルのものとほぼ同じです
上記の解説記事をご参照ください


## すべてのシグナルを取得できない可能性がある

こちらはユーザーシグナルもグローバルシグナルも同じですが
以下のことに注意してゲームの仕様を決める必要があります

* 一定の件数/容量を超えると古いものから削除される仕様のため**シグナルは全て受け取れない可能性がある**
* 件数や容量の詳細は公式の制限詳細を参照してください
   * https://atsumaru.github.io/api-references/signal

特にグローバルシグナルの場合全ユーザーのシグナルが来るので
古いものが欠落する可能性が高くなると思います

## 自分発信のシグナルを受け取る

グローバルシグナルはユーザーシグナルと違って全員が取得できるシグナルのため、**自分が発信したシグナルを自分が受け取る**ことになります

例えば「誰かがログインしました」的な通知はグローバルシグナルで実現できると思いますが、自分のログイン通知をゲーム画面に出さなくてもよい仕様なのであれば、自分発信のシグナルを受け取ったときに除外するようにします

シグナルには発信者のユーザーIDが付与されているので、それが自分のユーザーIDと一致したら処理しない、とすればよいです

# まとめ

グローバルシグナルの仕組みの説明と、使うときの注意点をまとめてみました
公式プラグインを使うだけであってもどういう動き方をしているのかが分かれば使い方のイメージがしやすいかなと思います
ffmpegで入力音声を1ch, 44.1kHzに変換する

基本

```bash
ffmpeg -i ${infile} -ar 44100 -ac 1 ${outfile}
```

フォルダ単位（拡張子変えない場合）

```bash
ls -1 ${inDir}/ | xargs -I{} ffmpeg -i track/{} -ar 44100 -ac 1 ${outDir}/{}
```

フォルダ単位（全部wavに変える場合）

```bash
ls -1 ${inDir}/ |
while read line; do
  fname=${line}
  bname=${line%.*}
  #echo ${fname}
  #echo ${bname}
  ffmpeg -y -i ${inDir}/${fname} -ar 44100 -ac 1 ${outDir}/${bname}.wav < /dev/null
done
```

/dev/nullが必要な理由は下記参照。
https://kazkn.com/post/2017/bash-loop-ffmpeg/

これをつけないと、`No such file or directory`が出て動かなくなる
diceの使い方

#CENTOS7にDiceをインストール

http://www.hi-ho.ne.jp/yoshihiro_e/dice/linux.html

cui版をダウンロードし、適当なディレクトリに解凍する

tar xzvf diced01914.tar.gz

※ dice起動時に文字化けをした場合は、nkfをインストール
yum install nkf

起動時は、以下で行う
./diced | nkf  -uw

setup

で初期設定を行う

add

でイベントの登録を行う