OmniAICreator/Qiita-1.07M huggingface dataset:
Python > work = [1 for x in geoStdev] はwork = [1] * len(geoStdev)でいいだろうか? | 処理時間の計測

```txt:動作環境
GeForce GTX 1070 (8GB)
ASRock Z170M Pro4S [Intel Z170chipset]
Ubuntu 16.04.4 LTS desktop amd64
TensorFlow v1.7.0
cuDNN v5.1 for Linux
CUDA v8.0
Python 3.5.2
IPython 6.0.0 -- An enhanced Interactive Python.
gcc (Ubuntu 5.4.0-6ubuntu1~16.04.4) 5.4.0 20160609
GNU bash, version 4.3.48(1)-release (x86_64-pc-linux-gnu)
scipy v0.19.1
geopandas v0.3.0
MATLAB R2017b (Home Edition)
ADDA v.1.3b6
gnustep-gui-runtime v0.24.0-3.1
```

https://github.com/bsumlin/PyMieScatt/blob/master/PyMieScatt/Mie.py#L454

```py
      gamma = [1 for x in geoStdDev]
```

gammaにgeoStdDevの要素数分1を代入しているようだ。

リスト内表表記である必要性がわからない。

```set1_180405.py
# on Python 3.5.2

geoStdev = [0.3, 0.1, 0.4, 0.1, 0.5]

# case 1
work = [1 for x in geoStdev]
print(work)
print([id(x) for x in work])

# case 2
work = [1] * len(geoStdev)
print(work)
print([id(x) for x in work])

```

```shell-session
$ python3 set1_180405.py 
[1, 1, 1, 1, 1]
[10919424, 10919424, 10919424, 10919424, 10919424]
[1, 1, 1, 1, 1]
[10919424, 10919424, 10919424, 10919424, 10919424]
```

identityについてはcase 1とcase 2ともに同じ。

### 関連

- @shiracamus さんの[コメント](https://qiita.com/7of9/items/ee23d7a4ada181c484ea#comment-07445e0eb08146de0834) @ [Python3 + Numpy > 5列の要素を持つ二次元リストから１列だけ取出す > PyMieScatt実装(内包表記) | np.array(lists)[:, 2:2+1].flatten() > よりシンプルな書き方](https://qiita.com/7of9/items/ee23d7a4ada181c484ea#comment-07445e0eb08146de0834)
- [python > array > 個数を決めて初期化する > mylist = [idx for idx in range(10)] / mylist = [0 for idx in range(10)] >> mylist = [0] * 10](https://qiita.com/7of9/items/586f62fa46dc3409d954)


### 処理時間の計測
(追記 2018/04/07)
@hidekuro さんのコメントをもとに、Jupyter Notebookで速度を測定してみました。

```py:performance_listComprehension_180407.ipynb
%%timeit

# on Jupyter Notebook (IPython 6.0.0 -- An enhanced Interactive Python. Type '?' for help.)
# Python 3.5.2

geoStdev = [0.3, 0.1, 0.4, 0.1, 0.5]
# case 1
work = [1 for x in geoStdev]
```

結果: `311 ns ± 6.29 ns per loop (mean ± std. dev. of 7 runs, 1000000 loops each)`

```py:performance_listComprehension_180407.ipynb
%%timeit

# on Jupyter Notebook (IPython 6.0.0 -- An enhanced Interactive Python. Type '?' for help.)
# Python 3.5.2

geoStdev = [0.3, 0.1, 0.4, 0.1, 0.5]
# case 2
work = [1] * len(geoStdev)
```

結果: `203 ns ± 1.21 ns per loop (mean ± std. dev. of 7 runs, 1000000 loops each)`

後者の方が速いようではあるが、要素数を変えた時には異なる結果になるかもしれない。

```py:performance_listComprehension_180407.ipynb
%%timeit

import numpy as np

# on Jupyter Notebook (IPython 6.0.0 -- An enhanced Interactive Python. Type '?' for help.)
# Python 3.5.2

geoStdev = np.random.rand(10000)
# case 1
work = [1 for x in geoStdev]

```

結果: `398 µs ± 21.6 µs per loop (mean ± std. dev. of 7 runs, 1000 loops each)`

```py:performance_listComprehension_180407.ipynb
%%timeit

import numpy as np

# on Jupyter Notebook (IPython 6.0.0 -- An enhanced Interactive Python. Type '?' for help.)
# Python 3.5.2

geoStdev = np.random.rand(10000)
# case 2
work = [1] * len(geoStdev)
```

結果: `83.5 µs ± 297 ns per loop (mean ± std. dev. of 7 runs, 10000 loops each)`

numpy ndarrayに対する処理と、Pythonリストに対する処理の違いについては未確認。
Visual Studio CodeでC言語/C++デバッグ時に変数の値を16進数で表示する

# はじめに

Visual Studio CodeでC言語/C++をgdbを使ってデバッグするときに，char変数の値を確認しようとすると数字や記号，アルファベットなど表示可能な文字の場合は10進数表記とその文字が表示されます．また制御文字や128以上の値の場合には10進数表記と8進数表記が表示されます．

<img width="612" alt="image.png" src="https://qiita-image-store.s3.amazonaws.com/0/45310/4be06e55-7336-1530-abc3-a3e13863fa71.png">

文字データを扱っているときはこれで見やすいのですが，例えば通信電文など文字コードでなく単純なByteデータをchar変数に入れている時などには16進数で表示されると見やすいので，方法を調べました．

# 解決方法

ウォッチ式に`<変数名>,h`と指定すれば16進数で表記されます．これでByte配列のデータの確認なども見やすくなりました．

<img width="612" alt="image2.png" src="https://qiita-image-store.s3.amazonaws.com/0/45310/25b406f1-e132-3078-e5e3-262ed220e26e.png">

charに限らずint変数などもこの方法で16進数で表示されます．
git --amendする際の注意点

git pushした時のエラー 

```
$ git branch branch_name
$ git add file_name
$ git commit -m “test”
$ git push -u origin branch_name
$ git commit —amend
=> test2
$ git push -u origin branch_name
==>error
```

問題点
1回目のpush時にローカルの状態がリモートに反映された。
—amendコマンドでcommitメッセージを書き換えた際に
commit自体のidも新しいものに書き換わり、
1回目のcommitとは全くの別物になった。

=>`git log`コマンドでcommitの履歴を見ると番号が違うことが確認できると思います。

なので2回目のcommitpush時に1回目の整合性が取れずにエラーが起きてしまった。

解決方法
amendした後のpushに-fオプションを付けて強制的に上書きする。
`$ git push -u -f origin branch_name`

結論
—amendはpushする前にするのが無難だが、
push後でも修正できないことはない。
gulp+typescriptでソースマップがvscodeに認識されない時の確認点

「未確認のブレークポイント 生成されたコードが見つからないのでブレークポイントが無視されました(ソースマップの問題？)」
 ![image.png](https://qiita-image-store.s3.amazonaws.com/0/5825/9909a037-36ea-27d7-8efe-51edb49ae9b3.png)
というメッセージが表示された時の確認点についてまとめました。

以下の質問の回答を参考にさせて頂きました。ありがとうございます。
[Node\.js \- Visual Studio Codeでtypescriptのsourcemapが認識されない\(119984\)｜teratail](https://teratail.com/questions/119984)

サンプルプロジェクトは以下のgithubで公開中

https://github.com/fushihara/gulp-typescript-sourcemap

# 確認点

* `.vscode/launch.json`の`outFiles`属性

launch.jsonのoutFiles属性の指定に、コンパイル後のjsファイルが含まれている事が重要です。
program属性にかかれているファイルはoutFiles属性に含まれなくてもソースマップが効くので、index.jsの1ファイルだけで挙動を確認しているとここで引っかかります。
このoutFiles属性の書き方ですと、outの子フォルダのjsファイルは引っかからずに 孫フォルダのjsのみ引っかかるように見えますが、ちゃんと子フォルダのjsファイルもoutfilesに含まれます。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/5825/92e5d8eb-b6b5-7c99-178a-7c0798a6268a.png)

* `gulpfile.json`の`gulpSourcemaps.write`で`sourceRoot: '.'`を指定する

gulpfile.jsonの中で'gulp-sourcemaps'モジュールを使う時、writeメソッドの第二引数のオプションに`sourceRoot`属性を指定する必要があります。
この引数を指定しないと、launch.jsonのprogram属性のjsファイルと異なるディレクトリのファイルはソースマップが効かなくなります。これも引っかかりポイント。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/5825/4d777df8-f21e-0c8a-ca2f-66db488f27ee.png)

sourceRoot属性を指定する事でjs.map のソースマップファイルに`sourceRoot`という属性が追加されます。

# githubコードの挙動

## 一般的なnodejsアプリ

一般的なnodejsアプリ、jsファイルをエントリーポイントとして起動します。
このプロジェクトを開き、a.tsとb.tsの中の関数にブレークポイントをセットし「node実行」というlaunch設定を実行して下さい。ブレークポイントが適切に動作している事が確認出来ます。
[gulp\-typescript\-sourcemap/gulp\+ts\-cli at master · fushihara/gulp\-typescript\-sourcemap](https://github.com/fushihara/gulp-typescript-sourcemap/tree/master/gulp%2Bts-cli)

![image.png](https://qiita-image-store.s3.amazonaws.com/0/5825/040324d1-b86f-b6e3-0fdd-31202269cc1c.png)

![image.png](https://qiita-image-store.s3.amazonaws.com/0/5825/e0e8a1d5-78c3-0aba-21a6-8df68e496df2.png)


## nodemonを使って、自動的に再起動される

gulpのnodemonを使ったプロジェクトです。この場合、監視下のファイルが更新されると再コンパイルが走るのでプロセスが終了してしまいます。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/5825/b9658f9f-4502-3469-ba80-db29fdc87490.png)

その場合は、プロジェクトを開いた後に結合ターミナルを開き、手動でgulpを実行します。これはプロジェクトを開く時に一度だけでOK。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/5825/845794d2-75e6-6802-5458-20610e06abbf.png)

そしてlaunch.jsonでattachリクエストを指定します。ここでポート番号を手動で指定する所と、restart属性がある所が重要です。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/5825/7e2a4959-9566-69fb-95fc-cf43586a3c4e.png)

その後launchを実行し、localhost:29285 を開くとブレークポイントが効いていることが確認できます。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/5825/84c48887-eee2-18f6-a206-1ef89bed50c8.png)

nodemon監視下のファイルが更新された時も、自動的にプロセスのアタッチが再接続されます。

ここを把握したら、visual studio codeでブレークポイントが効かない！という事が無くなるかも。
nowについて

#はじめに
[WSL(Ubuntu)でnode.jsの開発をする準備](https://qiita.com/knockout103/items/a9669fe05d2e235a45cb)で作ったものを動かす方法を調べていたら、「now」っていうのがよさそうなので、調べてみたメモ。

##nowってナニモノ?
nodejsやdocker用のホスティングサービス。コマンドで簡単にデプロイしてWebサービスを動かせる。便利！

【参考】

 - https://qiita.com/nkzawa/items/8bf62549f79ebbcaafd8
 - https://codeiq.jp/magazine/2017/10/54570/

OSSライセンスだと、3インスタンスまで動かせるらしい。（Web上は月20個、って情報もあるけど20個動かせなかった。）

#nowの導入
npmコマンドで導入。

```
$ npm i -g now
```

# nowを動かす
## デプロイする

プロジェクトのディレクトリでコマンドたたくだけ。
 
```sh
$ now
```

初回はメールアドレスが聞かれる。入力したメールアドレスへ認証メールが届き認証するとデプロイされる。

デプロイ中にURLが表示される。デプロイごとに新しいURLが出来ていく仕組みのよう。

## インスタンスを停止する
前述のとおり、OSSライセンスは3インスタンスしか動かせない。
手軽にバンバンコマンドを打っていると、すぐに「動かせるインスタンスがないよ」って怒られる。

そんな時は以下の手順でインスタンスを停止する。

まずは起動中のインスタンスを確認 

```sh
$ now ls
```

でもって、消したいインスタンスを指定してコマンド実行 

```sh
$ now rm <URL>
```

お手軽ですね！

#さいごに
node nodejs Nodejs Node.jsと色々表記があるけど、どれが正しいのかな？
python3で競技プログラミングするときのTipsまとめ



#この記事の役割
競技プログラミングを始めたばかりの人（自分）が、必要な情報をまとめたものです。何度も同じ情報をググるのは面倒なので一括にまとめました。言語はpython3系列です。

#Tips

##入力待ち
```py
a = input()
```
入力されたものを変数aに格納します。

##分割
```py
b = a.split()
c = a.split(" ")
```
aに複数の値が一行で与えられている場合、split()で分割します。()内で分割する文字を指定できます。

##文字列を整数に変換する
```py
d = int(a)
```
inputで与えられている変数は文字列なので、intで整数に変換します。

##複数の値をintに変換して格納する
```py
e = list(map(int, a.split()))
```
mapを使うと複数の変数を同時に扱えます。
listを使うことでリスト型のオブジェクトを生成します。
##range関数
```py
range(最初の数値, 最後の数値+1 (, 数値の幅))
```
for文などで一個一個の数字に対して何か操作をしたいときに使います。

##数字の有効桁数を指定する
```py
"{0:.5f}{1}".format(a,b)
```
{}のなかに0,1,2,...と入力すると、format()のなかの変数の値が順番に代入される。また、このとき":"以降に.1f,.2f,..と書くと、小数点以下1,2,..桁で扱われる。

##print文の区切り文字を指定する
```py
print(a, b)
>>>a b
print(a, b, sep=":")
>>>a:b
```
print関数の末尾にsep=で区切り文字を指定できる。

##リスト型に要素を追加する
```py
a.append(b)
```
()の中にリストを指定することも出来る。
その場合はリストの中にリストが入り、入れ子になる。

##改行なしの出力
```py
print("hoge", end="")
```

#今後
随時引っかかったところから追記していきます。
WSL(Ubuntu)でnode.jsの開発をする準備

#はじめのはじめに（2018/4/7 追記）
<font color="Red">
この記事は古いです。
aptを使ってインストールしたら、nodejsのバージョンが古かったので入れなおしました。
[こちら](https://qiita.com/knockout103/items/37f4598f2ac32ba7cf0c)でnodebrew経由のインストール手順を記載しています。
初心者でごめんなさい。
</font>

#はじめに
node.jsを触ってみようと思った。（何も知らない）
手元にwindows10の環境しかない。
そんな中で調べて環境構築した作業メモ。

##環境

- Windows10 Pro 1709
- WSL on Ubuntu

なお、WSLのUbuntuは導入済みの前提。

#npmって何？
いろいろ調べると、「npm」ってコマンドを使うらしい。
npmは「Node Package Manager」で、その名の通りパッケージを管理するコマンド。
nodeで作られたパッケージを依存関係を見つつインストールやアンインストール、リスト表示などできる。pythonのeasy_installやrubyのgemみたいなものらしい。

【参考】http://phiary.me/node-js-package-manager-npm-usage/

パッケージを入れるコマンドは以下のようにすればよい。
/usr/local/libにパッケージが入るので、sudo必要。

```
$ sudo npm i -g パッケージ
```

#aptで導入
aptでパッケージを入れる。最初「npm」を入れていろいろやっていたら、「node-legacy」もいるって言われたので、こんな感じ？（node-legacyだけでいいのかな？）

```
$ sudo apt install npm node-legacy
```
#nodejsのプロジェクトを作成する
package.jsonというファイルを作る必要があるらしい。

ワークディレクトリで以下のコマンドをたたくと作ってくれる。-yをつけないと、インタラクティブにいろいろ聞かれる。
```
$ npm init -y
```

準備はここまで。
初心者エンジニアが初心エンジニアに勧める、「タイポグラフィカルエラー」対策



人はミスを犯す生き物と言いますが、
僕はその能力に関しては**他の追随を許さない**才能を持っています。

そんな僕がエンジニアとしてアプリの開発を試みるのは
いささか無謀かもしれません。

**だって、コードはたった一文字間違えただけで動かないんですから・・・**


##タイポグラフィカルエラーとは


「タイポグラフィカルエラー」、
略して**「タイポ」**です。

文字の入力ミスで、コードが動かないことです。

あるエラーのために２時間、３時間、

ネットをさまよい、技術書のページを行き来して、
改めて見直すとタイポだったときのあの悲しみと怒り。


先輩エンジニアに、
「どうしてもこのコードでエラーが起こって・・・」
とアドバイスを求めた結果タイポだったときのあの空気。

経験したことありませんか？



ヒューマンエラーなので、
完全になくすことができるかどうかはわかりませんが、
先輩エンジニアに**素敵な対策**を一つ教えてもらいました。



##タイポ対策：コードを見やすく書くこと

僕でも知っている、コーディングに関する名著、

「リーダブルコード」にも、その内容を貫く「良いコードの定義」として
同じようなことが言われていました。

僕はそれを知っていたはずなのに、そうしませんでした。

タイポに出会って、見やすいコードを書く重要性にやっと気づき、
自分のコードが**「読みづらい」**と自覚したからです。


##初心者でもすぐできる、見やすいコードの書き方##


といっても、

僕にできることは

- [ ] ブロックとブロックの間に空白を開けること
- [ ] 長いコードは改行して見やすくすること
- [ ] インデント(コードの列）を見やすく整えること

**最初はこんな簡単なことでいいんですって。**

逆に、こんな簡単なことすら僕はやっていなかったわけです。
反省・・・

上記の３つのポイントを意識するだけでも、

タイポが発生したときに
**どの部分がタイポか発見しやすくなりました！**



もしあなたも僕と同じようにタイポを恐れ、憎んでいるなら、
見やすいコードを書いて、タイポで時間を無駄にしないようにしましょう！

こちらのサイトで見やすいコードを書くノウハウが紹介
されているので、ぜひ実践してください！

http://www.be-webdesigner.com/tips/coding/indent.htm



読んでいただいて、ありがとうございました:pray:
Spirit: アニメーションオーサリングツール

# Spirit

Adobe Flash、AnimateCCライクにtimelineでDOMオブジェクトのアニメーションを作ることができるツールです。

公式ページ上でさわりだけ体験することができます。

https://spiritapp.io/

2016/7に開発が発表され、登録した人限定公開でbeta版が2017末にリリースされました。
僕も登録していたので、beta版を使えるようになっていたんですが、
色々忙しくて <del>サボっていて</del>最近ようやく触ったので紹介したいと思います。

# ハンズオン

## ツール
必要なものはこちらです。

- Mac
- Chrome
- [Spirit: Chrome Extensipon](https://chrome.google.com/webstore/detail/spirit/dnhkiomddidldcdpcfhdaifabjpipgmk)
- Spiritアプリ

Spiritアプリはbeta登録した人に届くメールに同梱されています。
また、Spiritアプリと連携させるため、Chrome Extensionだけを入れても使えません。
おそらく今でもpostすれば使えるようになると思うので、興味ある方は是非やってみてください。

## 弄ってみる

SpiritはChromeで開いているwebページのDOMにアタッチしてアニメーションを作成します。

まずは動かしたいDOMがあるページを開きます。
今回は矢印で示してるロゴを弄っていきます。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/12060/0164d908-0888-740e-2787-36341d4baf79.png)

次はChrome拡張の可愛いおばけボタンを押しましょう。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/12060/99b965d5-2594-1cd8-840e-cb72a433def2.png)

こういうウィンドウが開きます。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/12060/721056b2-88ce-bb20-11b9-a87eb2fdc214.png)

Add Group を押します。
さらにSelect ElementでDOMをマウスで選択します。
![hoge.gif](https://qiita-image-store.s3.amazonaws.com/0/12060/ae28deb0-fc2b-ae88-7a87-1d92336bb14c.gif)

するとこういうtimelineのウィンドウが立ち上がります。
これを弄って、アニメーションを加えていきます。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/12060/aad29846-a91d-f1b5-e7e4-8d134f6d6e3e.png)

アニメーションは多くの種類があるんですが、
ここでは分かりやすいものをざっくり紹介していきます。

### Visibility
透明のtweenです。

![alpha.gif](https://qiita-image-store.s3.amazonaws.com/0/12060/cd3cefe8-b4ad-309c-1a57-af60016db634.gif)

### move
座標位置です。
x,yだけでなく、z座標もあるみたいです。
htmlぅって感じがします。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/12060/07cfaad5-e549-e822-7e96-6e9a727f8aa6.png)

### rotate+scale
こちらは回転と拡縮を組み合わせました。
こういう風に組み合わせて複雑なアニメーションを作ることも可能です。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/12060/736d6bb8-4425-6904-ffd5-299f8278cf91.png)

他にも色々あります。
詳しくはここを参照ください。
https://docs.spiritapp.io/app_property.html

## エクスポート

作成したアニメはjsonファイルとしてExportすることができ、
spirit.jsをロードしているhtml上で再生することができます。

https://docs.spiritapp.io/app_import_export.html

<p data-height="265" data-theme-id="0" data-slug-hash="LdJRzm" data-default-tab="html,result" data-user="junpayment" data-embed-version="2" data-pen-title="spirit-demo" class="codepen">See the Pen <a href="https://codepen.io/junpayment/pen/LdJRzm/">spirit-demo</a> by jun (<a href="https://codepen.io/junpayment">@junpayment</a>) on <a href="https://codepen.io">CodePen</a>.</p>
<script async src="https://static.codepen.io/assets/embed/ei.js"></script>

## ドキュメント
https://spiritapp.io/getting-started#ExportProduction
https://docs.spiritapp.io/

## 最後に
このように、サクッとweb上で確認しながらアニメーションを作るツールです。
timelineで操作するツールとしてはAnimateCCにも引けを取らないのでは無いでしょうか？

編集対象はあくまでもDOMで、
Export先で動く対象もDOMのため、canvasなどへの転用は今の所難しいと思います。
個人的な印象としては、メインコンテンツをこれで作るというより、
インタラクティブなボタンなどのUIを作ったりするのに向いてるかもしれません。

本リリース後にどういった料金体制になるのかはまだ不明ですが、
面白いツールなので、皆さんもどしどし使ってみてください。
星の軌跡のような描画をCanvasで実装してみた。

<blockquote class="twitter-video" data-lang="ja"><p lang="ja" dir="ltr">続編。変更点は<br>・描画開始位置をランダムに<br>・線の太さをランダムに<br>・スタート、ストップ、リセット機能を追加 <a href="https://t.co/f4lCrw9uLN">pic.twitter.com/f4lCrw9uLN</a></p>&mdash; らいと (@moshi1121) <a href="https://twitter.com/moshi1121/status/981575484910661632?ref_src=twsrc%5Etfw">2018年4月4日</a></blockquote>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

訳があって、ゆるキャンΔOPのパロディ動画を作成することになりまして。OPチェックしていたところ、サビ前に富士山と星の軌跡が描かれている部分がありました。
これを作らなければいけないと考えたところ、**めんどくさいなパラメータ**がみるみる上昇してきまして。
**だったら、JavaScriptでコード書いてCanvasに描いたほうがよくない！？**となったのがきっかけです。

```html:rotation_stars.html
<!DOCTYPE html>
<html lang="ja">
<head>
	<meta charset="UTF-8">
	<title>rotating_stars</title>
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
</head>
<body>
	<div>
		<canvas id="canvas_area" width="1280" height="720"></canvas>
	</div>
	<input type="button" value="開始" onclick="drawStart();"/>
	<input type="button" value="停止" onclick="drawStop();"/>
	<input type="button" value="リセット" onclick="drawReset();"/>

	<style type="text/css">
		#canvas_area{
			background-color: #313CA3;
		}
	</style>
	<script>

		var c = $("#canvas_area")[0];
		var ctx = c.getContext("2d");

		var stars = [];
		var speed = 0.5;

		var CENTRAL_AXIS = { X:950, Y:230 }
		var MIN_RADIUS = 10;
		var MAX_RADIUS = 1100;
		var MIN_LINE_WIDTH = 0.1;
		var MAX_LINE_WIDTH = 2;

		function randRange(min, max){
			return Math.floor(Math.random() * (max - min + 1) + min);
		}

		function generateStar(){
			stars.length = 0;
			var Stars = function(){
				this.radius = randRange(MIN_RADIUS , MAX_RADIUS);
				this.lineWidth = randRange(MIN_LINE_WIDTH , MAX_LINE_WIDTH);
				this.startAngle = randRange(0, 360) * Math.PI / 180;
				this.endAngle = this.startAngle;
			}
			for(var i = 0; i < 300; i++){
				stars.push(new Stars());
			}
		}

		function drawStar(){
				$.each(stars, function( i, val){
					ctx.beginPath();
					ctx.arc(CENTRAL_AXIS.X , CENTRAL_AXIS.Y , val.radius, val.startAngle, val.endAngle, false);
					ctx.strokeStyle = "#C2E9FF";
					ctx.lineWidth = val.lineWidth;
					ctx.stroke();
					ctx.closePath();
					val.endAngle += speed * Math.PI / 180
				});
		}

		function draw(){
			ctx.clearRect(0,0,1280,720);
			drawStar();
		}

		function drawStart(){
				clearInterval(loop_draw);
				loop_draw = setInterval(draw, 10);
			}

		function drawStop(){
			clearInterval(loop_draw);
		}

		function drawReset(){
			drawStop()
			ctx.clearRect(0,0,1280,720);
			generateStar();
			x = 0;
		}

		generateStar();

		var loop_draw = setInterval(draw, 10);
	</script>
</body>
</html>

```
memo諸々

#memo

##パリティピッド

1の数が偶数か奇数かによって、末尾につけるビットのこと。

010 → 0101

1011010 →10110100

1の数が偶数になるように末尾に0or1をつける。

これだと誤りを検出できても、誤りを訂正することはできない。

そこで、3ビットずつに各行にわけ、各列各行に対して、パリティピッドをつけることによって、誤りを検出し、訂正することができる。
リバースプロキシによるSSL-VPN通信と、リバースプロキシするHTTPS通信の違い

# **はじめに**

例えば、DMZ上にあるサーバを経由して、内部ネットワーク上にあるサーバにアクセスするWebアプリケーションを考える上で、

- リバースプロキシによるSSL-VPN通信
- リバースプロキシするHTTPS通信

は何が違うのでしょうか？
一見、リバ－スプロキシ型のSSL-VPNとは、HTTPS通信をリバースプロキシで変換しているだけのようにも感じられます。

何をもってSSL-VPNであると言えるのか。
通常のHTTPS通信はSSL-VPNといって良いのか。
まずはVPNとは何かというところから理解すると良さそうです。

# **VPNに必要なこと**

VPNとは、Virtuial Private Networkの言葉どおり、パブリックな環境でも仮想的なプライベートネットワークが実現できるものです。

このとき、プライベートであるということは、

- ネットワーク通信が秘匿されること
- 誰でもアクセスできるものではないこと

を意味します。また、どのようなプロトコルでもVPNを使えるためには、

- 利用したいプロトコルの実装に制限されないこと
 
も必要になります。

まとめると、VPNに必要な要件として、

**①暗号化**
**②認証**
**③カプセル化**

これら３つが行われている状態でしか、プライベートネットワークにアクセスできない、という環境であればVPNと言えそうです。

では、リバースプロキシ型SSL-VPNと、リバースプロキシするHTTPS通信ではそれぞれどういう扱いでしょうか？


## リバースプロキシ型SSL-VPN
①SSLによる暗号化
②パスワードや電子証明書などによるVPN装置との認証
③SSLによるカプセル化
が行われているので、確かにVPNであると言えそうです。

## リバースプロキシするHTTPS通信
①SSLによる暗号化
③SSLによるカプセル化
は満たしていると言えそうです。ただし、
②認証
を伴わないため、SSL-VPNとは異なるものになります。

認証の必要性について書いている資料が少なく、
整理に苦労しましたが、やっとモヤモヤが晴れました。

# **疑問点**

これで定義としての違いは明確になりました。ただ、実装を考える上ではまだ疑問が残ります。

##ECサイトのようにユーザー認証を行うサイトなら、SSL-VPNと言えるのか？

Noです。
確かに、一見「ログイン認証を行わなければ利用できないアプリケーション」の仕様にすれば、近い扱いにはなると思います。
ただし、そのようなアプリで認証するときは、「プライベートなネットワーク上にあるDBサーバにアクセスしてユーザ認証している」ことになると思います。
これは先の、
>次の３つが行われている状態でしか、プライベートネットワークにアクセスできない

を満たせていませんので、SSL-VPNではない、ということになります。


##では認証のためのユーザ情報をDMZ上のWebサーバに持たせればSSL-VPNといえるのか？

これは一応Yesになりそうです。
ただしアプリで使う認証情報をDMZに置いたら危険、という別の問題が発生するので、

1.アプリ用の認証とVPNを確立するための認証は別（クライアント証明書など）にする。
2.DMZ上はリバースプロキシ専用サーバとして、Webサーバ以下は内部ネットワークに実装する。
 
などの工夫が必要であると考えられます。
読みたい記事

# javascript全般
## jQueryオブジェクトの裏側をのぞいてみよう！
http://dqn.sakusakutto.jp/2012/05/jquery-object-inside.html

## Javascriptが世界を支配する日
http://dqn.sakusakutto.jp/2012/04/javascript_14.html

# jQuery
## jQueryのソースコードを読むための参考サイト２０選
http://dqn.sakusakutto.jp/2012/05/jquery-sourcecode-reading.html

## jQueryのeachの仕組みを徹底的にわかりやすく解説してみた。
http://dqn.sakusakutto.jp/2012/05/jquery_each_call.html

# ライブラリ・フレームワーク
## 【Redux入門】 React + Redux の考え方を理解する
http://okakacacao.wpblog.jp/technology/what-is-redux#jQuery

## vue.js
https://frontendmasters.com/courses/advanced-vue/
勤怠入力のブックマークレット

# 環境
この記事の内容は以下の環境で実施しました

```
OS
 OS X 10.12.6
ブラウザ：
 Google Chrome
バージョン：
 65.0.3325.181
```

# なんの話？
毎日「いついつまで会社にいて、何分休憩した」とか入力するやつです
自己申告のタイムシートって言うんですかね
それを毎日ブラウザから入力するのめんどくさいなーって

# どういうこと？

働き方によって様々だと思いますが私の場合

1. ブラウザから毎日勤務時間を記入
1. 月末に印刷して管理者にサインをもらう
1. それを再度電子化して取引先に送付

この「ブラウザから毎日勤務時間を記入」というのがズボラな私にはちょっとメンドくさいんですよ。

今の現場ですと、ありがたいことにほぼ毎日定時で上がれる状態なので
毎日同じ時間と内容を記入しているんですね。
これはメンドい。
やりたくない。

でもあまり時間をかけたら本末転倒なので手短に済ませたい。

# どうする？

ブックマークレット書いた

```javascript
javascript:(function(){ $(".tabContainer table tr").each(function(index, elm){ if (/.*（[土日]）$/.test($(this).find("td.txtNormal").text().trim()) == false) { $(this).find("input[ref='start_time']").val("09:30"); $(this).find("input[ref='end_time']").val("18:30"); $(this).find("input[ref='relax_time']").val("01:00"); $(this).find("input.modalTable__detailWorkContents__input").val("お仕事"); }  });})();
```
上記を月初にポチッとすると、土日以外のフォームが入力されます。
あとは保存ボタンを押すだけ
これがそのまま動いちゃった人はお仲間かもしれませんね。はじめまして。よろしく。&#x1f91d;

**動きません**
適宜変更してみてくださいね

**よくわかりません**
説明が下手クソでごめんね（説明してない）
近くの優しいWebエンジニアさんに聞いてみてね

**土日も仕事？**
そういう会社もあるのでしょう。
お役に立てず 残念です:pensive:

**jQueryとかwww**
私は好きですよ。jQuery
でも使ってない環境だってあるでしょうね。
そんな貴方にはこちらを

```javascript
javascript:(function(){ var rows = document.querySelectorAll('.tabContainer table tr'); for (row of rows) { var td = row.querySelector("td.txtNormal"); if (td && /.*（[土日]）$/.test(td.innerText.trim()) == false) { row.querySelector("input[ref='start_time']").value = "09:30"; row.querySelector("input[ref='end_time']").value = "18:30"; row.querySelector("input[ref='relax_time']").value = "01:00"; row.querySelector("input.modalTable__detailWorkContents__input").value = "お仕事"; } } } )();
```

良い勤怠入力ライフを:wave:
dotfiles（設定ファイル）をまとめよう！！

# dotfiles(設定ファイル)とは
ホームディレクトリにある
.から始まるファイルのことである
.vimrcとか.gitconfigsなどである
それらのファイルをgithubにて管理をするというのが今回のお話なのである
##今回の事前事項
+ git(github)  
前回説明した通り
+ .gitnore  
gitにpushするときに範囲外にするものを書き並べたもの

## dotfilesのバックアップを取ろう
まずは前回と同じようにgithubでdotfilesという名前のレポジトリを作ってください

```bash
$ git clone [作成したレポジトリ]
```
そしたらdotfilesというファイルができます
その中に保存するファイルを入れておきます

```bash:例
cd ~/
mv .vimrc dotfiles
mv .gitconfigs dotfiles
```

そしたらまたvimが.vimrc参照しなくなるので~/に移動させた.vimrcのシンボリックリンクを置きます
そのため以下のようなファイルを作ります
``~/dotfiles/dots.sh``

```bash:dots.sh
#!/bin/bash

set -u
cd ~/dotfiles
# 実行場所のディレクトリを取得
THIS_DIR=$(cd $(dirname $0); pwd)

cd $THIS_DIR
git submodule init
git submodule update

echo "start setup..."
for f in .??*; do
    [ "$f" = ".git" ] && continue
    [ "$f" = ".gitconfig.local.template" ] && continue
    [ "$f" = ".require_oh-my-zsh" ] && continue
    [ "$f" = ".gitmodules" ] && continue

    ln -snfv ~/dotfiles/"$f" ~/
done

[ -e ~/.gitconfig.local ] || cp ~/dotfiles/.gitconfig.local.template ~/.gitconfig.local

cat << END

**************************************************
DOTFILES SETUP FINISHED! bye.
**************************************************

END
```
その後dotfilesないで`sh dots.sh`で起動させたら自動的にリンクを貼ってくれます
ではこの状態でgitにpushしておきましょう

```bash
git add -A
git commit -m".vimrcなどを追加またシンボリックリンク作成用のシェルスクリプトをついか"
git push origin master
```

また.vimなどもまとめてみる

```bash
$ cd ~/
$ rm -rf .vim
$ cd ~/dotfiles
$ git clone [自分の.vimのレポジトリ]
```

.vimrcの中身も書き換える

```vimscript:.vimrc
set encoding=utf-8
scriptencoding utf-8
set runtimepath+=~/dotfiles/.vim
runtime! configs/users/*.vim
runtime! configs/plugins/*.vim
```
pluginのインストール場所も変更するためにplugins.vimも書き換える

```vimscript:plugins.vim
"プラグインが実際にインストールされるディレクトリ                                                                                                                               
let s:dein_dir = expand('~/dotfiles/.vim/dein')
" dein.vim 本体
let s:dein_repo_dir = s:dein_dir . '/repos/github.com/Shougo/dein.vim'

" dein.vim がなければ github から落としてくる
if &runtimepath !~# '/dein.vim'
 if !isdirectory(s:dein_repo_dir)
  execute '!git clone https://github.com/Shougo/dein.vim' s:dein_repo_dir
 endif
 execute 'set runtimepath^=' . s:dein_repo_dir
endif

" 設定開始
if dein#load_state(s:dein_dir)
 call dein#begin(s:dein_dir)

 " プラグインリストを収めた TOML ファイル
 " ~/.vim/rc/dein.toml,deinlazy.tomlを用意する
 let g:rc_dir    = expand('~/dotfiles/.vim/configs/plugins/install')
 let s:toml      = g:rc_dir . '/dein.toml'
 let s:lazy_toml = g:rc_dir . '/dein_lazy.toml'

 " TOML を読み込み、キャッシュしておく
 call dein#load_toml(s:toml,      {'lazy': 0})
 call dein#load_toml(s:lazy_toml, {'lazy': 1})

 " 設定終了
 call dein#end()
 call dein#save_state()
endif

" もし、未インストールものものがあったらインストール
if dein#check_install()
 call dein#install()
endif

filetype plugin indent on
```

最後に起動用スクリプトを書いておく

```bash:install.sh
cd ~/dotfiles
git clone [自分の.vimのレポジトリ]
sh dots.sh
```

一応自分用の設定ファイルです
[.vim](https://github.com/mirachan010/.vim)
[初期設定](https://github.com/mirachan010/set)
[dotfiles](https://github.com/mirachan010/dotfiles)
PHP7.2のcountにハマった話

最近、開発環境のPHPのバージョンを5.6→7.2に変更しました。
[PHP5.6 + CakePHP3 + Apache2.2のECサービスからAMP並のTTFBを実現するまで](https://qiita.com/rintaro-ishikawa/items/d6445cce8c047bc474d8)

こちらの記事にあるように、速度向上の施策の1つとして最近インターン先での本番環境がPHP7.2にバージョンアップしました。
いまさらcountの話かと思うかもしれませんが、後から自分が見返した時にこんなこと悩んだ時期があったなと思うためのメモのようなものです。
ここからはバージョンアップによって、ここ数日で苦しめられたPHPの関数countについての話をしたいと思います。

## それは突然始まった
本番環境が、PHP7.2に変わってすぐにエラーログにWarningが出るようになり、原因調査と改修を行うように指令が出たので早速調査を行いました。

### ログを確認してみた
確認してみるとそこには

```
Warning (2): count(): Parameter must be an array or an object that implements Countable in file名　line 〇〇
```
というエラーが出ていた。

英語が苦手な私が、理解するのに少しかかったが、どうやら**countの引数には配列、もしくはカウントすることができるオブジェクトでなければならない**というエラーのようだった。

## PHP7.2の変更点
PHPの公式マニュアルを確認すると以下の記述を発見
[PHP:count](http://php.net/manual/ja/function.count.php)

```php
In PHP 7.2.0
count(NULL) returns a warning:
Warning: count(): Parameter must be an array or an object that implements Countable

In previous versions:
count(NULL) returned 0 without any warnings.
```
なるほど・・・
前のバージョンでは`count(NULL)`に対して0を返していたが、PHP7.2からwarningを出しているとのこと。
つまり、countを使いたい、でも変数の中身が配列またはオブジェクトの場合もあるし、NULLを返す場合もあるよという時には

```php
if (is_array($hoge)) {
    count($hoge);
}
```
という判定をさせると回避できそう。

また、単なるNULLチェックをするだけなのにcountで判定している場合は

```php
isset($hoge)
```
もしくは

```php
!empty($hoge)
```
に変更してあげれば万事解決できそうということがわかった。

### countの挙動
さらによく調べるとこんな記述があった。
[countable ではない型をカウントしたときの警告](http://php.net/manual/ja/migration72.incompatible.php#migration72.incompatible.warn-on-non-countable-types)


```php
var_dump(
    count(1), // integer はカウントできません
    count('abc'), // string はカウントできません
    count(new stdclass), // Countable インターフェイスを実装していないオブジェクトはカウントできません
    count([1,2]) // array はカウントできます
);
```
出力例

```php
Warning: count(): Parameter must be an array or an object that implements Countable in %s on line %d

Warning: count(): Parameter must be an array or an object that implements Countable in %s on line %d

Warning: count(): Parameter must be an array or an object that implements Countable in %s on line %d
int(1)
int(1)
int(1)
int(2)
```

## 苦しんだこと
###解決法はわかるんだけど、影響範囲が広いということ
問題の解決法としては難しくないが、意外とcountにcountableではない値が入ってしまうことがあるため色々な箇所でWarningが出てしまった。そのため、いく先々でcountを見たら、中身をチェックして必要があれば修正しなければならない。
過去の遺物でNULLチェックをcountでやってしまっているところがあるので、そこでWarningが発生する。

### PHPという言語についての超個人的なイメージ
PHPという言語でプログラムを書く時にあまり型を意識したことがない。
型を意識しなくてもとりあえず変数宣言をする時に`$`といえば良い。

```php
$hoge = 0;
$fuga = 'aaa';
$foo = [];
```
という感じ。
また、PHPをやって驚いたことは

```php
$hoge = 1; // int型
$fuga = '1'; // string型

if ($hoge == $fuga) // true
```
となり、もはや型とは何かと意識する必要はなかった。

この意識を変えていかないとまた、バグを生み出すことがありそう。

## まとめ
PHP7.2からcountにarrayもしくはcountableなobjectを引数として与えないとWarningが出るようになった。
回避策として、`is_array`で判定するようにすれば良い。

何か、不備があればコメントいただけると幸いです。

## 最後に
現在、エンジニア用Twitterアカウント[@gawa2101](https://twitter.com/gawa2101)を開設しました。
今後、自身のアウトプットを積極的にしていこうと考えているのでフォローしていただけると幸いです。
linuxのソフトのインストール方法覚えがき

#Ubuntuでのソフトのインストールの仕方
##apt
```unix:apt(インストール)
sudo apt-get install hogehoge
```
```unix:apt(アンインストール)
sudo apt-get remove hogehoge
```

##パッケージをダウンロード
```unix:deb_file(gdebiコマンド)
sudo gdebi hoge.deb
```
```unix:deb_file(gdebiコマンド)アンインストール
sudo apt-get remove hoge.deb
```
```unix:rpm_file(yumコマンド)
sudo yum localinstall hoge.rpm --nogpgcheck
```
```unix:rpm_file(yumコマンド)アンインストール
sudo yum remove hoge
```
##tarの解凍

##ソースからビルド
雑にブランチを横断検索するGemを作った

## なんで作った？

開発の規模が大きくなってくるとどういう変数やメソッド名をつけていたのか忘れてしまいます(´・ω・`)

チーム開発ともなると他のメンバーが別のブランチでどういう命名をしているのか気になるところ
同じメソッドの結果を受け取る変数名が微妙に違うとどっちに合わせるのか問題なんかも出て面倒くさい
しかし、そのために他の人のブランチに切り替えるのも面倒(´・ω・`)

全部ランチを横断して特定のワードを検索できる機能があったら幸せになれそう！

そんな良さげな方法あるのか！？って思ってたらこんな記事を見つけた
https://qiita.com/yuba/items/852d019af48ee7ccd92e

これをラップしていろいろできるようにしたら良さそう！

と思ったので勉強を兼ねてGemにしてみた

## 成果物
https://github.com/aimerald/kikori
<img width="902" alt="ss.png" src="https://qiita-image-store.s3.amazonaws.com/0/189219/2336e587-6c10-b529-6c80-5ac074552e95.png">

Gem名を相談したらブランチ横断検索するなら木を扱う仕事の名前をつけようとアドバイスを貰ったので**木こり**にしました。
ブランチを削除するなら**枝打ち**とかつけたらってアドバイスも貰ったんですがとりあえず使いたかったので検索だけで

## 導入

```
git clone https://github.com/aimerald/kikori

cd kikori

bundle install

./bin/install
```

## 使い方
```
kikori find 検索ワード
# -> バニラな検索結果

kikori find 検索ワード -b
# -> 検索結果があるブランチ一覧

kikori find 検索ワード -f
# -> 検索結果があるファイルパス
```

## やってないこと
テスト書いてなかったんだなぁ(*´∀｀*)
かかないと！
windowsにangular2環境構築

## nvm インストール

[nvmインストール](https://github.com/coreybutler/nvm-windows/releases)

####Latest release版でインストールする
####C:\nvmにインストールする
※日本語が入ると不都合が起こる事がある為

`nvm`でヘルプが表示されればOK

## node インストール

```
nvm install 9.10.1
nvm use 9.10.1
node -v
```

`v9.10.1`が表示されればOK

## npmをアップデートする

```
npm i npm -g
npm -v
```
最新versionが表示されればOK

もしエラーになったら下記で更新する。

```
cd C:\Program Files\nodejs
rm npm npm.cmd
mv node_modules/npm node_modules/npm2
node node_modules\npm2\bin\npm-cli.js i npm@latest -g
rm -rf node_modules/npm2
```

# angular インストール

```
npm install -g @angular/cli
ng -v
```

versionが表示されればOK
Getting distance between two segments with Python

```python
def getDistanceLP(l,p):
  return np.linalg.norm(np.cross(l[1]-l[0],p-l[0])/np.linalg.norm(l[1]-l[0]))

def getDistanceSP(s,p):
  if (np.dot(s[1]-s[0],p-s[0]) < 0): 
      return np.linalg.norm(p-s[0])
  if (np.dot(s[0]-s[1],p-s[1]) < 0): 
      return np.linalg.norm(p-s[1])
  return getDistanceLP(s,p)

def judge(p1,p2,p3,p4):
  #print(p1,p2,p3,p4)
  t1 = (p1[0] - p2[0]) * (p3[1] - p1[1]) + (p1[1] - p2[1]) * (p1[0] - p3[0])
  t2 = (p1[0] - p2[0]) * (p4[1] - p1[1]) + (p1[1] - p2[1]) * (p1[0] - p4[0])
  t3 = (p3[0] - p4[0]) * (p1[1] - p3[1]) + (p3[1] - p4[1]) * (p3[0] - p1[0])
  t4 = (p3[0] - p4[0]) * (p2[1] - p3[1]) + (p3[1] - p4[1]) * (p3[0] - p2[0])
  #print(t1,t2,t3,t4)
  #print(t1*t2,t3*t4)
  return t1*t2<=0 and t3*t4<=0

def getDistance(s1,s2):
  if (judge(s1[0],s1[1],s2[0],s2[1])):
      return 0.0 
  #print("not return 0.0")
  gd1 = getDistanceSP(s1,s2[0])
  gd2 = getDistanceSP(s1,s2[1])
  gd3 = getDistanceSP(s2,s1[0])
  gd4 = getDistanceSP(s2,s1[1])
  #print(gd1,gd2,gd3,gd4)
  return min(min(gd1,gd2),min(gd3,gd4))

n = input()
for i in range(n):
  a = []
  a.append(map(int, raw_input().split()))
  for aa in a:
    hn = np.array(aa).reshape(4,2)
    s1 = np.array([hn[0][::-1],hn[1][::-1]])
    s2 = np.array([hn[2][::-1],hn[3][::-1]])
    #print(s1,s2)
    print(getDistance(s1,s2))
    #print(getDistance(hn))
```

```
3               
0 0 1 0 0 1 1 1
1.0
0 0 1 0 2 1 1 2
1.41421356237
-1 0 1 0 0 1 0 -1
0.0
```
# Refs.
* [線分交差判定](https://qiita.com/hokekiyoo/items/fd0ef6ac59f9abbfbb05)
* [NumPyで2点間の距離を求める](https://tokibito.hatenablog.com/entry/20121222/1356187172)
* [Python NumPy: Reverse an array](https://www.w3resource.com/python-exercises/numpy/python-numpy-exercise-6.php)
【入門】Balsamiqはじめました

# きっかけ

以下の記事を読んで面白そうなデザインをかけるのかと思いBalsamiqをはじめた
バックエンドのエンジニアのメモ書き。

https://qiita.com/rana_kualu/items/5986ceab8fd4e353de1b
https://github.com/kamranahmedse/developer-roadmap

# そもそもBalsamiqとは？

~~バルサミコ酢（調味料）~~
ワイヤーフレームツール。Webやアプリのデザインの設計図を描くための便利道具。
フロントエンジニア御用達のツール

# Balsamiqって無料？

残念ながらbalsamiqは有料のツール。
ただクラウド版でトライアルあり期間あり（30日）。

##　Balsamiqの料金表　(2018.4時点）

|動作環境|制限|月払の場合|年払の場合|一括|
|---|---|---|---|---|
|クラウド|2プロジェクトまで|$9|$90|
|クラウド|20プロジェクトまで|$49|$490|
|クラウド|200プロジェクトまで|$199|$1990|
|デスクトップ|3デスクトップまで|-|-|$89

※1年分一括で支払うと2か月分安くなる

ほかにもGoogleDriveやJiraのプラグイン版がある。

料金サイト：https://balsamiq.com/buy/#cloud

# Balsamiqをはじめる

## 手順1. Balsamiqのページを立ち上げユーザ登録を行う

https://balsamiq.cloud/

## 手順2. まずはSpaceを作成

![Start2.png](https://qiita-image-store.s3.amazonaws.com/0/230829/c802f498-785f-d327-c0c8-b9e3b54ed1b7.png)

## 手順3.　起動すると以下の画面が立ち上がる

![Start3.png](https://qiita-image-store.s3.amazonaws.com/0/230829/029ffc8b-278d-43e1-1cd5-0f9f74d92827.png)

# Balsamiqでサイトマップ作成（スリーステップ）

## 手順1.  Balsamiqのオブジェクトの一覧からSiteMapを選択して画面真ん中にドラック＆ドロップ

![Start4.png](https://qiita-image-store.s3.amazonaws.com/0/230829/fe0f2147-1029-8684-2aed-2b12a16cd9c9.png)

## 手順2. サイトマップをダブルクリックしてテキストを表示。サイト内容を自分好みに変えてみる（日本語OK）

![Start6.png](https://qiita-image-store.s3.amazonaws.com/0/230829/f2c10d69-cc6a-7315-6176-e6bd1a5809c9.png)

## 手順３. 完成

![Start7.png](https://qiita-image-store.s3.amazonaws.com/0/230829/34b6c199-1467-4749-199b-4d0568c428fa.png)

## 手順４．画面上のProjectから作成したデータをPNG画像に保存

![Start11.png](https://qiita-image-store.s3.amazonaws.com/0/230829/f85d510d-ad3a-0be0-7e65-7e9c21709e1a.png)

# Balsamiqの便利なキー操作

|キー|実行内容|
|---|---|---|
|オブジェクトを選択してDelete|オブジェクトを削除|
|Ctrl+S|保存|
|Ctrl+A|オブジェクト全選択|

# Balsamiqを触ってみた感想

パワポみたいに画像をぺたぺた張って資料を作るのと同じ感じで操作できる。
ただパワポよりパーツ（レイヤー、ボタンなど）デザインがいい感じ。

# 参考）Balsamiqでつくられたサンプル集

https://wireframestogo.com/

↓こんな感じで簡単にWebサイトのフレームを作成できる

https://wireframestogo.com/dec2-Web-Demo-Project/
Oracle Certified Java Programmer, Gold SE 8 認定資格 受験体験記

# 概要
2018年4月4日（水）にOracle Certified Java Programmer, Gold SE 8（Oracle Java Gold）を受験して合格できたので日記を書いとこう:point_up_tone1:

# 勉強方法
- [徹底攻略 Java SE 8 Gold 問題集[1Z0-809]対応](https://www.amazon.co.jp/gp/product/4295000035/ref=oh_aui_detailpage_o01_s00?ie=UTF8&psc=1)の基本的な部分を3周くらい読み込む！
- 総仕上げ問題にトライし惨敗
- 総仕上げ問題×3周読み込み
- 総仕上げ問題（web版）にトライし惨敗
- 総仕上げ問題（web版）×3周読み込み
- 全体を2周読み込み

# かかったコスト
約32,616円（受験料：28,728円＋参考書：3,888円）

# 勉強期間
約3ヶ月（週末や通勤時間に時間を見つけてお勉強）

# 所感
Java未経験で試験に挑んだが、StreamAPIやLocalDateTime,NIO2など初見ではとっつきにくい部分が多く想定よりも勉強に時間がかかった。
OracleJavaSilverの際はほぼ黒本の問題という感触であったが、OracleJavaGoldは想定外の問題もいくつか出るため、最低限黒本の問題は完全に理解して挑むべき!!
一生懸命取り組めば黒本一冊で合格できる水準:robot:
共有されたIPアドレスをしらべる（Linux）

# 環境
動作確認環境：Ubuntu MATE 16.04

```shell-session
$ cat /etc/issue
Ubuntu 16.04.4 LTS \n \l
```

# 結論
```arp-scan``` コマンドを使用する。

## 使用例

```shell-session:使用例
$ sudo arp-scan -I enp0s25 -l
```

```enp0s25``` の部分は ```ifconfig``` した時に、該当するデバイスの左に表示されたものを書けば良い。



```shell-session:ifconfig
$ ifconfig
enp0s25   # ifconfigで表示される内容は一部省略します。  
          # ←　が「左に表示されたもの」です。
          # これはEthernetを示します。

lo        # スペースの関係上、省略しています。

vmnet1    # スペースの関係上、省略しています。
　　　　　　# このデバイスはVMware Workstation playerによるものです。

# スペースの関係上、これより下の部分はすべて省略します。
```

## aliasの作成

オプションを~~打つのめんどい~~よく忘れるので、aliasを作成する。

```bash:~/.bashrc
alias shareip="sudo arp-scan -I enp0s25 -l" # Ethernet
alias vmshareip='sudo arp-scan -I vmnet8 -l && sudo arp-scan -I vmnet1 -l' # VMware Workstation player
```

# 参考文献
[LAN内で利用されているIPアドレスを調べる『arp-scan』コマンド](https://orebibou.com/2015/04/lan%E5%86%85%E3%81%A7%E5%88%A9%E7%94%A8%E3%81%95%E3%82%8C%E3%81%A6%E3%81%84%E3%82%8Bip%E3%82%A2%E3%83%89%E3%83%AC%E3%82%B9%E3%82%92%E8%AA%BF%E3%81%B9%E3%82%8B%E3%80%8Earp-scan%E3%80%8F%E3%82%B3/)
レビューコメントにラベルをつけるだけで開発効率があがって幸せになれそうな話

# はじめに
コードレビューを受けている時,これは修正が必須なレビューコメントなのか,出来たら修正した方がいいものなのか,判断に迷う時ってありませんか？

付き合いの長いチームや, メンバー同士でレビューをしていると感覚的に分かることもあるけど, 新しいチーム, 新しいメンバーなど関係性が出来上がる前だと, 温度感が分からず判断に迷うことがありそうです.

結果, 全てを対応しようと頑張りすぎてしまい, 修正に恐ろしく時間がかかってリリースが遅れるなど本末転倒な不幸なケースも起こりえそうです。

<img width="814" alt="スクリーンショット 2018-04-06 0.17.34.png" src="https://qiita-image-store.s3.amazonaws.com/0/38342/4e210e77-e7b9-0884-86a0-29963ef775f5.png">

**例）先輩がいってるし全部直さなきゃ...!**

# レビューコメントにラベルをつける
* [must] 必ず対応してほしい！
* [imo]  自分の意見や提案・好み。 自分ならこう書くけどどうかな？
* [nits] 些細な指摘。 ほんの小さな指摘だけど出来れば直してほしい。インデントやタイポ
* [ask] 質問,確認。 コードの意味や背景が分からないから教えて！こういう理解でOK?

<img width="792" alt="スクリーンショット 2018-04-06 0.18.02.png" src="https://qiita-image-store.s3.amazonaws.com/0/38342/1928d69c-3e26-f928-1d35-2ae78ae20723.png">


**出来れば直したいけど, 今回はリリース優先して別PRで対応にさせてもらおう！**

こんな感じでレビューコメントにラベルがついているだけで,温度感や情報の伝達性がわかりやすくなります。
温度感がわかると、判断や相談もしやすくなり, ほんの小さな工夫だけで開発スピードがあがりそうです。

# まとめ
調べてみると一般的なんですね。
レビューコメントにラベルがあるだけでレビューのコストが低くなります。今すぐ実践できる内容なのでチームで実践してみてください。

新人プログラマ、先輩プログラマの皆さんが幸せなスタートがきれますように。

# 参考リンク
- [悪いコードを憎んで人を憎まず！ プルリク送付前に心がけたいコードレビューのコミュニケーション術](https://employment.en-japan.com/engineerhub/entry/2018/01/24/110000)
- [pull request を利用した開発ワークフロー ](https://speakerdeck.com/hotchpotch/pull-request-woli-yong-sitakai-fa-wakuhuro)
- [【今日からできる】コミットメッセージに 「プレフィックス」 をつけるだけで、開発効率が上がった話](https://qiita.com/numanomanu/items/45dd285b286a1f7280ed)
Laravelでログファイルの解放を行う

PHPUnitでのテスト等で一連のテスト内でログを削除する際に`text file busy`になる場合にログファイルを出力しているクラスに設定することで回避できました。

```php
public function __destruct()
{
    Log::getMonolog()->setHandlers(array(new \Monolog\Handler\NullHandler()));
}
```
ubuntuをつかってみよう（vimを入れるまで）

# コマンドについて
ubuntuを操作するにはコマンドをよく使う（CUIって画面で操作する）  
ubuntuでのターミナルの出し方はctrl+alt+ｔでだせる
## 事前知識
+ ディレクトリ  
windowsで言うフォルダのこと  
+ ホームディレクトリ  
自分がメインで使うところ"~/"と表示される  
+ カレントディレクトリ  
今いるディレクトリ  




## 基本的なコマンド一覧

``` bath
#今いるディレクトリの中のファイル及びディレクトリを表示  
$ ls

#隠しファイル及び隠しディレクトリを含めて表示
$ ls -a

#別のディレクトリに移動する
$ cd [ディレクトリ名]

#新しいディレクトリを作る
$ mkdir [ディレクトリ名]

#ファイルを削除する
$ rm [ファイル名]  

#ディレクトリを削除する
$ rm -rf [ファイル名]

#ファイル(ディレクトリ)の名前を変える
$ mv ./[前の名前] ./[次の名前]

#ファイル(ディレクトリ)を移動させる
$ mv ./[ファイル名] [移動先のディレクトリ]/[ファイル名]

#ファイル(ディレクトリ)をコピーさせる
$ cp ./[ファイル名] [移動先のディレクトリ]/[ファイル名]
```
#vimを使ってみよう
ubuntuに元から入ってるvimは旧バージョンなのでまずはアップデートを行います

``` bath
#vim8.0用レポジトリ追加
$ sudo add-apt-repository ppa:jonathonf/vim
#レポジトリの読み込み
$ sudo apt update
$ sudo apt install vim
```
これでvimは完成だよいっぱい文字打とうね





こんな残念なエディタの使い方がわかんないだって？
しょうがないなぁ次回はvimのカスタマイズについて！！
CUDA Cで苦労しないための記録、GPUは複数枚買う＆プログラミングのしやすさを求める

#最初に
CUDA C をネットの情報をたよりに独学でやってみました。
成果としては・・
https://qiita.com/mokoenator/items/c9f4c4fd926b5b62db2a
のようなことができるようになったくらいです。
単語など、CUDA初めての人はわからないと思いますが、困ったときに思い出してみてください。

#GPUは複数枚買う
CUDA Cをやるやらないに関わらず複数枚買っておきましょう。
PC１台に１枚は時間がかかりすぎます。実行して３０分後に終わるとか、一晩寝て・・とかざらにあるんです。結局・・・・シミュレーション、機械学習、パスワード解析とかの長い時間かかる問題を扱う仕事なので、早いGPU＆複数台の方がトライアンドエラー回数が稼げるので複数台GPUがあるといい。

１PCに複数台搭載するのはオススメしない。
１PCに1GPUがオススメ。
マルチGPU構成は最初から考慮しない。


複数台のGPUとPCを並べてAマシン、Bマシン、Cマシンでコード変えて実行して・・・
並列にするとパラメータ調整の回数が稼げるし、バグも早く見つけられる。
なので最初から複数台で作業したほうがいい。
（私は1070Tiを３枚もってます）
台数が増えれば増えるほど開発が早くなると思います。

GTX1080とtesla m40のベンチ比較だとあんまり差がないように感じるので1080を複数枚買った方が幸せ??

AWSでいいじゃないですか？って思うのですが、請求額が怖い。

なんども書きますが、１枚だと時間がかかりすぎる。学習意欲もおちる。

#PCの構成は？？
PCケースはいらない
ケースは飾り。（コレが書きたかった）
ゴム板にマザボ直置きで。

CPUは普通のオフィスワークができる程度で。
（GPUを効率的に使うのが目標なので）

メモリは８Gで十分。

Windowsなら
Visual Studio Professionalが動けばいい。
たしかProfessionalかCommunity じゃないとNsight が動かない。
これにはまって苦労した。

#C言語は当たり前に使えるように
C言語は普通に使えないと話にならない。
C＋＋は使えないと細かいことやるのに苦しい。

C#使えると楽しい。
C#からDLL経由でC++でCUDA C
みたいに使えるので楽しい

#なんだかんだでPythonから使った方がらくでしょ？
Pythonから1050Tiを使うと正直CPUと変わんないです。
CUDA Cで頑張った方が早いです。
無駄にPythonでやらないで最初からCUDA Cをやりましょう。
（私の技術不足かもしれませんが）



#ヘテロジニアスコンピューティング
知らない人は先にしらべるか、とにかくCUDAで腑に落ちるまで頑張って理解した方がいいです。なぜなら、GPUで扱える問題かどうか考えられないから。


#情報はどこから・・
英語のサイトとCUDAのサンプルを読みまくる。
英語でわからないけど・・・
めんどくさがらずに読む。
日本語の情報は少ない。

##CPUでも動くようにコードを書くとすごい楽
CUDA CはGPU上で動くコードを書くので、CPU上では動かないです。
でもCPUで動く関数を書くことができます。
なのでカーネルと共通して使えるよにする。
そうすると、CPUでテストしてGPUで動かして・・・ってできます。
そのときに便利なのが `__device__`と`__host__`を同時に使用するとCPUコードでもGPUコードでも両方利用できる。
もちろんすべて同時使用ってわけにはいかない・・・
CUDAにはCUDA用のライブラリしかあつかえません（CPU用のライブラリは使えない）。

GPUでしか動かないコードを書くことも必ずありますが、
コピーしてCPUでも動くようにしておきます。
CPUコードを作る＆修正＞GPUコードに手で変換する。
そうしておくとデバッグとかバグの原因追求が楽です。
（所詮GPUは計算しかできませんから・・・）

とにかくできるだけCPUとGPU両方で動くように書いく。

#エラーのマクロは真面目に書いた方がいい。
本当に真面目に書いた方がいいです。そしてちゃんとマクロを使う。
わすれて大変な目にあうまえにマクロ。

#カーネルの長時間実行エラー。
Windowsでは数秒でタイムアウトさせるようになっている。画面出力してなければ何も問題ないように思えるけどWindowsはそうじゃないらしい。「CUDAカーネル実行のタイムアウト」とかでしらべて実行時間を伸ばして対応しておいた方がいい。対応する前に一度位経験しとくと「これかぁ〜〜」と・・・あとでトラブルとして現れても対処できる。Teslaは映像出力系のトラブルはないらしい（出力機能がないからディスプレイとして認識されないのかも）

ちなみにエラーコードからは判断できなくて、2日潰すとか当たり前にありました。


#最初からユニファイドメモリで組んだ方がわかりやすい
バグと戦う時間よりもユニファイドメモリを使った方が苦しくないです。
普通のメモリ管理の方がすこし早くて容量も少ない・・・らしい。
メモリ転送主体の処理ではないので・・・遅くなった感覚はしなかった。


#大量のスレッドを立ちあげる感覚を早く身につける
・大量の仕事があるということ
↓
・大量の処理前情報があるということ
↓
・大量の処理結果があるということ
つまり
GPUメモリにある程度構造化した大量のデータを転送する必要があり
GPUメモリに結果があるので、ポインタのポインタ〜とかで送信、受信するかんじになる。
ってことを理解した方がいい。
（ユニファイドメモリじゃない普通の方式だとこの変数ポインタどっち？？ってなる）

取り扱いたいデータを取り扱いたい形式でGPUに転送して、GPUからどーーんと起動する

# 制御文は書かない
制御文はCUDAコアで同期をとるため遅くなってしまう。
だから・・
if文はかかない。ifの除法で乗り切る。
for文はかかない。forの除法で乗り切るか・・・カーネル立ち上げてforの数だけ並列実行する。
直列するfor文を書かない。つまり前ループ値を引きずって処理するアルゴリズムで考えない
並列処理可能なように考え方を変えられないか検討する
そしたらカーネル立ち上げて並列処理できる。
でも・・・書かなきゃどうしようもないこともタクサンあるよね・・・


#アセンブラ、マシン語
読めた方がいい。といってもそんなに読める必要はない。
アセンブラってこんなことできるんだよね？くらいで十分な気がする。
（自分がやってる分野が幼いからかな）
IF書いて＞アセンブラかくにん＞あれ？マシン語命令増えてんじゃん！
くらいがわかればOK
レジスタに読み込む消費サイクル数とか意識できるとよい。

#プログラミングスキルよりも数学的な脳みそが必要
（わたしには）どうしようもないので・・・・あきらめる。
WSL-DistroLauncher を試してみた

[WSL-DistroLauncher](https://github.com/Microsoft/WSL-DistroLauncher) を使用して好きなLinuxをインストールする自分用メモ

## とりあえず情報収集

つい先日、WSL に好きな Linuxディストリビューションをインストールできる WSL-DistroLauncher というものが公開されたらしいす。正直好きなディストリを入れれると言われても思い入れのあるディストリも無いし、Windows からパッと bash 上げて Linux のコマンドを使うには良いけどそれ以上に使い込む事も無いので Ubuntu 動くならいいんじゃね？ とも思っているのですが、せっかくだから調べてみました。

とりあえず README を眺める。

1. Linuxの rootfsイメージの tar.gz を作成する
2. WSL-DistroLauncher で appx にパッケージングする
3. パッケージをインストールする

という流れを取るらしい。

色々ネットをさまようと [ここ](https://salsa.debian.org/rhaist-guest/WSL/tree/master) に Debian での install.tar.gz 作成キットがが落ちているのでとりあえず Debian で試してみる。

### Linuxディストリビューションのパッケージ作成

Debian の VM を作成、install.tar.gz を作成する。普通に Debian を入れた後、[ここ](https://salsa.debian.org/rhaist-guest/WSL/tree/master)をダウンロード、craete-targz.shを実行すると install.tar.gz が生成される。

### DistroLauncherのパッケージを作成する

install.tar.gz を DistroLauncher のルートにコピー、build.bat を叩いてパッケージを作成する。

```
C:\work\WSL-DistroLauncher>build.bat
.NET Framework 向け Microsoft (R) Build Engine バージョン 15.6.82.30579
Copyright (C) Microsoft Corporation.All rights reserved.

2018/04/04 13:47:20 にビルドを開始しました。

....

Created appx in C:\work\WSL-DistroLauncher\x64\Debug\DistroLauncher-Appx\

C:\work\WSL-DistroLauncher>dir AppPackages\DistroLauncher-Appx\DistroLauncher-Appx_1.0.1.0_Debug_Test
 ドライブ D のボリューム ラベルがありません。
 ボリューム シリアル番号は 302B-7F95 です

 C:\work\WSL-DistroLauncher\AppPackages\DistroLauncher-Appx\DistroLauncher-Appx_1.0.1.0_Debug_Test のディレクトリ

2018/04/04  13:50    <DIR>          .
2018/04/04  13:50    <DIR>          ..
2018/03/20  18:33            32,082 Add-AppDevPackage.ps1
2018/04/04  13:50    <DIR>          Add-AppDevPackage.resources
2018/04/04  13:50        79,852,518 DistroLauncher-Appx_1.0.1.0_x64_Debug.appxbundle
2018/04/04  13:50               738 DistroLauncher-Appx_1.0.1.0_x64_Debug.cer
               3 個のファイル          79,885,338 バイト
               3 個のディレクトリ  1,774,342,610,944 バイトの空き領域

```

VisualStudio 2017, C++/UWP対応が必要。

### インストール＆その後

![startmenu.png](https://qiita-image-store.s3.amazonaws.com/0/246831/44694f28-6eab-83b8-424a-a0f600fc2320.png)

出てきたパッケージをサイドロードするなり Add-AppDevPackage.ps1 を実行するなりしてインストール。
スタートメニューに追加される。

![launch.png](https://qiita-image-store.s3.amazonaws.com/0/246831/d8b8c323-3842-8c47-f3ce-466f42851b5d.png)

追加されたアプリケーションを起動するとディストリビューションのインストールが始まり、しばらく待つと始めて WSL で Ubuntu を起動した時と同様ユーザ名とパスワードを入力すると完了。やったね！

#### wslconfig

wslconfigコマンドで登録されたディストリビューションの表示・登録解除・既定ディストリの変更が行えます。
以前(Windows Storeでディストリが配布され出すより前)の Ubuntu は Legacy になるみたいです。

## まとめ

サクッと動かすだけならこんな所。Redhat系もいつか試してみようかな・・・と言ってる間に既に作られてそうですが。
案外簡単に作れるのでお好みのディストリを動かす他にプロジェクト個別の開発環境用ディストリビューションみたいなのを配ったりすると便利かもしれませんね。
【Angular Universal】 domino を使ってクライアントサイドのエラーを軽減する

![1_iwbXNiXDmYgho42qrBIiNQ.png](https://qiita-image-store.s3.amazonaws.com/0/41793/1c05869d-dee1-3ce3-82b5-64f3c67da988.png)


# [**domino**](https://github.com/fgnass/domino) とは？

サーバーサイドレンダリング（ SSR ） を行う場合、当然ですがクライアントのコードをサーバーで実行する必要があります。
クライアントの処理ではサーバーサイドでは存在しない `Window` や `Document` といったグローバルオブジェクトを様々な場所で利用しているので、何も対策を行わないと [window is not defined #830](https://github.com/angular/universal/issues/830#issuecomment-363277913) 等のエラーが発生してしまいます。

**domino** は、そういったオブジェクトのモックを生成してくれるライブラリです。
モックの `Window` 等を利用することで、クライアントサイドの処理にあまり手を加えることなく SSR を行うことが出来ます。

※ ただし、実際のプロパティとはずれている部分もあるので、**domino**  を使ったからといってすべての処理がすんなり動くようになるわけではありません

# 使い方

[window is not defined #830](https://github.com/angular/universal/issues/830#issuecomment-363277913) であるように

```typescript
import * as domino from 'domino';

const mockWindow = domino.createWindow(TEMPLATE);

global['window'] = mockWindow;
global['Window'] = domino.impl.Window;
global['document'] = mockWindow.document;
```

こんな感じで定義できます

# **domino** を読み込む場所に注意


当初、**domino**  はクライアントサイドでいう `polyfill` のようなものだと思い、深く考えずにサーバーサイドの最初の方で読み込んでいました。

しかし、そのせいで

**domino** 
↓
**axios** 依存ライブラリ
↓
**axios**

という順番で実行されてしまい、中途半端な `Window` や `Document` がグローバルに存在する環境下でサーバーサイドの処理が行われていました。
そしてたまたま、そういったオブジェクトで処理が分岐する依存ライブラリ ( **axios** ) にぶつかり、エラーが発生してしまいました。

よく考えれば当然ですが、domino の読み込みはなるべくレンダリング処理の直前で行うほうが良いと思います。
今回は **axios** でしたが、同様の処理を行っているライブラリは他にもあるのではないでしょうか…？

## 補足 **axios** のエラーについて


- http クライアントである **axios** に依存しているライブラリでエラーが発生
- [https://github.com/axios/axios/blob/master/lib/helpers/isURLSameOrigin.js#L41](https://github.com/axios/axios/blob/master/lib/helpers/isURLSameOrigin.js#L41) で発生
    - **domino**  で生成したエレメントには `pathname` が存在しないのでエラーが発生していた

```js
pathname: (urlParsingNode.pathname.charAt(0) === '/') ?
```

- https://github.com/axios/axios/blob/master/lib/helpers/isURLSameOrigin.js#L6

```js
utils.isStandardBrowserEnv() ?
```

- https://github.com/axios/axios/blob/master/lib/utils.js#L181

```js
function isStandardBrowserEnv() {
  if (typeof navigator !== 'undefined' && navigator.product === 'ReactNative') {
    return false;
  }
  return (
    typeof window !== 'undefined' &&
    typeof document !== 'undefined'
  );
}
```

axios ではクライアントサイドのグローバルオブジェクトを確認して、現在の環境（サーバー or クライアント）を判断し、処理を分けているようである

今回は中途半端な `Window` 及び `Document` が存在していたため、クライアントサイドの処理が実行されエラーとなっていた


# まとめ

最初にも述べましたが **domino** で生成できるグローバルオブジェクトは完全なものではありません。
しかし、基本的なプロパティは大体実装されているので、これを読み込むだけクライアントサイドの処理をあまり修正せずに SSR で利用することができます。

プロジェクトで使用しているライブラリによっては別途対応が必要なものもありますが、私のケースでは おおよそ流用できて便利でした ( ＾ω＾)

# ひとり言

これからちょくちょく angular universal 系の tips を `angular-universal` タグにまとめていこうかなと思います。
(´-`).｡oO(ある程度溜まったらチュートリアル的な記事を作ってまとめられたら良いなぁ)
「[数学メモ] 高次方程式の解の公式」を参考にwolframalphaとsympyでやってみたい。

オリジナル

https://qiita.com/yoshi389111/items/401aaef5e8b759590157

# 参考

https://qiita.com/K_Matsumoto/items/e1c292c249c1562c2d4b

# wolframalpha(その1)
二次方程式

http://www.wolframalpha.com/input/?i=a*x%5E2+%2B+b*x+%2Bc+%3D%3D+0

三次方程式

http://www.wolframalpha.com/input/?i=a*x%5E3+%2B+b*x%5E2+%2Bc*x+%2Bd+%3D%3D+0

四次方程式

http://www.wolframalpha.com/input/?i=x%5E4+%2B+A*x%5E3%2B+B*x%5E2+%2BC*x+%2BD+%3D%3D+0

# wolframalpha(その2)　*かけるがなくてもできました。
二次方程式

http://www.wolframalpha.com/input/?i=ax2+%2B+bx+%2Bc+%3D%3D+0

三次方程式

http://www.wolframalpha.com/input/?i=ax3+%2B+bx2+%2Bcx+%2Bd+%3D%3D+0

四次方程式

http://www.wolframalpha.com/input/?i=x4+%2B+Ax3%2B+Bx2+%2BCx+%2BD+%3D%3D+0

# sympy
(勉強中)
高校数学を思い出しながら連立方程式を解いて見る(wolframalphaとsympy)

(参考)高校数学を思い出しながら連立方程式を解いて見る
https://qiita.com/te20/items/4603388a04e60be67c7d
(参考)連立方程式 - Wolfram Language Documentation
http://reference.wolfram.com/language/tutorial/SimultaneousEquations.html.ja

#wolframalpha　*かけるがなくてもできました。
連立方程式
http://www.wolframalpha.com/input/?i=x%2By%2B2z%3D%3D9,x%2B2y%2Bz%3D11,2x%2By%2Bz%3D8

#sympy
(製作中)
Swiftでキーフレームアニメーションを作ってみた

今回はAppleのプログラミングガイドを参考にキーフレームアニメーションを作成してみました。
[Animation Types and Timing Programming Guide](https://developer.apple.com/jp/documentation/Animation_Types_Timing.pdf)

# **作ったもの**
![anime.gif](https://qiita-image-store.s3.amazonaws.com/0/190870/f4e4d712-00aa-3b45-68ce-6fb9c39e5464.gif)


# **コード**

```swift
let animationView = UIView(frame: CGRect(x: view.frame.width / 2 - 150, y: view.frame.height / 2 - 100, width: 300, height: 200))
view.addSubview(animationView)
        
let images = [#imageLiteral(resourceName: "sample1.jpg"), #imageLiteral(resourceName: "sample2.jpg"), #imageLiteral(resourceName: "sample3.jpg")]
let cgImages = images.map { (image) -> CGImage in
    let ciImage = CIImage(image: image)
    return CIContext(options: nil).createCGImage(ciImage!, from: (ciImage?.extent)!)!
}

let animation = CAKeyframeAnimation(keyPath: "contents")
animation.repeatDuration = .infinity
animation.values = cgImages
animation.duration = 6.0
animationView.layer.add(animation, forKey: nil)
```

# **次に作るもの**
[雑Memo]

- スワイプで回転する
- 上に近くにつれてだんだんと円が大きくなる

<img src="https://qiita-image-store.s3.amazonaws.com/0/190870/4b29124a-3d6c-7849-be7e-310c680dfdcc.jpeg" width=33.3%>
excelのNumberFormatを使ってみた。


(参考)セルの表示形式を設定・取得する（NumberFormat プロパティ） 
http://excelwork.info/excel/numberformatp/
result = Object.NumberFormat
result = Object.NumberFormatLocal
(参考)Excel 小数点の位置を揃えるには？＞桁数を選択します。＞小数点以下の桁数:1
https://simin.jpita.jp/index.php?excelziten420

```vb
Sub aテスト()
     Cells(4, 3).NumberFormat = "@"  'セル(4,2) 24.0 小数点以下の桁数(D):1
     Cells(4, 3) = myNumber2Str(4, 2)
End Sub
Function myNumber(i, j) As String
    Dim a As String
    a = Cells(i, j).NumberFormat
    myNumber = Mid(a, 1, Len(a) - 2)
End Function
Function myNumber2Str(i, j) As String
    myNumber2Str = Format(Cells(i, j), myNumber(i, j))
End Function
```