OmniAICreator/Qiita-1.07M huggingface dataset:
Pythonモジュールの実ファイルの場所を確認する


# 2018/7/11 追記

やっと理解できました。

```
>>> import slackbot.bot
>>> slackbot.bot.__file__
'/usr/local/lib/python3.6/dist-packages/slackbot/bot.py'
>>>
>>> import slacker
>>> slacker.__file__
'/usr/local/lib/python3.6/dist-packages/slacker/__init__.py'
>>>
>>> import slackclient
>>> slackclient.__file__
'/usr/local/lib/python3.6/dist-packages/slackclient/__init__.py'
>>>
```


`from XXXXX import yyyy`


ってやってたら見つからないってことでした。
そのまんまかもしれませんが、『XXXXからyyyyって部分だけ内部で展開するぞ』ってことなんすね。
そんな事もわからなかった
自分は愚か者です。


```
>>> import sys
>>> sys.__file__
Traceback (most recent call last):
  File "<stdin>", line 1, in <module>
AttributeError: module 'sys' has no attribute '__file__'
>>>
```

`__file__`って属性部分がないと見えないよって怒られました。
標準モジュールだと持ってないものもあるってことでしょうか。

---


以下は見なくていいです。（自分の愚かさのために残します。）
---

Slack用Botを作ってて疑問に思ったのが、

`from slackbot.bot import Bot`
このモジュールって実体はどこなんだろう。と。
`pip install slackbot`でインストールしたけどよくわからん…。
pyenvとか使ってしまい、初心者の自分には大変苦労しました。
ということでPythonが使うパスを確認。



```
>>> import sys
>>> sys.path

['', '/home/ajitama/.pyenv/versions/3.6.3/lib/python36.zip', '/home/ajitama/.pyenv/versions/3.6.3/lib/python3.6', '/home/ajitama/.pyenv/versions/3.6.3/lib/python3.6/lib-dynload', '/home/ajitama/.pyenv/versions/3.6.3/lib/python3.6/site-packages']
>>>
```

どうやら、Pythonのモジュール検索場所は下記に通ってるらしい。
>'/home/ajitama/.pyenv/versions/3.6.3/lib/python36.zip', 
'/home/ajitama/.pyenv/versions/3.6.3/lib/python3.6', 
'/home/ajitama/.pyenv/versions/3.6.3/lib/python3.6/lib-dynload', 
'/home/ajitama/.pyenv/versions/3.6.3/lib/python3.6/site-packages'


ということで、ここから根性で探す。

```
~/.pyenv/versions/3.6.3/lib/python3.6/site-packages$ ls -ld slack*
drwxr-xr-x 4 ajitama kuntama 4096 Dec 13 13:16 slackbot
drwxr-xr-x 2 ajitama kuntama 4096 Dec  8 15:25 slackbot-0.5.1.dist-info
drwxr-xr-x 3 ajitama kuntama 4096 Dec  8 16:30 slackclient
drwxr-xr-x 2 ajitama kuntama 4096 Dec  8 16:30 slackclient-1.1.0-py3.6.egg-info
drwxr-xr-x 3 ajitama kuntama 4096 Dec  8 15:25 slacker
drwxr-xr-x 2 ajitama kuntama 4096 Dec  8 15:25 slacker-0.9.60-py3.6.egg-info
```

slackbotモジュールの実体を無事みつけました。
Gitでローカルブランチを削除する

### ローカルブランチを削除する手順

###### ◆ローカルブランチの確認
```terminal
$ git branch 
```
---
###### ◆削除コマンド1
```terminal
# どちらも同じ
$ git branch --delete [ブランチ名]
$ git branch -d [ブランチ名]
```
- マージ済みのブランチのみ削除ができる
    - マージされていないブランチを削除しようとすると下記のようなエラーがでます
        - （error: Cannot delete the branch 'ブランチ名' which you are currently on）
- マージされていないブランチを削除したいときは**削除コマンド2**を    

---


###### ◆削除コマンド2
```terminal
$ git branch -D [ブランチ名]
```
- どんなローカルブランチも削除できる

---

##### ★削除せずにブランチ名を変えたいときは。。。
[githubでブランチ名を変更する（ローカル/リモート）](https://qiita.com/amidara/items/e47dfb0cf88270ef2802)
【JavaScript】リアルタイムで文字数をカウントして表示させる（要jQuery）

文字数に制限があって、残り何文字入力できるのかを表示する必要がある場合は使えるかもしれません。
（※別途バリデートかける必要があります）

```form.html
<script src="//ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>  
<script type="text/javascript">
$(function(){

    var text_max = 10; // 最大入力値
    $(".count").text(text_max - $("#memo_text").val().length);

    $("#memo_text").on("keydown keyup keypress change",function(){
        var text_length = $(this).val().length;
        var countdown = text_max - text_length;
        $(".count").text(countdown);
        // CSSは任意で
        if(countdown < 0){
            $('.count').css({
                color:'#ff0000',
                fontWeight:'bold'
            });
        } else {
            $('.count').css({
                color:'#000000',
                fontWeight:'normal'
            });
        }
    });
});
</script>

<!-- 略 -->

<b>Text内容</b>：<span class="count"></span>文字
<br><textarea name="memo_text" id="memo_text" cols="50" rows="10"></textarea>
```


↓実際の動きとしてはこんな感じです
![count.gif](https://qiita-image-store.s3.amazonaws.com/0/85815/c13d3592-e403-7beb-6d65-584aed11f59b.gif)

# CodePen

<p data-height="265" data-theme-id="0" data-slug-hash="JaZqKy" data-default-tab="js,result" data-user="sola-msr" data-pen-title="text count" class="codepen">See the Pen <a href="https://codepen.io/sola-msr/pen/JaZqKy/">text count</a> by sola-msr (<a href="https://codepen.io/sola-msr">@sola-msr</a>) on <a href="https://codepen.io">CodePen</a>.</p>
<script async src="https://static.codepen.io/assets/embed/ei.js"></script>
VMWare Fusion の Guest Linux にシリアル接続する



たまたま立ち上げた VM に仮想コンソールが無くて IP も分からないのでシリアルでコンソールにアクセスする方法。

## シリアルコンソールを作る

* なんでもいいので一つシリアルポートを作る。
* Virtual Machine > Setings... > Add Device... > Serial Port > Add...
    * とりあえずデフォルトで良い
    * Create a file to save the output of the virtual serial port
    * Save as: Untitled
    * Where: Virtual Machines
* シリアル出力を観察するだけなら、ここで出来たファイルを読むだけで十分。
* コマンド入力をしたいなら VM の vmx ファイルを直接編集して、ファイルの代わりに名前付きパイプにする。
    * 変更前
        * serial1.fileType = "file"
        * serial1.fileName = "xxxx/Untitled"
    * 変更後
        * serial1.fileType = "pipe"
        * serial1.fileName = "/tmp/serial1"

## Guest のシリアルを Mac の標準入出力に転送

VM を起動した後で、socat というプログラムで /tmp/serial1 と標準入出力を対応づける。

    socat /tmp/serial1 stdout

これでひとまず用はたせる。ifconfig などして IP を調べたりする。IP が分かって ssh 出来るなら下の screen は不要。

## Guest のシリアルに screen でアクセス

stdout だと、制御文字がそのまま表示されたり、何かと使いづらいので screen でコンソールにアクセスするには、まず socat で stdout ではなく pty に転送する。-d をつけるとその分デバッグメッセージが増える。

```
socat -d -d /tmp/serial1 pty
2018/01/11 18:05:05 socat[7475] N opening connection to LEN=14 AF=1 "/tmp/serial1"
2018/01/11 18:05:05 socat[7475] N successfully connected from local address LEN=16 AF=1 ""
2018/01/11 18:05:05 socat[7475] N successfully connected via 
2018/01/11 18:05:05 socat[7475] N PTY is /dev/ttys003
2018/01/11 18:05:05 socat[7475] N starting data transfer loop with FDs [5,5] and [6,6]
```

socat の出力を読むと /dev/ttys003 に割り当てられているようなので、そこに screen で接続する。

    screen /dev/ttys003

## 参考

* [Connecting to a Virtual Machine's Serial Console with OS X and VMware Fusion](https://thewayeye.net/2009/december/4/connecting-virtual-machines-serial-console-os-x-and-vmware-fusion/)
* [Linux on VMware でシリアルコンソールを使う方法](http://d.hatena.ne.jp/pyopyopyo/20120213/p1)
プログラマ5級【Moving Zeros To The End (ゼロを最後尾に移動)】このプログラミング問題があなたに解けるでしょうか！！

[【Codewars】ブラウザでコーディングの基礎からトレーニングできるサイト (ブラウザでvimが使えて32種類のプログラミング言語に対応。4000個以上の問題が投稿されています！)](https://qiita.com/javacommons/items/7c473cda7825ab99e08c) という記事で Codewars サイトを紹介させていただいたんですが、なんせ英語のサイトなので「問題が読めましぇーん」という方も少なくないと思いますので、簡単な(正答率の多い)問題から順に「問題文の日本語訳」を提示してみたいと思います。今回の問題も比較的簡単です。

尚、Codewars にサインアップしてなくても問題を解くことはできますので、上記記事をご覧になって操作方法についてご理解いただけたら、下記の「URL:」をクリックして問題のページに直接とんでください。IDE(解答)画面を開くには「TRAIN(トレーニングをする)」というボタンをクリックしてください。

**[Codewars](https://qiita.com/javacommons/items/7c473cda7825ab99e08c) はブラウザ上で(自分のマシンに開発環境がなくても)コード作成・デバッグ・(問題作成者が提供する)テストの実行ができて、「正解であるとお墨付きがもらえた時点で解答を提出できる」という特徴があります。(なので、ラクチンで安心です。また、[CodinGame](https://qiita.com/javacommons/items/86efba2d0ce6b2a21fb9) もその点は同じです)
また、本テストを含めてテスト実行でエラーとなっても一切ペナルティはありませんので、(ご自身の環境の方が開発しやすいという理由でなければ)、Codewars上(ブラウザ内)でがんがんテスト実行してみてくださいね。**

ご不明な点があったらコメントしてくださいませ。また、無事に SUBMIT できたら、是非とも自慢の解答(ソースコード)をコメント欄に貼り付け(投稿)してください。問題がサポートしている言語であれば、どのプログラミング言語を使っていただいても構いません。

問題の名称: Moving Zeros To The End (ゼロを最後尾に移動)
URL: https://www.codewars.com/kata/moving-zeros-to-the-end
対応言語: **CoffeeScript C# JavaScript Python (※Codewars の各問題は32種類のプログラミング言語のうちのいずれかに対応しています。問題毎に対応言語が異なります)**

![image.png](https://qiita-image-store.s3.amazonaws.com/0/140610/ea64f220-13c1-e5c6-8221-b8d880d53e0c.png)

# さて今回の問題文です。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/140610/2939293e-84c3-7973-371e-02b9513c01ca.png)

```:【上記問題文の日本語訳】
Write an algorithm that takes an array and moves all of the zeros to the end, preserving the order of the other elements.
配列を引数として取り、全てのゼロを最後尾に移動するアルゴリズムを記述してください。但し、他の要素の順番は保持するものとします。
```
```js:【サンプル】
moveZeros([false,1,0,1,2,0,1,3,"a"]) // [false,1,1,2,1,3,"a",0,0] を返す
```

# 今回の問題ももしかしたら簡単すぎなんでしょうね！

それでは！ｗ　次回をお楽しみに！！ｗｗ

# 問題文を日本語訳してみるプロジェクト！！ｗ (どんどん問題がチャレンジングになりますよ～！)

* [プログラマ8級【Even or Odd (偶数または奇数)】このプログラミング問題があなたに解けるでしょうか！！](https://qiita.com/javacommons/items/908d87efd41af6cece3d)
* [プログラマ5級【Moving Zeros To The End (ゼロを最後尾に移動)】このプログラミング問題があなたに解けるでしょうか！！](https://qiita.com/javacommons/items/f37ca062958267241b78)
* [プログラマ4級【Sum Strings as Numbers (文字列を数値として加算)】このプログラミング問題があなたに解けるでしょうか！！(Number.MAX_SAFE_INTEGER を超える正の整数値における和算器を実装しなさい)](https://qiita.com/javacommons/items/3434ffd780a512a880e8)
* [プログラマ4級【Valid Braces (括弧の妥当性チェック)】このプログラミング問題があなたに解けるでしょうか！！(XML/HTML/Lispソースパーザーの基礎テクニック)](https://qiita.com/javacommons/items/9cdd4fdbf6e74c7f106b)
gdbのリモートデバッグのextended-remoteモードを試す(3)

[前回](https://qiita.com/tetsu_koba/items/dd7c5a0beb7a8742d875)の続き。

#もっと単純に

前回の記事で、「修正された実行ファイルをターゲットに送信して、それを起動してデバッグを開始する」というのがgdb内で完結できることが確認できました。しかし、複数のコマンドを間違えないように実行しなければならないという問題がありました。

gdbの起動時間は(CUIで使用している限り)十分短いので、実行ファイルを更新したときには一度gdbを終了して、再度起動しても特にストレスには感じないですね。
それならば、実行ファイルをターゲットに送信して起動するためにコマンドは.gdbinit に書いておけばいい。

```:.gdbinit
set sysroot ../buildroot/buildroot-2016.05/output/host/usr/arm-buildroot-linux-gnueabi/sysroot/

target extended-remote 172.16.129.32:1234

file loop
remote put loop /root/loop
set remote exec-file /root/loop
start
```

デバッグ対象の実行ファイルはカレントディレクトリのloop
それをターゲットの/root/loop に転送する
それを実行開始して、main関数のところで停止。

#実際にやってみる

## ARM Linux側でgdbserverをmultiモードで起動する

```
ARM# gdbserver --multi :1234
Listening on port 1234
```

最初に一回行うだけですむはず。(gdbがハングアップしない限り)
デバッグ対象プロセスの標準出力、標準エラー出力がここに出るので、バックグランドで実行させるのでなくて、telnetやsshのttyをひとつ割り当てるのがよいでしょう。

## gdbから実行ファイルを転送して実行、デバッグ開始する

gdbに -q オプションをつけると起動メッセージが省略されます。

```
$ arm-buildroot-linux-gnueabi-gdb -q
Temporary breakpoint 1 at 0x10464: file loop.c, line 23.

Temporary breakpoint 1, main () at loop.c:23
23		func1();
(gdb) 
```
デバッグ対象プロセスがmain関数のところで止まっている状態です。
ARM Linuxのgdbserverでは以下のように表示されています。

```
Remote debugging from host 172.16.130.16
Process /root/loop created; pid = 488
```

## ステップ実行したり、バックトレースを確認したり

```
(gdb) step
func1 () at loop.c:7
7			func2();
(gdb) 
func2 () at loop.c:16
16		sleep(2);
(gdb) bt
#0  func2 () at loop.c:16
#1  0x0001045c in func1 () at loop.c:7
#2  0x00010468 in main () at loop.c:23
(gdb) 
```

## gdbを終了させるとデバッグ対象プロセスも終了する

```
(gdb) q
A debugging session is active.

	Inferior 1 [process 488] will be killed.

Quit anyway? (y or n) y
$
```
ARM Linuxのgdbserverでは以下のように表示されています。

```
Remote side has terminated connection.  GDBserver will reopen the connection.
Listening on port 1234
```

gdbserverは引き続き待機中。
ソースファイルを修正してビルドして実行ファイルを更新したら、再度gdbを起動すればよい。

これなら操作ミスでgdbが変な状態になることが防げる。これで十分。
リモートデバッグでありながら、ネイティブデバッグとあまり変わらない操作感。

#ToDo

ターゲットに転送する実行ファイルはstrip済みのものでよい。そのほうが実行ファイルのサイズがずっと小さくなるので転送時間が短くなる。
Makefileの中で、stripしてない実行ファイルとstrip済みの実行ファイルを両方作るようにして、.gdbinit もそれに合わせて修正する。
AWS(S3+CloudFront)でカスタム404ページの作成


サイト全体でのカスタム404設定という要件があったため、AWSコンポーネントのみで対応したときのメモ。

## 前準備
サイト全体は常時HTTPS対応していたため、[CloudFrontでS3のウェブサイトをSSL化する](https://qiita.com/jasbulilit/items/73d70a01a5d3b520450f)を参考にし、カスタム404ページを配置。
Route53の設定については割愛。

メモ書きのため以下を利用

* S3 Bucket Name
	* hoge.domain.jp
* CloudFront Domain Name
	* hogefoo.cloudfront.net
* 404 Page
	* 404.html

## S3設定
#### Static website hosting
このバケットを使用してウェブサイトをホストするを選択
以下の設定で、S3の

* インデックスドキュメント
	* 存在しないファイル名にしておく(hoge.htmlとか)
* エラードキュメント
	* 設定しない
* リダイレクトルール
	* 以下を記載

```リダイレクトルール
<RoutingRules>
  <RoutingRule><!-- S3で存在しないパスを見るとAccessDenied(403) -->
    <Condition>
      <HttpErrorCodeReturnedEquals>403</HttpErrorCodeReturnedEquals>
    </Condition>
    <Redirect>
      <HostName>hogefoo.cloudfront.net</HostName>
      <ReplaceKeyWith/>
    </Redirect>
  </RoutingRule>
  <RoutingRule>
    <Condition><!-- おまじない的に404定義 -->
      <HttpErrorCodeReturnedEquals>404</HttpErrorCodeReturnedEquals>
    </Condition>
    <Redirect>
      <HostName>hogefoo.cloudfront.net</HostName>
      <ReplaceKeyWith/>
    </Redirect>
  </RoutingRule>
</RoutingRules>
```

## CloudFront設定
#### General

* Default Root Object
	* 存在しないファイル名にしておく(hoge.htmlとか)
		* こうしておくことで、CloudFrontのRootにアクセス来た際に404になるため。

#### ErrorPage
Create Custom Error Responseで以下のHTTP Error Code二つを追加する。

* HTTP Error Code
	* 403: Forbidden
	* 404: Not Found
* Error Caching Minimum TTL (seconds)
	* 300(default)
* Customize Error Response
	* Yes
* Response Page Path
	* /404.html
* HTTP Response Code
	* 404: Not Found


## アクセス
Route53で上記CloudFrontを設定し、アクセスし、Status Codeなどのレスポンスを確認。

```
Status Code: 404 Not Found
X-Firefox-Spdy: h2
accept-ranges: bytes
age: nnnnn
content-length: nnnn
content-type: text/html
date: Thu, 11 Jan 2018 04:15:23 GMT
etag: "xxxxxxxxxxxxxxxxxxxxx"
last-modified: Wed, 10 Jan 2018 09:50:55 GMT
server: AmazonS3
via: 1.1 hogefoo.cloudfront.net (CloudFront)
x-amz-cf-id: xxxxxxxxxxx_xxxxxxxx==
x-cache: Error from cloudfront
```
ChromeからHTTP：Postのリクエスト,レスポンス内容を確認する

#概要
色々記事を参考にしたんだけど、Postの中身が見えない。

これとか
https://private.hibou-web.com/archives/5390

試してみても、たしかに一瞬見えるんだけど、Post後の画面遷移（リロード）直後にPostの中身がクリアされるので、見えない。
Ajaxのような画面が切り替わらない場合であれば、Postの中身が見える。

#設定方法
Preserve logというチェックボックスをオンにすれば、画面遷移前のログも残るので、
画面遷移させるようなPostでも、中身が見える！

<img width="554" alt="スクリーンショット 2018-01-11 17.31.36.png" src="https://qiita-image-store.s3.amazonaws.com/0/98082/f8c5e366-6732-285a-3650-6bd7cf216310.png">


気が向いたら、もう少しわかりやすく動画など貼ります。
プログラマ8級【Even or Odd (偶数または奇数)】このプログラミング問題があなたに解けるでしょうか！！

[【Codewars】ブラウザでコーディングの基礎からトレーニングできるサイト (ブラウザでvimが使えて32種類のプログラミング言語に対応。4000個以上の問題が投稿されています！)](https://qiita.com/javacommons/items/7c473cda7825ab99e08c) という記事で Codewars サイトを紹介させていただいたんですが、なんせ英語のサイトなので「問題が読めましぇーん」という方も少なくないと思いますので、簡単な(正答率の多い)問題から順に「問題文の日本語訳」を提示してみたいと思います。今回の問題は小手調べです。

尚、Codewars にサインアップしてなくても問題を解くことはできますので、上記記事をご覧になって操作方法についてご理解いただけたら、下記の「URL:」をクリックして問題のページに直接とんでください。IDE(解答)画面を開くには「TRAIN(トレーニングをする)」というボタンをクリックしてください。

**[Codewars](https://qiita.com/javacommons/items/7c473cda7825ab99e08c) はブラウザ上で(自分のマシンに開発環境がなくても)コード作成・デバッグ・(問題作成者が提供する)テストの実行ができて、「正解であるとお墨付きがもらえた時点で解答を提出できる」という特徴があります。(なので、ラクチンで安心です。また、[CodinGame](https://qiita.com/javacommons/items/86efba2d0ce6b2a21fb9) もその点は同じです)
また、本テストを含めてテスト実行でエラーとなっても一切ペナルティはありませんので、(ご自身の環境の方が開発しやすいという理由でなければ)、Codewars上(ブラウザ内)でがんがんテスト実行してみてくださいね。**

ご不明な点があったらコメントしてくださいませ。また、無事に SUBMIT できたら、是非とも自慢の解答(ソースコード)をコメント欄に貼り付け(投稿)してください。問題がサポートしている言語であれば、どのプログラミング言語を使っていただいても構いません。

問題の名称: Even or Odd (偶数または奇数)
URL: https://www.codewars.com/kata/even-or-odd

**※Codewars の各問題は32種類のプログラミング言語のうちのいずれかに対応しています。問題毎に対応言語が異なります。**

![image.png](https://qiita-image-store.s3.amazonaws.com/0/140610/426e2280-fab8-50cd-aa4f-25d45e9811af.png)


# さて今回の問題文です。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/140610/3778c6ee-5855-cc14-8461-91c76bc77830.png)


```:【上記問題文の日本語訳】
Create a function that takes an integer as an argument and returns "Even" for even numbers or "Odd" for odd numbers.
引数として整数を取り、偶数に対しては "Even" を、奇数に対しては "Odd" を返す関数を作ってください。
```

# サンプルテスト(データ)も参考にしてください

![image.png](https://qiita-image-store.s3.amazonaws.com/0/140610/f8ee82c9-9330-ae00-36ef-b13dfe477942.png)

```js:【サンプルテスト】
Test.assertEquals(even_or_odd(2), "Even")
Test.assertEquals(even_or_odd(0), "Even")
Test.assertEquals(even_or_odd(7), "Odd")
Test.assertEquals(even_or_odd(1), "Odd")
```

# 今回の問題は小手調べなのでおそらく簡単すぎでしょう！

それでは！ｗ　次回をお楽しみに！！ｗｗ

# 問題文を日本語訳してみるプロジェクト！！ｗ (どんどん問題がチャレンジングになりますよ～！)

* [プログラマ8級【Even or Odd (偶数または奇数)】このプログラミング問題があなたに解けるでしょうか！！](https://qiita.com/javacommons/items/908d87efd41af6cece3d)
* [プログラマ5級【Moving Zeros To The End (ゼロを最後尾に移動)】このプログラミング問題があなたに解けるでしょうか！！](https://qiita.com/javacommons/items/f37ca062958267241b78)
* [プログラマ4級【Sum Strings as Numbers (文字列を数値として加算)】このプログラミング問題があなたに解けるでしょうか！！(Number.MAX_SAFE_INTEGER を超える正の整数値における和算器を実装しなさい)](https://qiita.com/javacommons/items/3434ffd780a512a880e8)
* [プログラマ4級【Valid Braces (括弧の妥当性チェック)】このプログラミング問題があなたに解けるでしょうか！！(XML/HTML/Lispソースパーザーの基礎テクニック)](https://qiita.com/javacommons/items/9cdd4fdbf6e74c7f106b)
C#のジェネリックの型引数の制限条件にインターフェースが使えない

ジェネリックの型引数の制約条件にインターフェースを使ったら、

> Inconsistent accessibility: constraint type 'ISavable' is less accessible than 'ReactiveSavableList<T>' [Assembly-CSharp]

とのエラー。
コードは下記の通り

```c#
// ISavable
interface ISavable
{
  void Save();
}

// ReactiveSavableList
public class ReactiveSavableList<T> where T:ISavable
{
}
```

Interfaceはインスタンス化できない
→コンストラクタがprivate？
→ReactiveSavableListのpublicなコンストラクタとの間に、アクセシビリティのエラーが出ている？

と思ったので、下記の通りに修正したらエラー取れました。
以下、修正後のコード。

```c#
// ISavable
abstract public class ISavable
{
  public void Save()
  {
  }
}

// ReactiveSavableList
public class ReactiveSavableList<T> where T:ISavable
{
}
```

命名はAbstract◯◯みたいに変えると良さそうです。

※追記（2018-01-11 21:06）
上のエラーが出ているコードでも、interfaceをpublicにすれば解決します。
YuneKichiさんありがとうございました！
Googleスライドでパラメータを入力してシェイプを作成、変更したい

# 概要
Googleスライドでシェイプを作成するとき、サイズを指定して作ったり、表示しているシェイプの情報を取得して変更したくなる場合がありました。色々調べてみたのですが、スクリプトを使う方法しか見つからなかったため、操作性を考えて本記事で紹介させていただくようなスライド用アドオンとして作成しました。

# インストール方法
1. ブラウザでこちらのリンクへアクセスする。
    - [https://chrome.google.com/webstore/detail/shapeapp/nmbimbgfafgmkhioolneofjchigbpkhf](https://chrome.google.com/webstore/detail/shapeapp/nmbimbgfafgmkhioolneofjchigbpkhf)
1. 右上の「＋無料」青色ボタンをクリックする。
1. Googleのログイン画面が現れるのでログインする。
    - 「アプリの使用を開始」というダイアログボックスが表示されるので「続行」をクリックする。
    - 認証を行う。
1. アドオン -> ShapeApp -> Launch ShapeApp で起動する。

# 使い方
下記のデモンストレーションをご覧ください。

![demo.gif](https://qiita-image-store.s3.amazonaws.com/0/133383/7e8bafe1-dc2d-95c4-d0b0-d82f022dbbcf.gif)

# 詳細
詳細は[https://github.com/tanaikech/ShapeApp](https://github.com/tanaikech/ShapeApp)です。

もしも本記事が何かのお役に立てましたら幸いです。
PHPでパンくずリストHTML生成

色々なところを参考に作成したのでメモ書き

```function.php
	/**
	 * パンくず生成
	 *
	 * @param array $bread_crumns_list パンくずリスト
	 *     key => display_name 表示名
	 *     val => link 遷移先
	 */
	public function bread_crumns($bread_crumns_list) {
	    $item_position_num = 1;
	    $bread_crumns = "<ol itemscope='itemscope' itemtype='http://schema.org/BreadcrumbList'>\n";
	    foreach ($bread_crumns_list as $display_name => $link) {
	        $bread_crumns .= "<li itemprop='itemListElement' itemscope='itemscope' itemtype='http://schema.org/ListItem'>\n";
	        $bread_crumns .= "<a itemprop='item' href='{$link}'>";
	        $bread_crumns .= "<span itemprop='name'>{$display_name}</span>";
	        $bread_crumns .= "</a>\n";
	        $bread_crumns .= "<meta itemprop='position' content='{$item_position_num}' />";
	        $bread_crumns .= "</li>\n";
	        ++$item_position_num;
	    }
	    $bread_crumns .= "</ol>\n";
	    return $bread_crumns;
	}
```

使い方としては下記を参考にどうぞ

```view.php
	    $transition_list = [
            "TOP" => "/",
            "記事一覧" => "/posts",
            "記事" => "/post/1",
        ];
	    $bread_crumns = $this->bread_crumns_html($transition_list);
        print_r($bread_crumns);
```
Gun.js/GunDB - Realtime, Distributed, Offline-first, Graph

## Gun.js/GunDBとは？

[Gun.js/GunDB](http://gun.js.org/)は**これまでで最も簡単なデータベース**だそうです。端的に言うと以下のようなデータストアまわりの課題を解決するようです。

※以下の内容は公式に書かれていることと私が小一時間触っただけの体験をもとに書いてますので粗探しして事実と異なる点を見つけられる可能性は大いにありますので過信しないでください

### リアルタイム

データストアへの更新をクライアントがSubscribeできます。これは、[Firebase](https://firebase.google.com/)とか[PubNub](https://www.pubnub.com/)とか[Milkcocoa](https://mlkcca.com/)みたいな体験と同じです。これがオープンソースのデータストアで実現可能です。

### 分散

Gun.jsの初期化で以下のように複数のPeerを指定するだけでノード間のデータが同期されます。**NoDB**というコンセプトらしいですが、実際、LocalStorageに永続化したデータが勝手に複数のノードで同期されていく感じはDBがなくなったような体験でした。

```
var gun = Gun(['http://server1.com/gun', 'http://server2.com/gun']);
```
### オフラインファースト

上述の通り、何も意識しなくてもクライアントとサーバ間の同期をシームレスに実現できますので、オフライン時、ブラウザの場合はlocalStorage、Node.jsの場合はJSONファイルに永続化され、オンラインと同時に初期化時にPeerとして設定しているノードにデータが同期されます。

### グラフ

これは良く解らないですがグラフDBだってことですかね...？とりあえずデータ構造的に後方互換を強制されることはないということらしいです。

## IoTのShadow的なことを試してみる

AWS IoTのShadowみたいなことができそうなので試してみました（とりあえず今は時間ないのでHerokuとPCでやってみます）

### HerokuボタンでgunDBサーバを起動

[![Deploy](https://www.herokucdn.com/deploy/button.svg)](https://heroku.com/deploy?template=https://github.com/amark/gun)

### ローカルのPCに以下のスクリプトを書いて起動

```javascript:app.js 
var Gun = require('gun');
var gun = Gun('http://<Heroku App Host>/gun');

gun.get('key').get('led').on(function(data, key){
  console.log(data, key);
});
```
起動すると以下のような感じになります。

```shell
$ node app.js 
Hello wonderful person! :) Thanks for using GUN, feel free to ask for help on https://gitter.im/amark/gun and ask StackOverflow questions tagged with 'gun'!
WARNING! This `file.js` module for gun is intended for local development testing only!
```

### JSFiddleで即試す

[JSFiddle](https://jsfiddle.net/)で `External resources` に https://cdn.jsdelivr.net/npm/gun/gun.js を読み込んで手軽に試します。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/21109/7792dfd0-19ba-d03e-249d-ba8cd32fede6.png)

以下のJavascriptを書いて実行します。

```javascript
var gun = Gun('http://<Heroku App Host>/gun');

gun.get('key').get('led').put("on", function(ack) {
  console.log(ack);
});
```
PCのコンソールに以下のように表示されました。 `on` のとこを `off` に切り替えることでLEDをon/offしてるイメージですね。

```shell
$ node app.js 
Hello wonderful person! :) Thanks for using GUN, feel free to ask for help on https://gitter.im/amark/gun and ask StackOverflow questions tagged with 'gun'!
WARNING! This `file.js` module for gun is intended for local development testing only!
on led
off led
```
同じLAN内に接続したRaspberry PiのIPアドレスを調べる

LANケーブルやWiFiを使って同じローカルネットワーク内に接続したRaspberry PiのIPアドレスをターミナル(コマンドプロンプト)から調べる方法について説明します。

## XSHELLでは誰でもWelcomeの勉強会を行っています

本記事は[株式会社XSHELL](https://xshell.io/)が主催する勉強会の資料として作成されたものです。

[第2回 Raspberry Pi + カメラで画像認識IoTをやってみよう with おいしいものパーティ](https://atnd.org/events/93747)
[RASPBERRY PI + カメラで人物認識IOTをやってみた（勉強会レポート）](https://xshell.io/2017/12/iot-raspberry-pi-camera/)
[Raspberry Pi + Picamera でIoT体験を isaax でやってみよう](https://qiita.com/xshell/items/e6199c101d1fa497be94)

## Macの場合

IPアドレスを調べるコマンドはいくつかありますが、今回は`arp-scan`を使った方法について説明します。はじめに、`brew`を使って`arp-scan`をインストールします。

```
brew install arp-scan
```

実行するコマンドは次の通りです。

```
sudo arp-scan -l --interface en0
```

実行にあたって管理者権限が必要となるので`sudo`を付けます。`en0`の部分はRaspberry Piと同じローカルネットに接続しているネットワークアダプタを指定してください。`ifconfig`コマンドなどで調べることが可能です。

以下のような表示が出れば成功です。IPアドレス、MACアドレス、デバイス名が表示されます。

```
192.168.1.1    bc:5c:dc:ad:5f:ef   (Unknown)
192.168.1.10   b8:27:eb:22:23:08   Rasberry Pi Foundation
192.168.1.100  4f:5c:e2:12:65:cd   (Unknown)
```

## Linuxの場合

Macの場合と同様、arp-scanコマンドを使ってIPアドレスを調べます。パッケージマネージャから`arp-scan`をインストールしましょう。

```bash
sudo yum install arp-scan        # RedHat系
sudo apt-get install arp-scan    # Debian系
```

実行するコマンドは次の通りです。

```
sudo arp-scan -l --interface wlan0
```
実行にあたって管理者権限が必要となるので`sudo`を付けます。`wlan0`の部分はRaspberry Piと同じローカルネットに接続しているネットワークアダプタを指定してください。`ifconfig`コマンドなどで調べることが可能です。

以下のような表示が出れば成功です。IPアドレス、MACアドレス、デバイス名が表示されます。デバイス名が表示されない場合は、`b8:27`から始まるMACアドレスがRaspberry Piとなるので参考にしてください。

```
192.168.1.1    bc:5c:dc:ad:5f:ef   (Unknown)
192.168.1.10   b8:27:eb:22:23:08   Rasberry Pi Foundation
192.168.1.100  4f:5c:e2:12:65:cd   (Unknown)
```

## Windowsの場合

Windowsでは、コマンドプロンプトの`arp`コマンドを使った方法を紹介します。ソフトウェアのインストールは特に必要ありません。

```
for /l %i in (0,1,255) do ping -w 1 -n 1 192.168.1.%i
```

実行が終わるまでに1分程度かかります。`192.168.1.%i`の部分は接続しているローカルネットワークに合わせて変更してください(例えば、`172.20.0.1/16`の場合は`172.20.0.%i`にするなど)。このコマンドではローカルネットワーク内のIPアドレスに`ping`を実行してarpテーブルに記録しています。

次に、下記のコマンドを実行します

```
arp -a
```

以下のような表示が出れば成功です。IPアドレス、MACアドレス、Typeが表示されます。`b8:27`から始まるMACアドレスがRaspberry Piです。

```
192.168.1.1    bc:5c:dc:ad:5f:ef   dynamic
192.168.1.10   b8:27:eb:22:23:08   dynamic
192.168.1.100  4f:5c:e2:12:65:cd   static
```
【2018/6/15時点】EC-CUBEのSymfony検証ブランチで画面を表示させるまで

# 概要

EC-CUBEではSymfony検証が行われています。
簡単にインストールできるコマンドが用意されましたので記事を更新します。
[こちらのPR](https://github.com/EC-CUBE/ec-cube/pull/2861)と[こちらのPR](https://github.com/EC-CUBE/ec-cube/pull/2861)を参考にしました。


# 手順
1. [こちら](https://github.com/EC-CUBE/ec-cube)からEC-CUBEのリポジトリをclone
```git clone https://github.com/EC-CUBE/ec-cube.git```
1. ディレクトリを移動
```cd ec-cube```
1. `experimental/sf` のブランチをチェックアウト
```git checkout experimental/sf```
1. ec-cubeのインストールコマンドを実行。色々聞かれますが、そのままエンターでOK。
```bin/console eccube:install```
1. サーバの起動
```bin/console server:run```
1. ブラウザでアクセス
http://127.0.0.1:8000/

# DBごとのDATABASE_URL設定例

```
DATABASE_URL=sqlite:///%kernel.project_dir%/var/eccube.db
DATABASE_URL=postgresql://postgres@127.0.0.1:5432/eccube
DATABASE_URL=mysql://root:password@127.0.0.1:3306/eccube
```
【Git】SourceTreeで個人的なファイル/フォルダをバージョン管理から外す（ローカル版.gitignore）


# ローカルで自分だけの.gitignoreをつくる
※この方法で作成した.gitignoreはSourceTree上のすべてのプロジェクトに適用されるので要注意です。

## 1.まずローカル専用の.gitignore(gitignore_global)を生成する。
（今回はGit Bashで生成しました）

```
User@***** MINGW64 ~
$ pwd
/c/Users/User
  
User@***** MINGW64 ~
$ touch .gitignore_global
```
  
## 2.生成されたことを確認した後、SourceTreeを開き上部メニューの[ツール]->[オプション]を開く。  
  
![clip-20170721104937 (1).png](https://qiita-image-store.s3.amazonaws.com/0/85815/5ce28df9-c20b-5404-9d60-ea16257e2646.png)

  
## 3.グローバル無視リストに先ほどの.gitignore_globalのアドレスを入力  
  
![clip-20170721105458.png](https://qiita-image-store.s3.amazonaws.com/0/85815/cec6f12a-6857-0723-ed09-f5a0fe710ca3.png)
  
## 4.ファイル編集を開き、無視したいファイルを記述する。  
  
![clip-20170721105558.png](https://qiita-image-store.s3.amazonaws.com/0/85815/d1b50607-6c40-fc9f-9c0e-516fd44f6ac4.png)  

  
これで完了です。
念のため、SourceTree上で変更から対象のファイル/ディレクトリが消えたのを確認してください。
MQTTの基礎知識

## 概要

MQTTを使った開発をやる前にざっくりエッセンシャルな所を調べてみたよ、なメモ

## MQTT?

 TCP/IPのアプリケーション層に該当する軽量プロトコルで特徴としては
 
  - 軽量(ヘッダー最小2byte)
  - 双方向通信
  - TLS/SSL対応 (mqtts)
  - Pub/Sub型通信
  - Qos指定ができる(0~2)
  - BrokerがPublisherとSubscriberの中間に配置されてメッセージ配信を行う(中央集権型)
  - Retain(再接続時に接続が切れていた分を送信)/Will(切断時に切断されたメッセージを送る)

などがあり、上記の軽量・双方向通信可能な所から通信のオーバーヘッドが少ない、
消費電力が少なくても済む等、IoTの用途にあった通信方式と言われている。

商用利用の事例としてはFacebookMessagerなどがあげられる。

## MQTT Essentials

MQTTはコマンドとペイロードで構成される。
代表的なコマンドを書いてみる。

### コマンド

* CONNECT

接続確立

* SUBSCRIBE

トピックのサブスクライブすることを送信

* UNSUBSCRIBE

トピックのサブスクライブを解除

* PUBLISH

トピックにPUBLISHメッセージを配信
ブローカーを介して各サブスクライバに転送が行われる。

### ペイロード

* ペイロードについては特に細かい取り決め・フォーマットがない。（アプリケーション側の解釈に委ねる)
* 256MBまで

### Retain

トピックごとにメッセージを保持しておくことで
クライアントの接続が切れていた場合に再接続時に送信を行う。

### Will

事前に接続しておいたトピックに切断時にメッセージを送る機構。
異常終了の検知・フォローのトリガーが主なユースケース。

## 参考資料

[IBM社資料](https://www.ibm.com/developerworks/library/ws-mqtt/)
TFS のソース管理に Windows のエクスプローラーからアクセス


# TFS のソース管理に Windows のエクスプローラーからアクセス
以下ページから「Microsoft Visual Studio Team Foundation Server 2015 Power Tools」をダウンロード

[Microsoft Visual Studio Team Foundation Server 2015 Power Tools \- Visual Studio Marketplace](https://marketplace.visualstudio.com/items?itemName=TFSPowerToolsTeam.MicrosoftVisualStudioTeamFoundationServer2015Power)

![image](https://qiita-image-store.s3.amazonaws.com/0/49910/ca48cf1e-2b3f-9708-2571-f1ca3016c95b.png)

ダウンロードして実行。

## インストール
ダウンロードして実行。

![image](https://qiita-image-store.s3.amazonaws.com/0/49910/2c0ea2b7-667d-e967-29d1-3e3b6196ccc4.png)

Next、Nextを押していけばインストール開始される。

完了まで2,3分かかります。

完了ウィンドウに注意点が表示されています。ログオフするまでは機能が有効にならないようです。
![image](https://qiita-image-store.s3.amazonaws.com/0/49910/d038b6e5-5e3c-46e2-228a-32dad2e9854a.png)

<pre>
you have chosen to install the windows shell extension feature.
this feature will not be active until you log off and log on again.
a reboot may be required.
</pre>


## インストール後

ログオフ前の右クリックメニュー
![image](https://qiita-image-store.s3.amazonaws.com/0/49910/0d72b7e1-751a-23d2-c4e6-e07542e6105c.png)

ログオフ後の右クリックメニュー
![image](https://qiita-image-store.s3.amazonaws.com/0/49910/1b6dab14-0123-abb7-4b0e-bab58d46290d.png)
Project Euler Q62 【立方数置換】

Project Eulerをワンライナーで解いてみる。
間違っていたらコメントください。


## 問題
立方数 $41063625 (345^3)$ は, 桁の順番を入れ替えると$2$つの立方数になる: $56623104 (384^3)$ と $66430125 (405^3)$ である. $41063625$は, 立方数になるような桁の置換をちょうど$3$つもつ最小の立方数である.

立方数になるような桁の置換をちょうど$5$つもつ最小の立方数を求めよ.

## 解答

```bash
time seq 345 9999 |
awk '{print $1^3}' |
awk '{split($1,a,"");asort(a,b);for(i=1;i<=length(b);i++){printf b[i]};printf " "$0"\n"}' |
sort |
awk '{if(k!=$1){printf "\n"$0" "}else{printf $2" "};k=$1}' |
awk 'NF==6{print $2}' |
sort |
head -1
127035954683

real    0m0.287s
user    0m0.300s
sys     0m0.017s
```

「数字を並び替えて同じ」ということは「使用している数字を配列としてみて`sort`した結果が同じ」ということである。
なので、`sort`した結果をキーに横に並べたときに$5$個あるものを拾えばよい。

## 答え合わせ
こちらのサイト様と一致していればOKとした。
[Project Euler 62 _ 立方数置換 - PEをMathematicaで](http://variee.hatenadiary.com/entry/2017/05/16/201323)

## 参考にさせて頂いたサイト様
[asort = 配列の要素を並び替える（Gawk専用） - AWK - to_dk notebook](http://tounderlinedk.blogspot.jp/2010/09/asort-awk.html)
[ただのメモ] SQLAlchemy create_engine で No module named 'MySQLdb' エラー

# 環境
- macOS Sierra
- Python 3.6.3（pipenvからの仮想環境を雰囲気で使用）

# No module named 'MySQLdb' エラーでた

```shell-session
$ pipenv install SQLAlchemy
$ pipenv shell
bash-3.2$ python
>>> from sqlalchemy.engine import create_engine
>>> engine = create_engine('mysql://hoge:hoge@localhost/sampledb', echo=False)
Traceback (most recent call last):
  File "<stdin>", line 1, in <module>
  File "/Users/user/.local/share/virtualenvs/hoge-dVWIvnjK/lib/python3.6/site-packages/sqlalchemy/engine/__init__.py", line 419, in create_engine
    return strategy.create(*args, **kwargs)
  File "/Users/user/.local/share/virtualenvs/hoge-dVWIvnjK/lib/python3.6/site-packages/sqlalchemy/engine/strategies.py", line 80, in create
    dbapi = dialect_cls.dbapi(**dbapi_args)
  File "/Users/user/.local/share/virtualenvs/hoge-dVWIvnjK/lib/python3.6/site-packages/sqlalchemy/dialects/mysql/mysqldb.py", line 102, in dbapi
    return __import__('MySQLdb')
ModuleNotFoundError: No module named 'MySQLdb'
```

# mysql-python と mysqlclient
インターネッツに氾濫する情報から`mysql-python`というキーワードを得てインストールにチャレンジからの`ConfigParser`が見つからないエラー。

```shell-session
$ pipenv install mysql-python
Installing mysql-python…
Collecting mysql-python
  Downloading MySQL-python-1.2.5.zip (108kB)
    Complete output from command python setup.py egg_info:
    Traceback (most recent call last):
      File "<string>", line 1, in <module>
      File "/private/var/folders/t3/1nvj6g1x08n6yqmnrd4446_m0000gn/T/pip-build-tixjw71o/mysql-python/setup.py", line 13, in <module>
        from setup_posix import get_config
      File "/private/var/folders/t3/1nvj6g1x08n6yqmnrd4446_m0000gn/T/pip-build-tixjw71o/mysql-python/setup_posix.py", line 2, in <module>
        from ConfigParser import SafeConfigParser
    ModuleNotFoundError: No module named 'ConfigParser'
```

ふたたびインターネッツの海へ。

https://stackoverflow.com/questions/14087598/python-3-importerror-no-module-named-configparser

> アベさん「`ConfigParser`はPython3で`configparser`に名前かわったから、そのパッケージはPython3をサポートしてなそう」
> 読み方わからない名前のひと「`mysql-python`からフォークされた`mysqlclient`がPython3サポートしてるからそれ使え」

```shell-session
$ pipenv install mysqlclient
Installing mysqlclient…
Collecting mysqlclient
  Downloading mysqlclient-1.3.12.tar.gz (89kB)
Building wheels for collected packages: mysqlclient
  Running setup.py bdist_wheel for mysqlclient: started
  Running setup.py bdist_wheel for mysqlclient: finished with status 'done'
  Stored in directory: /Users/user/Library/Caches/pip/wheels/df/bb/60/bf7c315cbe163515db1c846e4ffa5557dd785c82e82f3492e8
Successfully built mysqlclient
Installing collected packages: mysqlclient
Successfully installed mysqlclient-1.3.12
```

再チャレンジ。

```shell-session
$ pipenv shell
bash-3.2$ python
>>> from sqlalchemy.engine import create_engine
>>> engine = create_engine('mysql://hoge:hoge@localhost/sampledb', echo=False)
>>> print(engine)
Engine(mysql://hoge:***@localhost/sampledb)
```
AWS CLI Tips

よく使うCLIコマンドをサービス毎にまとめ

# S3
## Bucket一覧
```console
$ aws s3 ls
```
## Sync Local to Bucket
```console
$ aws s3 sync path_on_local s3://[bucket_name]/path_on_bucket
```

# Lambda
## Lambda Function一覧
```console
$ aws lambda list-functions
```
## Lambda Functionをアップロード
```
$ aws lambda update-function-code \
  --function-name arn_of_lambda_function \
  --zip-file fileb://path_to_zip
```

# 外部サイト
[[公式]AWS CLI Command Reference](https://docs.aws.amazon.com/cli/latest/reference/index.html#cli-aws)
Twitterシェアボタンの設置

（2019年6月追記）

本記事はTwitter公式のシェアボタン設置方法をまとめたものですが、この実装だと読み込みのスピードが遅くなります。SEO的な観点を踏まえると、もう少し工夫して実装したほうがよいかもしれません。

---

多くの方の記事があったが、Twitter公式のコード生成ツールから作った記事はあまり見当たらなかったのでメモ。
（注意）２０１８年１月時点の情報です。

## Twitter公式のコード生成ツールへ飛ぶ
https://publish.twitter.com/#
以下までスクロール。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/227168/97526b03-313b-55dd-1279-0d89f0cc8137.png)

## Twitter Buttones をクリック

![image.png](https://qiita-image-store.s3.amazonaws.com/0/227168/1d847ce0-ce69-dddb-6933-ef9e314ad994.png)

## （以下からは用途に応じてですが単純なツイートボタンの生成を前提として）最左部の Share Buttonをクリック

![image.png](https://qiita-image-store.s3.amazonaws.com/0/227168/2036885b-572a-861a-1465-9e9b40b4c2a4.png)

Copy Code　をクリック

### コードの詳細
aタグとscriptタグで構成。直後に置くようにコード生成されるが、scriptタグは同htmlファイル上であればどこにおいても問題ない。

```html:TwitterButtonSource.html
<a href="https://twitter.com/share?ref_src=twsrc%5Etfw" class="twitter-share-button" data-show-count="false">Tweet</a>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
```
## 設置方法
Tweetボタンを設置したい場所に以下を挿入。scriptタグ部分は、既述の通りの場所に入れる。

```html:index.html
<div class="twitter">
　<a href="//twitter.com/share" class="twitter-share-button" data-text="<!-- ここにTweetしたときにデフォルトでいれておきたい文字列を入れる -->" data-url="<!-- ここにTweetしたときに入れたいURLを入れる -->" data-lang="ja<!-- 日本語の場合 -->">
 Tweet
 </a>
</div>
```
### シェアボタンのパラメタについての詳細
公式ドキュメントを参照（English）→https://dev.twitter.com/web/tweet-button/parameters
【ただのメモ】htmlのタグ内のテキストを変更する

#CMSで自動作成されるHTMLをJavaScriptで強制的に書き換えるために書いたコード
##①htmlのソース（今回はthタグの数字を書き換える）
```html:html
<!DOCTYPE html>
<html>
<head>
  <title>JavaScriptで強制的にテキストを書き換える</title>
</head>
<body>
<table>
  <tbody>
    <tr>
      <th class="number">2</th>
    </tr>
    <tr>
      <th class="number">3</th>
    </tr>
    <tr>
      <th class="number">4</th>
    </tr>
    <tr>
      <th class="number">5</th>
    </tr>
    <tr>
      <th class="number">6</th>
    </tr>
  </tbody>
</table>
</body>
</html>
```
##②数字を書き換えるためのJavaScript（今回は１引いた値に変更）
```javascript:javascript
var childObj = document.getElementsByClassName("number");
var childList = Object.keys(childObj).map(function(key){return childObj[key]});
(function(){
  childList.forEach(
    function(value){
      var a = parseInt(value.innerText);
      value.innerText = a - 1;
    }
  );
})();
```
mochaでテストを同期的（直列）に実行する

# 背景
mochaでは一つのdescribeの中に直列にテストを実行する方法があります。それは、いろいろ解説があるので、ここでは触れないことにします（[公式](https://mochajs.org/#asynchronous-code)）。

つまり、すべてのテストを一つのdescribeの中に押し込んでやれば、同期的ににテストを動かすことはできるわけです。ただ、それだと本来のmochaの恩恵を受けられません。

一応、[serial-mocha](https://www.npmjs.com/package/serial-mocha)というライブラリはあるのですが、mochaそのものを置き換えるものなので、karmaとの接続とか、いろいろ考えるのが面倒。そこで、標準のmochaのままで、テストを同期的に実行する方法はないかと考えてみました。

# 結論
```js
import AsyncLock from "async-lock";
const asyncLock = new AsyncLock();
const lock = (key) => {
  return new Promise(fulfilled => {
    asyncLock.acquire(key, done => {
      fulfilled(done);
    });
  });
};

describe("#1", () => {
  let done = null;
  let commonResource = null;
  before(async () => {
    done = await lock();
    // ここに共通の初期化処理を書く
    commonResource = await CommonResource();
  });
  it("test1", async () => {
    // テスト１（非同期可）
  });
  it("test2", async () => {
    // テスト１（非同期可）
  });
  after(async () => {
    // ここに共通の解放処理を書く
    await commonResource.close();
    done();
  });
});
```

# 解説

async-lockは、コードが同時に複数回開始されないようにロックする仕組みを提供します。この、async-lockでロックの解放を通知するためのコールバックを、Promiseとして受け取れるようにしたのが、lockという関数です。

そもそも、一つのdescribeに含まれる、複数のitは、（適切に書けば）直列に実行されるので、最初のbeforeで、ロックし、最後のafterで解放すれば、期待通りの結果が得られます。

ちなみに、itを非同期的に実行できれば、良いのですが、それをしようとすると、itが呼ばれないまま、テストが終了してしまいます。つまり、describeの中身は、itのように非同期的に実行する手段がありません。describe / itが同期的に実行されるというのは仕様上いかんともしがたいようで、それを前提にすると、上のようにinit / closeの中で、ロック/解放するという方法しか取れないことになります。

# 高度な利用

上のコードでは、lock()というように、lockに何も渡していませんが、lock('A'), lock('B')のようにキーを設定すると、異なるキーが設定されたテストは、非同期的に（並列に）実行されるようになります。

# 感想

letが気持ち悪い。けど、serial-mochaとか使うより、ずっとシンプルで良いと思う。
Wikipedia（日本語版）全文データをテキストファイルへ変換

書籍「Pythonniよるスクレイピング＆機械学習」（ソシム社）の第６章内で、Wikipedia(日本語版）の全文データを辞書データとして利用する箇所がある。しかし、多少情報が古いせいか、現在ではそのまま操作してもうまくインストールできなかった。
インストール時にハマったので、次回以降のためにメモを残す。

### 実行環境：
MacbookPro(Retina, MID 2012)
Docker 17.12.0-ce-mac46 (21698)上に
・Ubuntu 16.04 LTS
・Anaconda 1.6.5
・Python 3.6.3 :: Anaconda custom (64-bit)

### 目的：
Word2Vecで利用するWikipedia（日本語版）全文データをテキストファイルに変換する。

## Step1.
目的のデータ（Wikipedia（日本語版）全文データ）をダウンロードする。

対象（となる圧縮ファイルの）URL：
https://dumps.wikimedia.org/jawiki/latest/jawiki-latest-pages-articles.xml.bz2

### 方法：

```bash:shell-script
$ wget https://dumps.wikimedia.org/jawiki/latest/jawiki-latest-pages-articles.xml.bz2
```

### 参考：
【 wget 】 ファイルをダウンロードする：ITpro http://itpro.nikkeibp.co.jp/article/COLUMN/20060228/230995/?n_cid=nbpitp_twbn_top

※同書では、ダウンロード後にbzip2コマンドで圧縮ファイルを展開するように書かれていますが、後ほどデータ変換に使用するwp2txtの--input-fileオブションの引数には、そのまま.bz2ファイルを引き渡して良いと書いてあるので、ここでは展開せず、.bz2ファイルのままにしておきます。

## Step2.
Wikipedia（日本語版）データ（XML）をテキストデータ（.txt）へ変換する。
そのために必要となるツール「wp2txt」は、Ruby製なので、先にRubyをインストールします。

```bash:shell-script
$ apt-get install -y git
$ git clone https://github.com/sstephenson/rbenv.git ~/.rbenv
$ git clone https://github.com/sstephenson/ruby-build.git ~/.rbenv/plugins/ruby-build
$ echo 'export PATH="$HOME/.rbenv/bin:$PATH"' >> ~/.bash_profile
$ echo 'eval "$(rbenv init -)"' >> ~/.bash_profile
$ source ~/.bash_profile
$ rbenv install 2.3.0
$ rbenv global 2.3.0
```

※rbenvはRubyのバージョン管理ツールで、任意のバージョンのRubyを選んで使えるようになります。同書では、Ruby 2.0.0-p647というバージョンを使っていますが、これだと失敗します。参考にしたサイト（http://jabberwocky.hatenablog.com/entry/2016/11/12/061709）
によると、このバージョンでは「wp2txt」は使用できないらしい。同サイトに書かれている通り、Ruby 2.3.0をインストールすることにした。

## Step3.
Wikipedia（日本語版）データ（XML）をテキストデータへ変換するツール「wp2txt」をインストールする。

```bash:shell-script
$ gem install wp2txt
```

※gemはRubyのパッケージ管理ツール（PythonのpipやLinuxのapt-getみたいなもの？）

## Step4.
Wikipedia（日本語版）データをテキストファイルへ変換します。

```bash:shell-script
$ wp2txt --input-file jawiki-latest-pages-articles.xml.bz2
```

<img width="1151" alt="スクリーンショット 2018-01-11 14.38.38.png" src="https://qiita-image-store.s3.amazonaws.com/0/112430/aa13f1d1-b1f8-b4ed-86d4-e8281568a1e7.png">

ちなみに、返還前の.bz2データのサイズが約2.2GBで、変換後の.txvデータが約5.6GB以上になるため、変換には１時間半以上かかりました（当社調べw）。

## Step5.
変換後には500以上のテキストファイルへ分割されるため、それを以下のコマンドで1つのファイルにまとめます。

```bash:shell-script
$ cat jawiki-latest-pages-articles.xml-* > wiki.txt
```

以上で、Wikipedia（日本語版）全文データのテキストファイル化、完了！
不均衡データ　アルゴリズム比較まとめ

不均衡データを調整するアルゴリズムは複数あるが、比較論文があったので読んでみた。
備忘録になります。

Bunkhumpornpat, Chumphol, Krung Sinapiromsaran, and Chidchanok Lursinsap. "DBSMOTE: density-based synthetic minority over-sampling technique." Applied Intelligence 36.3 (2012): 664-684.

https://link.springer.com/article/10.1007/s10489-011-0287-y

一応各手法まとめ

SMOTE
少ない方のデータをKNNを用いて、近接データで増やす。

ADASYN
マイノリティーデータの分布にそった形でKNNを使いながら増やす。
人工的に増やすデータもSMOTEみたいに指定するわけではなく、推測して増やす。

Border SMOTE
境界のデータを増やす事によって、クラス分類をしやすくする。

Safe-level SMOTE
Border SMOTEは境界、SMOTEはKNNで場所に依存はしない。しかし
Safe-level SMOTEは境界といってもSafe-levelを計算し、Safe-levelの
値によってマイノリティのデータを増やしていく。

DBSMOTE
クラスタリングアルゴリズムDBSCANを用いて、KNNではなくてデータをマイノリティ
側を増やしていく方法


F-valueとAUCが最も改善していたのは、DBSMOTE　ADASYNは比較されていない。
LaravelのorWhere


https://laravel.com/docs/5.5/queries#where-clauses

```
DB::table('users')
            ->where('name', '=', 'John')
            ->orWhere(function ($query) {
                $query->where('votes', '>', 100)
                      ->where('title', '<>', 'Admin');
            })
            ->get();
```

```
select * from users where name = 'John' or (votes > 100 and title <> 'Admin')
```
Windows 10に.NET Framework 3.5がインストールできない場合の解決方法


開発のWindows 10に入れるソフトが.NET Framework 3.5に依存しているのですがインストールできず0x800f081fエラーが出たので、それを解決した方法です。
Windowsのインストールメディアから入れる方法（[参考](https://qiita.com/decobisu/items/acf0499ab1b7d251a112)）もありますが、うまくいかなかったのでこちらの方法を取りました。

# 方法

1. 「グループポリシーエディタ」を開く
  - 「ファイル名を指定して実行」から「gpedit.msc」を実行
1. 左ペインから「コンピュータの構成」->「管理用テンプレート」->「システム」を選択
1. 右ペインから「オプションコンポーネントのインストールおよびコンポーネントの修復のための設定」を指定するを開く
1. 「有効」を選択
1. 「Windows Server Update Services(WSUS)の代わりに、Windows Updateから修復コンテンツとオプションの機能を直接ダウンロードする」にチェック
1. 「適用」をクリック

あとは通常通り、コントロールパネルからWindows機能の有効化または無効化で.NET Framework 3.5を有効にすればOKです。
WindowsにVSCodeのPHP開発環境を構築

## 1. WindowsにPHP 7 実行環境を構築

* [こちら](http://windows.php.net/download)のサイトから VC15 x64 Thread Safe の Zipをダウンロード
* 上記ファイルを解凍し、php にリネーム後に "C:\\Program Files\\php" に保存
* php フォルダ配下の php.ini.productionを php.iniに変更
* 環境変数の設定から "C:\\Program Files\\php" を追加する
* コマンドプロンプトで以下のコマンドを入力し確認

```
C:\Windows\System32>php -v
PHP 7.2.1 (cli) (built: Jan  4 2018 04:00:25) ( ZTS MSVC15 (Vi
 )
Copyright (c) 1997-2017 The PHP Group
Zend Engine v3.2.0, Copyright (c) 1998-2017 Zend Technologies
```

## 2. VSCode にPHP Intellisense をインストール

* [こちら](http://www.elp.co.jp/staffblog/?p=5620)を参考にインストール
* VSCodeの「ファイル」 -> 「基本設定」 -> 「設定」から settings.jsonを表示
* 「ワークスペースの設定」に以下を追加

```
{
    "php.validate.executablePath": "C:\\Program Files\\php\\php-win.exe",
    "php.executablePath": "C:\\Program Files\\php\\php-win.exe",
    "php.suggest.basic": false
}
```

* VSCodeを再起動して上部に表示される内容の「許可」を押すと完了

## 参考文献

1. Visual Studio Code で快適な PHP コーディングを行う _ エレパ スタッフブログ, http://www.elp.co.jp/staffblog/?p=5620, Online; accessed 11-January-2018.
ActiveRecordのカラム名を大文字にすると躓く

Railsでモデルを作成する場合、テーブルのカラム名を大文字にしてしまうと
動かないわけではありませんが、定数と判断されるようで挙動が変わる点がありました。

# 小文字で作った場合

まずbookモデルを作る

```
rails g model Book title:string
```

マイグレーションでテーブルを作成

```
rails db:migrate
```

モデルにtitleを表示するだけのメソッドを追加

```ruby:book.rb
class Book < ApplicationRecord
  def print_title
    p title
  end
end
```

コンソールで動作確認します。

```ruby
irb(main):007:0> book = Book.new title: "hoge-book"
=> #<Book id: nil, title: "hoge-book", created_at: nil, updated_at: nil>
irb(main):008:0> book.print_title
"hoge-book"
=> "hoge-book"
irb(main):009:0> book.title
=> "hoge-book"
```

なんも問題ないですね


# 大文字で作った場合

bookモデルを作りますがカラムを大文字にします。

```
rails g model Book Title:string
```

マイグレーションでテーブルを作成

```
rails db:migrate
```

モデルにTitleを表示するだけのメソッドを追加

```ruby:book.rb
class Book < ApplicationRecord
  def print_title
    p Title
  end
end
```

コンソールで動作確認します。

```ruby
irb(main):003:0> book = Book.new Title: "hoge-book"
=> #<Book id: nil, Title: "hoge-book", created_at: nil, updated_at: nil>
irb(main):004:0> book.print_title
NameError: uninitialized constant Book::Title
        from app/models/book.rb:4:in `print_title'
        from (irb):4
irb(main):005:0> book.Title
=> "hoge-book"
```

`book.Title`は問題なく呼び出せましたが、`book.print_title`はエラーになりました。

カラムを定義するとActiveRecordがカラム名に対応したメソッドを定義するようで
小文字の場合は`title`、大文字の場合は`Title`というメソッドがそれぞれ存在します。
インスタンスメソッド内からそれらを呼び出そうとした時、小文字の場合は**変数もしくはメソッド**を探しに行きますが
大文字の場合は**定数**を探しにいってしまい、`Title`というメソッドが存在いていても`NameError: uninitialized constant Book::Title`となってしまいます。

また、`self.`をつけて明示してあげると参照できるようになります。

```ruby:book.rb
class Book < ApplicationRecord
  def print_title
    p self.Title
  end
end
```

```ruby
irb(main):002:0> book.print_title
"hoge-book"
=> "hoge-book"
```

## Squeelもコケる

[Squeel](https://github.com/activerecord-hackery/squeel)でも以下のようにすると`NameError: uninitialized constant Book::Title`となります。

```ruby
Book.where { Title.like "#{value}%" }
```

標準のやり方でやるしかないですね。

```ruby
Book.where('Title like ?', "#{value}%")
```

# そもそも
カラム名は小文字のスネークケースを使いましょう。
レールから外れると痛い目を見ます。

今回は既存のデータベースを利用するシーンで命名規則に沿っていなくて痛い目見ました。
pingツールを作った

# はじめに
ping監視ツール的なものを漁っていたら[deadman](https://github.com/upa/deadman)というツールを見つけた。 
ちょっと古かったので参考にしてpython3で自分でも作ってみた。

![demo.gif](https://qiita-image-store.s3.amazonaws.com/0/165966/1046ce82-c959-7410-c107-15abb1849a91.gif)

本家deadmanはマルチスレッドで実装してるみたいだったけれど、とりあえずシングルスレッドで実装

# インストール
pypi経由でインストール

```bash
$ pip install ppping
```

github経由でインストール

```bash
$ pip install git+https://github.com/johejo/ppping.git
```

# 使い方

```bash
$ ppping hoge.com fuga.jp WW.XX.YY.ZZ
```

詳しいオプションは--help

# UI
古より伝わりし[curses](https://docs.python.jp/3/library/curses.html#module-curses)

# ロジック
- [subprocess](http://docs.python.jp/3/library/subprocess.html)でpingコマンドを実行して、結果を~~無理やり力技で~~パース
- 整形して表示

# 工夫

## pingコマンドの実行エラーへの対処
存在しないホスト等をpingで実行するとstderrにエラーが表示されてそれがcursesの画面に割り込んでくる

stderrにDEVNULLを指定してエラーを無視

```py3
out = subprocess.run(['ping', host, '-c1'], check=True, stdout=subprocess.PIPE,
                     stderr=subprocess.DEVNULL, timeout=self.timeout).stdout.decode()
```

## 見た目
合間に```time.sleep(INTERVAL)```をいれることでなんかかっこよさげに見える


## ホストやIPアドレスの長さが変わってもUIを~~無理やり~~調整

- ~~ドキュメントによると```cureses.window.getmaxyx()```で画面サイズが取得できるっぽい~~ v0.1.3でこの調整機能は削除しました。
- 取得したホスト名の長さの最大値を保存して再利用

# 今後
configファイル読み込み対応
2018/1/12 v0.1.4にて対応しました。

# リポジトリ
[johejo/ppping: Petty Plain Ping](https://github.com/johejo/ppping)
Project Euler Q61 【巡回図形数】

Project Eulerをワンライナーで解いてみる。
間違っていたらコメントください。


## 問題
三角数, 四角数, 五角数, 六角数, 七角数, 八角数は多角数であり, それぞれ以下の式で生成される.
三角数　$P_{3,n}=\frac{1}{2}n(n+1)$　$1, 3, 6, 10, 15, ...$
四角数　$P_{4,n}=n^2$　$1, 4, 9, 16, 25, ...$
五角数　$P_{5,n}=\frac{1}{2}n(3n-1)$　$1, 5, 12, 22, 35, ...$
六角数　$P_{6,n}=n(2n-1)$　$1, 6, 15, 28, 45, ...$
七角数　$P_{7,n}=\frac{1}{2}n(5n-3)$　$1, 7, 18, 34, 55, ...$
八角数　$P_{8,n}=n(3n-2)$　$1, 8, 21, 40, 65, ...$

$3$つの$4$桁の数の順番付きの集合 $(8128, 2882, 8281)$ は以下の面白い性質を持つ.

1.この集合は巡回的である. 最後の数も含めて, 各数の後半$2$桁は次の数の前半$2$桁と一致する
2.それぞれ多角数である: 三角数 $(P_{3,127}=8128)$, 四角数 $(P_{4,91}=8281)$, 五角数 $(P_{5,44}=2882)$ がそれぞれ別の数字で集合に含まれている
3.$4$桁の数の組で上の$2$つの性質をもつのはこの組だけである.

三角数, 四角数, 五角数, 六角数, 七角数, 八角数が全て表れる$6$つの巡回する$4$桁の数からなる唯一の順序集合の和を求めよ.

## 解答

```bash
time seq 999 |
awk '{print $1*($1+1)/2,$1^2,$1*(3*$1-1)/2,$1*(2*$1-1),$1*(5*$1-3)/2,$1*(3*$1-2)}' |
awk '{for(i=1;i<=NF;i++){if(length($i)==4){print i+2,$i,substr($i,1,2),substr($i,3,2)}}}' |
awk '{v[NR]=$0} END{for(k in v){for(j in v){print v[k],v[j]}}}' |
awk '$1!=$5' |
awk '$4==$7{print} $8==$3{print $5,$6,$7,$8,$1,$2,$3,$4}' |
sort -u |
awk '{v[NR]=$0} END{for(k in v){for(j in v){print v[k],v[j]}}}' |
awk '$1!=$9&&$1!=$13&&$5!=$9&&$5!=$13' |
awk '$8==$11{print} $16==$3{print $9,$10,$11,$12,$13,$14,$15,$16,$1,$2,$3,$4,$5,$6,$7,$8}' |
sort -u |
awk '{v[NR]=$0} END{for(k in v){for(j in v){print v[k],v[j]}}}' |
awk '$16==$19&&$26==$2&&$30==$6' |
awk '$17!=$1&&$17!=$5&&$17!=$9&&$17!=$13' |
awk '$21!=$1&&$21!=$5&&$21!=$9&&$21!=$13' |
sort |
head -1 |
awk '{print $2+$6+$10+$14+$18+$22}'
28684

real    0m23.533s
user    0m33.766s
sys     0m3.445s
```

これは何をやっているか記載するのが難しいのですが、
1.まず三角数～八角数をリストアップ
2.同じ角数にならないように総掛け
3.巡回になっているものを抽出(この段階で$2$連続になる)
4.上記の2.と3.をもう一度やる(この段階で$4$連続になる)
5.更にもう一度やる(この段階で$8$連続になる)
6.$6$連続部分までで三角数～八角数が表れている　かつ　巡回になっているものを抽出

ということをやっています(日本語が下手ですみません)。

総掛けのロジックがいい案を思いつかなかったので`awk`の`END`で二重ループするということになってしまいました。

## 答え合わせ
こちらのサイト様と一致していればOKとした。
http://kingyojima.net/pje/061.html
input type="date"を使った日付入力フォーム

日付を入力するフォームとしてselectタグで1〜12月、1〜31日を選択させるサイトが多く見受けられるが、日付専用の&lt;input type="date"&gt;を使っているところは少なかったので試しに使ってみた。

#実際に書いてみる
```html
<input type="date">
```
![11.17.jpg](https://qiita-image-store.s3.amazonaws.com/0/228428/8d998ce3-bb70-4f30-17b9-cf2ce27ae921.jpeg)
試しに表示させてみた。
Firefoxではこのように表示される。
カレンダーから日付をクリックして選択できるのが特徴。

ただ、初期値がyyyy/mm/ddとアルファベットの表記になっているため、慣れないユーザーが困惑しそうだ。

#初期値の設定
初期値を決めるためにはvalue属性を使う。

```html
<input type="date" value="2018-01-11">
```
![Screenshot-2018-1-11 無題ドキュメント.png](https://qiita-image-store.s3.amazonaws.com/0/228428/fe6ab399-a040-9f8c-6731-88d3174e28d9.png)
yyyy-mm-ddの形式で書く。
これで見た目はOKだ。
ここには日付を入力するのだろうという予測がつく。

でも、初期値が固定であるのも変だ。
やっぱりそのページを開いたときに合わせた日付を表示させたい。

#初期値を今日の日付にする
JavaScriptでフォームの初期値を今日の日付にしてみる。

```html:form.html
<input type="date" name="today" id="today">
```
```javascript:today.js
function () {
    var today = new Date();
    today.setDate(today.getDate());
    var yyyy = today.getFullYear();
    var mm = ("0"+(today.getMonth()+1)).slice(-2);
    var dd = ("0"+today.getDate()).slice(-2);
    document.getElementById("today").value=yyyy+'-'+mm+'-'+dd;
}
```
ポイントは3つ

+ getYear()は非推奨であること
+ getMonth()は0〜11までの整数値を取得すること
+ 01月のように頭に0をつけること

getYear()と名前が名前なので使えそうに思うが最大で1999年までしか数値を返してくれないのでとっくに使えなくなっている。
getFullYear()を使おう。

getMonth()は1〜12月を0〜11の数字で返す少し変わったメソッドだ。
仕方がないので、0〜11の数字に+1して1〜12月という表示になるようにしている。

十の位が0の月日は一桁の数字で得られるが、欲しいのは二桁の数字だ。
文字列として頭に0をつけてから下二桁を取得している。

#応用:翌日の日付にする
これが意外と簡単。
getDate()+1と書くと、たとえ月が変わってもしっかり処理してくれる。
※例えば1/31→2/1となる
昨日の日付にしたいなら-1とする。

```html:form.html
<input type="date" name="tomorrow" id="tomorrow">
```
```javascript:tomorrow.js
function () {
    var tomorrow = new Date();
    tomorrow.setDate(tomorrow.getDate()+1); //翌日の日付を取得
    var yyyy = tomorrow.getFullYear();
    var mm = ("0"+(tomorrow.getMonth()+1)).slice(-2);
    var dd = ("0"+tomorrow.getDate()).slice(-2);
    document.getElementById("tomorrow").value=yyyy+'-'+mm+'-'+dd;
}
```
![Screenshot-2018-1-11 無題ドキュメント(1).png](https://qiita-image-store.s3.amazonaws.com/0/228428/2298d168-3c48-637d-0fdc-39668124d6a8.png)

#最後に
そもそもこのtype="date"は、IEとsafariが対応してなかった。
(2018/01/11時点)
>![Screenshot-2018-1-11  input type= date .png](https://qiita-image-store.s3.amazonaws.com/0/228428/6e3db2bd-9622-83fb-fa5f-fe292fc562c7.png)

使うのであれば対応してないブラウザに対して例外の表示をする必要がある。


#参考サイト
- [&lt;input type=&#34;date&#34;&gt; - HTML | MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/date)
- [【Javascript】追記：input=&quot;date&quot;に現在の日付（今日の日付）を設定 - ワカログ -Wakalog-](http://wakalog.hatenadiary.jp/entry/2017/11/12/210608)