OmniAICreator/Qiita-1.07M huggingface dataset:
メモリの購入

富士通のFMVD3000WPというPCのメモリを追加で購入しようとした時のメモ
##メモリタイプ
DDR3-、DDR4-、PC3-等の規格を確認する。
今回は、メモリタイプが「DDR4-DIMM」なので、DDR4-の形式を選択する。

##ノート or デスクトップ用
「SO」や「S.O」と記載あるものについてはノートパソコン用である。
今回は、デスクトップ用PCであるため、「SO」と記載のないものを選択する。

##最大動作周波数
DDR4-以降の部分は、最大動作周波数という。もちろん、大きければ大きいほど高速となる。

##注意
標準で4GBのメモリが1本入っているが、今回8GBのメモリを2本購入するので、標準メモリは使えなさそう…。
>メモリ増設の際、既設のメモリと併用する前提でデュアルチャネル動作スロットに新規のメモリを増設した場合、デュアルチャネル動作が正常にできなくなり、誤動作することがある。 代表的な症状としては、Windowsではエクスプローラがフリーズする。カーネルモードで停止する（BSOD）などがある。この場合、増設前にBIOSの設定でシングルチャネル動作に変更する。又は既設のメモリを除去し、同一ロットのメモリを2枚以上増設することでこの問題を回避できる。 
>[デュアルチャネル - Wikipedia](https://ja.wikipedia.org/wiki/%E3%83%87%E3%83%A5%E3%82%A2%E3%83%AB%E3%83%81%E3%83%A3%E3%83%8D%E3%83%AB)
rippledを設置する(centos)

# 公式手順

* 以下に手順が書いてあります

https://ripple.com/build/rippled-setup/#installing-rippled

* 以下のサイトを見ておくとノード構成がわかります

https://ripple.com/jp/build/xrp-ledger-consensus-process/#the-xrp-ledger-protocol-consensus-and-validation

# install

```
yum install https://mirrors.ripple.com/ripple-repo-el7.rpm
yum install --enablerepo=ripple-stable rippled
```

* インストールすると/opt/ripple/以下にファイルが展開される

# linuxの設定

* ファイルディスクリプタを引き上げる

```:/etc/security/limits.conf
* soft nofile 65535
* hard nofile 65535
```

# 設定

## tiny

* ledgerを2000個程度保持
* t2.large相当で稼働可能
* 利用用途としてはトランザクション送信、アカウントの残高取得など
* バリデータのプロキシー用途
* ２時間程度経過した入金確認はできない
* レジャーの数、1時間900個、2時間1800個

```:/opt/ripple/etc/rippled.cfg
[server]
port_rpc_admin_local
port_peer
port_ws_admin_local
port_ws_public
ssl_key = /etc/ssl/private/server.key
ssl_cert = /etc/ssl/certs/server.crt

[port_rpc_admin_local]
port = 5005
ip = 127.0.0.1
admin = 127.0.0.1
protocol = http

[port_peer]
port = 51235
ip = 0.0.0.0
protocol = peer

[port_ws_admin_local]
port = 6006
ip = 127.0.0.1
admin = 127.0.0.1
protocol = ws

[port_ws_public]
port = 9999
ip = 0.0.0.0
protocol = wss

[node_size]
tiny

[ledger_history]
1000

[node_db]
type=RocksDB
path=/var/lib/rippled/db/rocksdb
open_files=2000
filter_bits=12
cache_mb=256
file_size_mb=8
file_size_mult=2
online_delete=2000
advisory_delete=0
compression=1

[database_path]
/var/lib/rippled/db

[debug_logfile]
/var/log/rippled/debug.log

[sntp_servers]
time.windows.com
time.apple.com
time.nist.gov
pool.ntp.org

[ips]
r.ripple.com 51235

[validators_file]
validators.txt

[rpc_startup]
{ "command": "log_level", "severity": "info" }

[ssl_verify]
0
```

# 起動

```
systemctl start rippled
```

# ログファイル監視

```
tail -f /var/log/rippled/debug.log
```
API サーバに Basic 認証を設定し、クライアントから GET リクエストを送信する

# はじめに

社内で「社内サービス間で API で連携し、一応認証には Basic 認証を使いたい」という話が挙がりました。そこで APi サーバとクライアントで実際にどうやって実現できるかを調べてみました。

# 方法

## サーバ

[http_basic_authenticate_with](http://api.rubyonrails.org/classes/ActionController/HttpAuthentication/Basic/ControllerMethods/ClassMethods.html#method-i-http_basic_authenticate_with) を使って、Basic 認証のユーザ名とパスワードを設定します。

```app/controllers/api/v1/animes_controller.rb
module Api
  module V1
    class AnimesController < ApplicationController
      http_basic_authenticate_with name: 'nadeko', password: 'snake', only: :index

      def index
        @animes = Anime.all
      end
    end
  end
end
```

## クライアント

以下は Ruby の例です。

```rb
require 'uri'
require 'net/http'

def request_with_basic_auth(url, username, password)
  uri = URI(url)
  request = Net::HTTP::Get.new(uri)
  request.basic_auth(username, password)

  Net::HTTP.start(
    uri.host, uri.port,
    use_ssl: true,
    # 次のオプションは localhost でオレオレ証明書を使っているので指定してます。
    # 通常 (正規の証明書の場合) は不要です。
    verify_mode: OpenSSL::SSL::VERIFY_NONE
  ) do |http|
    http.request(request)
  end
end
```

### 認証に成功した場合

```rb
url = 'https://localhost:8888/api/v1/animes.json'
response = request_with_basic_auth(url, 'nadeko', 'snake')
#=> #<Net::HTTPOK 200 OK readbody=true>

require 'json'
JSON.parse(response.body)
#=> [{"id"=>1, "year"=>2009, "title"=>"化物語"}, {"id"=>2, "year"=>2012, "title"=>"偽物語"}]
```

### 認証に失敗した場合

```rb
url = 'https://localhost:8888/api/v1/animes.json'
response = request_with_basic_auth(url, 'nadeko', 'cat')
#=> #<Net::HTTPUnauthorized 401 Unauthorized readbody=true>
```
Mac+pythonでOpenCV使いたければこの方法だけ知っとけば良い


	pyenv install anaconda-2.1.0
	pyenv global anaconda-2.1.0
	pyenv rehash
	
	conda install -c https://conda.binstar.org/jjhelmus opencv

これだけで、もう使えてしまう....
半日無駄にしました。

参考文献:https://qiita.com/ru_pe129/items/8a1a75cdf713d4fa6bc8
バックグラウンド実行し忘れた時、途中からバックグラウンド実行させたい

メモ
nohupをつけ忘れて、そのまま実行し時間がたってしまったということがたまにある。
そのとき、最初からではなく、途中からバックグラウンドでの実行に変更するコマンド

```
$ ruby sample.rb
.
.
.

# Ctrl + Zでストップ
$ jobs #止まっていることを確認
[2]+  Stopped                 ruby sample.rb

$ bg
[2]+ ruby sample.rb &

$ jobs
[2]+  Running                 ruby sample.rb &

$ disown
```
AWS ElastiCache勉強まとめ

・フルマネージド
・memcached, redisをサポート
redis:高速にRead/WriteできるNoSQL
参考URL:
https://www.slideshare.net/mobile/yujiotani16/redis-76504393

参考URL
https://www.slideshare.net/mobile/AmazonWebServicesJapan/aws-black-belt-online-seminar-2017-amazon-elasticache-84060910
SAML2.0ベースのSSOをわかりやすく解説してみる

# はじめに
今やさまざまなSaaSでSSO（SAML2.0）できるようになってきました。しかし、SAMLは仕様が複雑でなかなか理解しにくいものです。そこで、できるかぎりわかりやすく解説して行きたいと思います。
なお、本稿では、SP-initiated SAMLをベースに解説します。

# SAML2.0ベースでのSSO

## 用語
- Idp(Identity Provider):認証情報を提供する側。シングルサイン元
- SP（Service Provider）：認証情報の利用側。シングルサイン先
- AuthnRequest：認証要求。SP側がIdpへ認証を要求する際に発行される要求
- SAMLResponse：認証応答（認証情報含む）。認証要求に対する認証情報を含んだ応答

## 事前
- 事前にIdpとSPは信頼関係を結ぶ（公開鍵を交換し合う）
- IdpとSPにそれぞれ対になるアカウントが登録されている（なければ作成するというのもあるが、ここでは既に登録されていることとする）

## 処理

![saml1.png](https://qiita-image-store.s3.amazonaws.com/0/100530/240000f6-5f70-1593-f453-506e09a7f017.png)

1. ユーザーはSPに対しアクセスする
1. ユーザーはSP未認証のため、SPはIdpにAuthnRequestを送信する（リダイレクト）
1. Idpはユーザーの認証状況を確認する。ここでは、既に認証済み（ログイン済み）とする
1. Idpはユーザーの認証情報をSAMLResponse(Idpの秘密鍵で署名する)としてSPに送信する（リダイレクト）
1. SPはSAMLResponseをIdpの公開鍵で検証する
1. SPはSAMLResponseに含まれる認証情報を基にSP側の紐づくアカウントで認証したことにする
1. SPにアクセスが許可され、利用する 

難しすぎます。。。

# 例えで理解する
## 例
旅行者が日本から米国に観光に行くことに例えて説明する
ユーザー＝旅行者
Idp＝日本国
SP＝米国

## 事前
- 日本国と米国は条約を締結して旅行者の入国を認める
    - ＝IdpとSPが公開鍵を交換して信頼関係を結ぶ
- 日本人の旅行者（住民）は米国のestaに事前に登録しておく
    - ＝IdpとSPに対になるアカウントが登録されている

## 入国手続き（処理）

![saml2.png](https://qiita-image-store.s3.amazonaws.com/0/100530/01123b51-1f00-16f5-4572-bd67c2aac2be.png)

1. 旅行者は渡米する
1. 米国の入国管理官は、パスポートを出すように要求する
    - ＝AuthnRequest
1. 旅行者は日本国のパスポートは発行済み
    - ＝Idpにログイン済み
1. 米国の入国管理官にパスポートを差し出す
    - ＝SAMLResponseを送信する
1. 入国管理官はパスポートをチェックする（ICチップ等）
    - ＝SAMLResponseの署名を検証
1. パスポートの情報とestaの申請を照らし合わせる
    - ＝SP側の紐づくアカウントで認証したことにする
1. 入国を許可される
    - SPにアクセスが許可される

どうでしょうか？なんとなくイメージできましたか？若干パスポートを発行するあたりの時系列がSAMLと異なりますが、だいたい合っているので許してください。

## 終わりに
SAMLにはいろいろなパターンがあり、すべてを理解するのは難しいかもしれません。しかし、最も基本的なパターンについて理解できたのではないでしょうか。これでSAMLでのSSOは、もう怖くありませんね。Let' SSO!!
Anaconda を捨てて pyenv x virtualenv 構成で Tensorflow を動かすまで

## 概要
Python 関連本を読んで Anaconda をインストールていたが、pip でライブラリ入れまくって、 tensorflow インストール時に依存関係で苦しんだので、Anaconda をアンインストールした。 Anaconda でも環境毎のライブラリ管理ができるが、 CUI だけで良かったので pyenv x pyenv-virtualenv の構成に変更した。ちなみに [Tensorflow のインストール説明ページ](https://www.tensorflow.org/install/install_mac)でも Virtualenv を推奨している。

## 1. Anaconda のアンインストール
Anaconda が入ってない人や、別にアンインストしなくて良い方はスルーしてください。

### フォルダ削除

```bash
$ sudo rm -rf /anaconda
```

### 設定ファイルへの記述を除去

* ~/.bash_profile
* ~/.bashrc
* ~/.zshrc

あたりに

```bash
export PATH="/Users/ユーザー名/anaconda/bin:$PATH"
```

っぽい記述をしてると思うので、それを削除。これでアンインストール終了！

## 2. pyenv x pyenv-virtualenv 環境の構築

[pyenv と pyenv-virtualenv で環境構築
](https://qiita.com/Kodaira_/items/feadfef9add468e3a85b) が良記事なので、こちらの記事をご参照ください。

## 3. Hello Tensorflow!

ちゃんとやりたい方はこちらを参考に > [Installing TensorFlow](https://www.tensorflow.org/install/)


### Tensorflow インストール 

```
$ pip install --upgrade tensorflow
```

### 環境を切る

```
$ pyenv virtualenv 3.6.4 tensorflow-test
$ pyenv activate tensorflow-test
```

### サンプルコード実行

[本家 github のサンプルコード](https://github.com/tensorflow/tensorflow#installation)を実行してみる。これが正常に実行できればオッケー！

```Python
>>> import tensorflow as tf
>>> hello = tf.constant('Hello, TensorFlow!')
>>> sess = tf.Session()
>>> sess.run(hello)
'Hello, TensorFlow!'
>>> a = tf.constant(10)
>>> b = tf.constant(32)
>>> sess.run(a + b)
42
>>> sess.close()
```

## まとめ
以上、比較的簡単に環境構築できました。なにか誤り等ありましたらご指摘ください！
Androidアプリ制作で入力後に次の入力欄へ

## やりたいこと
EditViewで入力すると、キーボードの所に「次へ」と出る。
これを押したときに、ちゃんと次の入力欄へフォーカスを移動させたい。

## コード
レイアウトXMLファイルのEditTextに、`android:nextFocusForward="@+id/editSecond"`と`android:imeOptions="actionNext"`を追加する。
当然、IDは適宜修正で。

```xml
<EditText
    android:id="@+id/editFirst"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:inputType="text"
    android:text=""
    android:nextFocusForward="@+id/editSecond"
    android:imeOptions="actionNext"
    android:textSize="24sp" />
```
Cloud DatastoreのGetMultiにはまった話（Go）

## はじめに
Datastoreで１エンティティ毎Getするのは非効率で、一括で取得することが推奨されているようです。
Stackdriverトレースでも複数回Getしているものは、一括で処理するようにアドバイスされます。
<img width="1487" alt="スクリーンショット 2018-01-18 11.48.47.png" src="https://qiita-image-store.s3.amazonaws.com/0/100530/b41ab203-a1dc-af38-4ac1-21b4924cf3ee.png">

そこで複数回Getしていたものを、GetMultiを使用して一括処理しようとした際にハマったポイントについてまとめました。

## まずコードを書いてみる
下記のように実装しましたが、私が想定したように動いてくれませんでした。

```go
func GetUsers(ctx context.Context, userIds []string) ([]*UserKind, err) {

    var keys []*datastore.Key
    for _, id := range userIds {
        keys = append(keys, datastore.NewKey(ctx, "User", id, 0, nil))
    }

    users := make([]*UserKind, len(keys))
    if err := datastore.GetMulti(ctx, keys, users); err != nil && err != datastore.ErrNoSuchEntity {
        return nil, err
    } else {
        for i := 0; i < len(users); i++ {
            users[i].Key = keys[i].StringID()
        }
        return users, nil
    }
}
```


### datastore.ErrNoSuchEntityエラーの判定ができない
```go
if err := datastore.GetMulti(ctx, keys, users); err != nil && err != datastore.ErrNoSuchEntity {
	return nil, err
} 
```
Getではエンティティが存在しない場合は`datastore.ErrNoSuchEntity`が返却されるため、それ以外のerrが起きた場合のみerrを返却しようとしました。
しかし、上記のコードではエンティティが存在しない際、errは`datastore.ErrNoSuchEntity`とマッチしませんでした。
メッセージをみると`datastore: no such entity (and 14 other errors)`となっていました。
datastore.ErrNoSuchEntityのようですが、メッセージ末尾の` (and 14 other errors)`がマッチしない原因のようです。


### appengine.MultiErrorについて

GetMultiで返却されるerrは`appengine.MultiError`で複数のerrを表す型でした。
注意が必要なのはMultiErrorはerrだけではなく`nil`が含まれる場合もあることです。

GetMultiでは、単一エンティティを取得する`err := datastore.Get(ctx, key, &entity)`をN回実行されたようにkeyとentityとMultiErrorに含まれるerrは対になるようです。

key1に対するエンティティをeintity1とした場合、以下のイメージでentityのリストとerrのリスト(MultiError)が返却されます。

```
[key1, key2, key3]
[entity1, nil, entity3]
[nil, err2, nil]　<-　MultiErrorを展開したイメージ
```
key2に対するエンティティが存在しない場合はMultiError内の2番目のerrとして`datastore.ErrNoSuchEntity`が返却されました。エンティティは存在しないのでentityのリストの2番目はnilになります。
逆にkey1での取得が正常にできた場合、entityのリストの1番目はentity1が取得され、MultiError内の1番目はnilになります。

これを踏まえてエラー処理を書くと以下のようになりました。

```go
merr, ok := err.(appengine.MultiError)
if !ok {
    //appengine.MultiErrorではない場合はそのエラーを返却
    return nil, err
}

for _, e := range merr {
　　　　if e == nil {
　　　　　　　　//entityが存在する
  　　　　continue
　　　　}
        
  if e == datastore.ErrNoSuchEntity {
  //entityがないだけなのでスルー
  　　　　continue
  }

　　　　//ここまで来ると datastore.ErrNoSuchEntity 以外のエラー
　　　　return nil, err
}
```

また、GetMultiで取得時に指定したKeyに対する`users`が存在しない場合、取得したエンティティのリストにnilが含まれてしまうため、返却用のスライスを別途作成して返却するようにしました。

```go
res := []*UserKind
for i := 0; i < len(users); i++ {
    if users[i] != nil {
        users[i].Key = keys[i].StringID()　// Keyをセット
        append(res, users[i])
    }
}
return res, nil
```

##　おわりに
そもそもKeyに対するエンティティが存在しないということが前提条件で保証されているのであれば、ここまでの実装は不要ですが、GetMultiは結構ハマりポイントがありましたのでご注意ください。
Hello, Vue.js

# Hello,World!をVue.jsでしたので記念。
<p data-height="265" data-theme-id="0" data-slug-hash="bLVbme" data-default-tab="js,result" data-user="ke1ta" data-embed-version="2" data-pen-title="Hello, Vue.js" class="codepen">See the Pen <a href="https://codepen.io/ke1ta/pen/bLVbme/">Hello, Vue.js</a> by keita (<a href="https://codepen.io/ke1ta">@ke1ta</a>) on <a href="https://codepen.io">CodePen</a>.</p>
<script async src="https://production-assets.codepen.io/assets/embed/ei.js"></script>

もう少しコードを書くようになったら更新します。
centos7 munin nginx で監視

muninで監視するのが良いらしい。
とりあえずパスワードとか無しで。

# munin インストール

```

yum -y install munin --enablerepo=epel

```
 
##コメントアウトを外す

vi /etc/munin/munin.conf

```
dbdir   /var/lib/munin
htmldir /var/www/html/munin
logdir /var/log/munin
rundir  /var/run/munin

```

## 111.22.33.55/munin で見れるように

今ある設定に追記

```

server {

    listen 80;
 
    location /munin {
        alias /var/www/html/munin/;
    }

    location /nginx_status {
        stub_status on;
        access_log off;
    }

}


```

再起動

```

sudo systemctl restart nginx.service
systemctl start munin-node.service
systemctl enable munin-node.service

```

ログを取得する関係上、
5分後に見れるらしいが、まちきれないので

```
sudo -u munin munin-cron

```



**OK 111.22.33.55/munin で見れるようになっていることを確認**

##つづいてさらに nginxを設定

必要なファイルはすでに入っているのでシンボリックリンクを貼るだけ。

```

cd /usr/share/munin/plugins
ln -s /usr/share/munin/plugins/nginx_status /etc/munin/plugins/nginx_status
 ln -s /usr/share/munin/plugins/nginx_request /etc/munin/plugins/nginx_request

```

再起動

```

sudo systemctl restart nginx.service
systemctl restart munin-node.service

```

**OK nginx の項目が増えていれば**
sedもawkも使えないけどpythonでパイプに参加テク

# 概要
日々bashやらzshをいじる私ですが、恥ずかしいことにそらでsedもawkを使うことができません.
もちろん正規表現もダメダメです.
何度勉強してもまるで頭に定着しないんですね...

ただ、Pythonは迷う事無くコードを書くことができます.

そういうsedとawkが覚えられないけどシェルを有効に使用したいPythonユーザはこのテクが役に立つと思います.

注意点としてsedやawkなどの特化したUnixコマンドを使ったほうがPythonを使うより断然短く書けます.
ただそれらを知らなくてもシェル上で複雑な処理をパっと繋げられる方法があるという事の紹介です.


# コード例
## 基本
基本的には以下の様な形になります.

```bash
# 行単位で処理する場合
ls | python3 -c "import sys;[print(i.strip()) for i in sys.stdin]" 

# まとめて処理する場合
ls | python3 -c "import sys; print(sys.stdin.read())" 
```

* python3 -c : シェルで渡したPythonコードを実行するためのコマンド
* sys.stdin : 標準入力(パイプで渡された文字を受け取る)(行単位のイテレータの様に振る舞う)

※ 組み込み関数`input()`はEOFをハンドリングするのが難しいためsys.stdinを使用している.
※ -cオプションは`PYTHONSTARTUP`を読み込む事ができない(なんでだろ).

## 文字を取り除きたい
下記の出力から`./`を取り除きたい。
多分sedで手軽にできると思うのですが書き方すら思い出せないので、わかるPythonでどうにかします.

```
% grep "data" -rl .
./file1
./file4
./file5
./file6
```

以下の様にします。

```bash

% grep "data" -rl . | python3 -c 'import sys;print(sys.stdin.read().replace("./",""))'
file1
file4
file5
file6
```
* replace : 文字の置き換え

sedだと38文字程度でかけますが、pythonだと84文字でした.
ただsedの使い方を調べずにその場でどうにかできるのはとても良い・・.

## CSV状出力のデータを加工したい
ls -lの内容から容量とファイル名だけ欲しい.
多分awkが得意な処理なのですがここはPythonで.

```bash
% ls -lh
total 14760
-rw-r--r--  1 user  user   617B  7 25  2017 listdir.go
-rwxr-xr-x  1 user  user   7.2M  7 25  2017 server1*
-rw-r--r--  1 user  user   254B  7 25  2017 server1.go
drwxr-xr-x  4 user  user   136B  7 25  2017 tmp/
```
以下の様にします.

```bash

% ls -l | python3 -c "import sys;[print('{4} {8}'.format(*i.split())) for i in list(sys.stdin)[1:]]"
617B listdir.go
7.2M server1*
254B server1.go
136B tmp/
```
* split() : 引数が無いとスペースとか改行とか良い感じに分解してくれる
* list(sys.stdin)[1:] : 一行目を飛ばす
* print('{4} {8}'.format(*i.split())) : 分解した文字から4,8番目を出力

awkだと28文字程度で書けますが、pythonだと98文字かかりました.
割りと微妙な所ですが、やはりネットで調べなくても書けるのが良いですね!!!.

## プログラマブルなフィルターを書く
ファイル名が6文字以下の物だけを表示.
正規表現を覚えていれば簡単にできそうですが.

```bash
% ls
f4         fi5        file2      filee3     filefile1
```

後置if文で条件を追加して以下の様にします

```bash
% ls -1 | python3 -c "import sys;[print(i.strip()) for i in sys.stdin if len(i)<7]"
f4
fi5
file2
```
* len(x)<7 : 改行コードが含まれるので文字数+1

もっと複雑な物も実現できます.

## Pythonで加工したデータをももう一度パイプで後続に渡す
もちろんできます.

```bash
% ls -1 | % ls | python3 -c "import sys;[print(i.strip()) for i in sys.stdin]" 
file1
file2
file3
file4
file5
file6
file7
file8
```

上記の出力の行数をwcコマンドで数えます.

```
% ls | python3 -c "import sys;[print(i.strip()) for i in sys.stdin]" | wc -l     
       8
```

# 最後に
PYTHONSTARTUPをpython3 -cオプションでも読み込んでくれるようになればもっと便利になるんですけどね・・。
REPLは対応しているのにどうしてこれは対応していないんだろう.
Android Studioのアップデート&導入～初期設定までおさらい

学校の授業にて、リリース直後のAndroid Studio3.xを使わずに2.xを導入したところ、エラーが多発し先生に助けを求められたので、その際のエラー対処及び導入から初期設定までのメモを残します。
尚、Windows,Mac,Linuxにて動作確認をしております。

LinuxではAndroid Studio及びJDKの圧縮ファイルを好きなディレクトリに解凍し、実行ファイルのデスクトップエントリを作成するだけなので他2つのOSと比べると楽です。(インストールは全OS同じです)
デスクトップエントリ作成については、以前僕が投稿したこちらの記事をご参考ください。
[Linuxにおけるデスクトップエントリ(ショートカット的な)作成の備忘録](https://qiita.com/gn5r/items/056fa75da44d27b9d68f)

## 2.xからのアップデート方法
2.xを既に導入済みであれば
![無題.png](https://qiita-image-store.s3.amazonaws.com/0/230050/853a7880-f7fe-8678-a7f1-33cca811211b.png)
上画像の`Help→Check for Updates...(赤枠で囲った部分)`をクリックしアップデートすることができます。

## 3.xを新規インストール
環境:Windows10(Macの方はJDKの格納場所を忘れたので後ほど更新します。)

[Android Studio](https://developer.android.com/studio/index.html?hl=ja)
投稿時の最新バージョンは **3.0.1** でした。

またJDKもダウンロードします。
[JDK8_161](http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html)
JDK9ではなく、JDK8です。何故なのか理由は聞かないで下さい
(EclipseでJDK9のパス通したらエラー吐いたので、Android Studioもその可能性があると踏んでいます)

JDKのインストールはダウンロードしたexeファイルを起動させ、**next** を押していけば問題ないです。ディレクトリの変更も、基本はする必要がないのでJDKのインストールは割愛させていただきます。

JDKのインストールが終わり次第、Android Studioのインストールに入ります。
![setup.png](https://qiita-image-store.s3.amazonaws.com/0/230050/46aeb5c4-3cb1-6047-be09-cb473af52d7d.png)
インストーラー起動直後の画面がこちら(立ち上がるまでPCのスペックやOSにより、もたつきがあるかもしれません)
**next** をクリックすると以下画面になります
![setup2.png](https://qiita-image-store.s3.amazonaws.com/0/230050/f1f0a64c-af78-217b-f43f-8a8d2b4bac8d.png)
**Android Virtual Device** とありますが、こちらは実機を持っていない方向けの仮想マシンになります。実機がある若しくは別の仮想マシンをお使いになるようでしたらチェックを外して構いません。
**next** 押下でディレクトリ指定画面になりますが、基本的に変更する必要はないと思います。
パーティション分けているとかなら話は別ですが。(以下画面)
![setup3.png](https://qiita-image-store.s3.amazonaws.com/0/230050/f574bbb5-4970-e215-dbc3-ab96ba4b813c.png)

![setup4.png](https://qiita-image-store.s3.amazonaws.com/0/230050/33750186-13d8-94b2-0778-457b48c36fe8.png)
次にショートカットを作成するかどうか聞かれます。ここは各自でチェックを入れるなりしてください。
**next** 押下でダウンロードが始まります。そこまで時間はかからないかと思います。
ダウンロードが完了しましたら、**Start Android Studio** にチェックが付いていますのでそのまま**Finish**押下でAndroid Studioが起動します。

以上でアップデート&インストール編は完了となります。

## 初期設定編
まず初めにJDKのパス通しをします。
![setup6.png](https://qiita-image-store.s3.amazonaws.com/0/230050/8b39f049-d6e1-8593-2ba1-63b06efc978e.png)
インストール完了後、このような画面が立ち上がると思うので、上記画像のように`Configure→Project Defaults→Project Structure`を押します。
すると以下画面になるかと思います。
![setup.png](https://qiita-image-store.s3.amazonaws.com/0/230050/7fdb30b5-5ce0-4f85-8e78-4c52d33c4542.png)
青チェックの入っている**Use embedded JDK(recommended)**のチェックを外し、インストールしたJDKのディレクトリを選択します。
WindowsではJDKディレクトリが標準であれば、**C:\Program Files\Java\jdk1.8.0_161** を割り当てれば完了です。

余談ですが、Android Studio起動時に前回のプロジェクトが開いてしまうのでそれを無効にしたい場合は
![setup.png](https://qiita-image-store.s3.amazonaws.com/0/230050/532af522-ae36-658a-2a97-457e27d60ab6.png)
上記画像の赤枠で囲った部分のチェックを外せば、次回のAndroid Studio起動後でもプロジェクト新規作成画面になります。

おつかれさまでした、以上でメモとなります。不明点や誤字脱字など御座いましたらコメントの方お願いいたします。
How to access Tomcat manager from outside

### Symptom

After updating Tomcat 8.5.27, Tomcat mamager, host-manager app cannot be accessed except localhost, 127.0.0.1

### How to fix

 comment out org.apache.catalina.valves.RemoteAddValve

- before

```${catalina.base}/conf/Catalina/localhost/manager.xml
<Context antiResourceLocking="false" privileged="true" >
  <Valve className="org.apache.catalina.valves.RemoteAddrValve"
         allow="127\.\d+\.\d+\.\d+|::1|0:0:0:0:0:0:0:1" />
```

```${catalina.base}/conf/Catalina/localhost/host-manager.xml
<Context antiResourceLocking="false" privileged="true" >
  <Valve className="org.apache.catalina.valves.RemoteAddrValve"
         allow="127\.\d+\.\d+\.\d+|::1|0:0:0:0:0:0:0:1" />
```



- after

```${catalina.base}/conf/Catalina/localhost/manager.xml
<Context antiResourceLocking="false" privileged="true" >
  <!--
    Remove the comment markers from around the Valve below to limit access to
    the manager application to clients connecting from localhost
  -->
  <!--
  <Valve className="org.apache.catalina.valves.RemoteAddrValve"
         allow="127\.\d+\.\d+\.\d+|::1|0:0:0:0:0:0:0:1" />
  -->
```

```${catalina.base}/conf/Catalina/localhost/host-manager.xml
<Context antiResourceLocking="false" privileged="true" >
  <!--
    Remove the comment markers from around the Valve below to limit access to
    the host-manager application to clients connecting from localhost
  -->
  <!--
  <Valve className="org.apache.catalina.valves.RemoteAddrValve"
         allow="127\.\d+\.\d+\.\d+|::1|0:0:0:0:0:0:0:1" />
  -->
 ```


### References

 [59672](https://bz.apache.org/bugzilla/show_bug.cgi?id=59672): Update the security considerations page of the documentation web application to take account of the fact that the Manager and HostManager applications now have a RemoteAddrValve configured by default.
 
cf. https://stackoverflow.com/questions/36703856/access-tomcat-manager-app-from-different-host
XAMPP 日本語表示できない 備忘録

XAMPPをインストールしてHTMLファイルに日本語入力して文字化けして困るときの対処法を記す。

**SOURCEFORGE japanese xampp**

とかでググって出て来るSOURCEFORGEのサイトから取れるxampp-jaとかの感じのファイルをインストールしたらなにも設定せずに日本語が使えてる。
redcarpetでrailsにシンプルにMarkdownを適用する

# 導入

まずはいつも通り導入します

```ruby:Gemfile
gem 'redcarpet'
```

```bash
$ sudo bundle install
```

# 仕様
`redcarpet` は `options` と `extensions` によってカスタマイズが可能です

## options
出力形式や有効化するHTMLタグを設定できます
以下のようなものがあります。

|options|内容|
|:------------|:------------------------|
|filter_html| htmlタグの入力を無効化します |
|hard_wrap|空行を改行ではなく、改行を改行に変換します|
|space_after_headers|#の後に空白がないと見出しと認めません|

## extensions
適用するマークアップの設定ができます。
以下のようなものがあります。

|extensions|内容|
|:------------|:------------------------|
|autolink| リンクを読み取ってリンクタグを適用します |
|no_intra_emphasis|aaa_bbb_ccc の bbb を強調しないようにします|
|fenced_code_blocks|Qiitaのように```に囲まれた部分をコードとして装飾します|

これだけで十分ですが、もっと詳しく知りたい方は[本家](https://github.com/vmg/redcarpet)をどうぞ

# 実装例

以下のようなhelperを作成しました。

```*_helper.rb
  def md_to_html(text)
    options = {
      filter_html:     true,
      hard_wrap:       true,
      space_after_headers: true,
    }

    extensions = {
      autolink:           true,
      no_intra_emphasis:  true,
      fenced_code_blocks: true,
    }

    renderer = Redcarpet::Render::HTML.new(options)
    markdown = Redcarpet::Markdown.new(renderer, extensions)

    markdown.render(text).html_safe
  end
```

上記の設定で `md_to_html "md形式のテキスト"` でいつでもどこでもマークアップに対応できるようになります。
黒い画面でLet's EncriptのSSL証明書の有効期限を確認する

よく忘れるのでメモ

```bash
openssl x509 -in /etc/letsencrypt/live/ドメイン/cert.pem -noout -dates
notBefore=Feb  1 04:28:18 2018 GMT
notAfter=May  2 04:28:18 2018 GMT
```

notBefore：証明書の生成日時
notAfter:証明書の有効期限

参考URL：https://knowledge.sakura.ad.jp/5573/
【初心者向け】Github pagesでwebページを公開する方法

# はじめに
かっこいい自己紹介サイトやポートフォリオサイトを作りたい！
けどドメイン買ったりサーバー建てたり、、、めんどくさいしよくわかんない。
そんなあなたのために、**Github pages**というソリューションがあるそうです。

公式サイトはこちら
→https://pages.github.com/

この方法は、調べれば山ほど情報は出てきます。
なので今回は自分の備忘録かつ、自分と同レベルの初心者の方でもわかるように、
なるべく用語を使わず丁寧にまとめてみようと思います。

### 私のスペック
* プログラミング歴９ヶ月
* Progate Lv.141（でRailsにつまづいて解約） 
* N予備校で Node.js を勉強しています
* 今回の方法で公開した、自分のHPはこちら→https://sota-mikami.github.io/about/

# 大まかな手順
※Githubのアカウント登録と、ターミナルとの連携は済んでいる前提でお話を進めます

1. ローカル(お手元のPC)環境にてwebページを作成する
2. Githubで新しいレポジトリ(New repository)を作成する
3. ターミナルを開き、作ったリポジトリをクローン(git clone)する
4. ローカルで作成したファイルを、クローンしたファイルにコピー&ペーストする
5. addしてcommitしてpushする
6. ソースをマスターブランチに設定する
7. 完了！

## 1. ローカル(お手元のPC)環境にてwebページを作成する
作成しましょう。

## 2. Githubで新しいレポジトリ(New repository)を作成する
Githubにて**New repository**をクリック。
新しいレポジトリを作成します。
いくつかのサイトで、**レポジトリの名前はユーザー名にしろ！**との記載がありますが、どんな名前でも大丈夫なようです。
<img width="996" alt="スクリーンショット 2018-02-01 10.24.20.png" src="https://qiita-image-store.s3.amazonaws.com/0/205124/e80fb73c-405f-c25b-6839-da60e8b97cc1.png">
レポジトリの名前を決めたら、**Create repository**します。

![Sota Mikami something OK.png](https://qiita-image-store.s3.amazonaws.com/0/205124/97fee717-41df-1f78-aa1e-2ebb386b7f3d.png)

Create repositoryしたあと、こんなページが開きます。
赤枠で囲ったurlは次のステップで使うので控えておきましょう。


## 3. ターミナルを開き、作ったリポジトリをクローン(git clone)する
ターミナルを開きます。

```
$ git clone git@github.com:Sota-Mikami/something-OK.git
```
git clone の後ろのgit@~は、先ほどCreate repositoryしたあとに控えたコードです。
「git@github.com:ユーザー名/リポジトリ名.git」となっているはずです。

その後、

```
$ cd リポジトリ名
```
で、ディレクトリを移動しておきましょう。


## 4. ローカルで作成したファイルを、クローンしたファイルにコピー&ペーストする
git cloneすることでファイルが生成され、今そこにチェンジディレクトリ(cd)している状態です。
そのフォルダ内に、ローカルで作ったファイルの中身をそっくりそのままコピペしましょう。


## 5. addしてcommitしてpushする
ファイルがコピペできたら、今後はコードをコピペするだけです。

```
$ git add .
$ git commit -m "first commit"
$ git push origin master
```
コミットメッセージ(ここでは、"first commit")はお好きにどうぞ。
Githubのアカウント名やパスワードが聞かれた場合は、それに答えてください。
pushできたらあと一息です！

## 6. ソースをマスターブランチに設定する
Githubで作ったレポジトリの設定(Settings)に移動します。
<img width="1033" alt="スクリーンショット 2018-02-01 14.34.43.png" src="https://qiita-image-store.s3.amazonaws.com/0/205124/30205860-7145-2e93-c69e-2b85cfbc4701.png">
下の方にスクルールすると、「Github Pages」という項目が出てきます。
最後のステップではそこ設定をいじります。
Sourceがデフォルトでは**None**に設定されているかと思います。
![Options.png](https://qiita-image-store.s3.amazonaws.com/0/205124/436263fb-b26f-42c4-dd1c-8bd5a669a895.png)
それをNoneから**master branch**に変更し、Saveしましょう！
これで完成！

https://ユーザー名.github.io/リポジトリ名/
上記リンクにてアクセスできるはずです。
※反映までに数分かかるとの報告もありました。すぐアクセスできなかった場合は、少し時間を置いてみてください。

## 7. 完了！
最後に、公開されているリンクはGithubの下記部分にて確認できます。
SettingsにあるGithub Pagesの項目のところです。
![Options (1).png](https://qiita-image-store.s3.amazonaws.com/0/205124/b030ffa2-e27c-1468-39f9-b36f41e1a3b4.png)


### サイトを更新する場合
ここまで設定ができたら、更新は下記の手順を踏むだけです。

```
$ git add .
$ git commit -m "comment"
$ git push origin master
```
WildflyにMySQLをXA-datasourceとして登録する

Wildflyからnon-XA datasourceとしてMySQLを利用する場合にはConnector/JをデプロイしてからGUI画面でポチポチするだけで利用可能だが、XA datasourceとして利用する場合には少し面倒。
JBoss-cliを立ち上げてモジュール登録/データソース登録をコマンドで行うのも少々面倒なので、インストール時にデフォルトで登録されているh2データベースを参考に一気に登録する方法を以下にまとめておく。

####モジュール登録
{wildfly_home}/modules/system/layers/base/com/ 配下にh2databaseが存在するので、それと同様にmysqlのドライバを配備する。
1. ディレクトリ {wildfly_home}/modules/system/layers/base/com/mysql/main/ を作成する
2. Connector/Jのjarを作成したディレクトリに置く
3. module.xmlファイルを作成したディレクトリ配下に作成する(xmlnsの値などはh2を参考に)

```module.xml
<?xml version="1.0" encoding="UTF-8"?>
<module xmlns="urn:jboss:module:1.5" name="com.mysql">
    <resources>
        <resource-root path="mysql-connector-java-5.1.45-bin.jar"/>
    </resources>
    <dependencies>
        <module name="javax.api"/>
        <module name="javax.transaction.api"/>
        <module name="javax.servlet.api" optional="true"/>
    </dependencies>
</module>
```

####ドライバの登録
{wildfly_home}/standalone/configuration/standalone.xmlの\<datasources>\<drivers>～\</drivers>\</datasources>セクションに以下を追記する

```standalone.xml
<driver name="mysql" module="com.mysql">
    <xa-datasource-class>com.mysql.jdbc.jdbc2.optional.MysqlXADataSource</xa-datasource-class>
</driver>
```

####データソースの登録
{wildfly_home}/standalone/configuration/standalone.xmlの\<datasources>～\</datasources>セクションに以下を追記する。
ここではlocalhost上のmysqlにsslを使わずに接続することとし、DBのスキーマ名はoperator、JPAエンティティで用いているjndi名ならびにpool名はjava:/Operator,Operatorとした例を挙げる。

```standalone.xml
<xa-datasource jndi-name="java:/Operator" pool-name="Operator" enabled="true">
    <xa-datasource-property name="URL">
        jdbc:mysql://localhost:3306/operator?useSSL=false
    </xa-datasource-property>
    <driver>mysql</driver>
    <transaction-isolation>TRANSACTION_REPEATABLE_READ</transaction-isolation>
    <xa-pool>
        <min-pool-size>2</min-pool-size>
        <initial-pool-size>2</initial-pool-size>
        <max-pool-size>4</max-pool-size>
        <prefill>true</prefill>
        <flush-strategy>FailingConnectionOnly</flush-strategy>
    </xa-pool>
    <security>
        <user-name>データベース接続ユーザ名</user-name>
        <password>データベース接続パスワード</password>
    </security>
    <validation>
        <valid-connection-checker class-name="org.jboss.jca.adapters.jdbc.extensions.mysql.MySQLValidConnectionChecker"/>
        <background-validation>true</background-validation>
        <background-validation-millis>60000</background-validation-millis>
        <exception-sorter class-name="org.jboss.jca.adapters.jdbc.extensions.mysql.MySQLExceptionSorter"/>
    </validation>
    <statement>
        <share-prepared-statements>false</share-prepared-statements>
    </statement>
</xa-datasource>
```

以上設定の上でWildflyを起動し、GUIまたはログでXA-datasourceとして登録されたことを確認する。
なおデフォルトで設定されているExampleDSだが、ただ単に消しただけでは"DefaultDatasourceが無い"といったエラーを吐いて停止してしまうので、別途対策を行わない場合にはstandalone.xmlに残したままにしておくこと。
あとはnon-XAの場合と同様に、GUI上でプチプチ設定してやればstandalone.xmlに反映される。
MovableTypeでパンくずのテンプレートモジュールを作成

MTを構築した際、全ページ共通で使えるパンくずのテンプレートモジュールを作成したので、作り方をメモしておきます。

# 前提
各ページにページIDを構造的に定義します。
こうすれば、例えばID01-で部分一致させれば、ID01-未満全て（ID01-01,ID01-02,ID01-01-01...）を絞ることができます。

|パス|ページID|ページ内容|
|:--|:--|:--|
|/|ID00|トップページ|
|/blog01/|ID01|ブログ01トップ|
|/blog02/|ID02|ブログ02トップ|
|/blog02/page01/|ID02-01|ブログ02ページ01|
|/blog02/page02/|ID02-02|ブログ02ページ02|
|/blog02/page02/sub01/|ID02-02-01|ブログ02ページ02の下位ページ01|
|/blog02/page02/sub02/|ID02-02-02|ブログ02ページ02の下位ページ02|

# ウェブページ
タイトルを以下のようにIDに[]をつけて設定する。
`[ID02-01]ブログ02ページ01`
HTMLに吐き出される際は[]は書き出さない。

# IDの割り当て
各ブログでアーカイブテンプレートを作成するときに、タイトルをIDとタイトル文字に分けて、それぞれpage_titleとpage_idに格納。
page_idは後述の`<$mt:Include parent="1" module="パンくず"$>`で使用。

```%b.html
<mt:SetVars>
  page_title=<$mt:PageTitle  regex_replace="/\[[\w-]+\]/","" $>
  page_id=<$mt:PageTitle regex_replace="/(\[|\].+)/g","" $>
</mt:SetVars>

<!DOCTYPE html>
<html lang="ja">
<head>
  <$mt:Include parent="1" module="HEAD"$>
  <title><mt:Var name="page_title"></title>
</head>
<body>
  <$mt:Include parent="1" module="ヘッダー"$>
  <$mt:Include parent="1" module="パンくず"$>
  <$mt:PageBody$>
  <$mt:Include parent="1" module="フッター"$>
</body>
</html>
```


# パンくず
ウェブサイトトップ -> デザイン -> テンプレート -> モジュールからパンくずを作成する。

#### 表示サンプル
自分の階層以上の階層にリンクが貼られます。

###### 第2階層のページでの表示
[TOP](/) > ブログ02トップ

###### 第3階層のページでの表示
[TOP](/) > [ブログ02トップ](/) > ブログ02ページ02

###### 第4階層のページでの表示
[TOP](/) > [ブログ02トップ](/) > [ブログ02ページ02](/) > ブログ02ページ02の下位ページ02


```パンくず.module
<mt:Ignore>########### 第2階層名 ###########</mt:Ignore>
<mt:If name="page_id" like="ID01-">
<$mt:SetVar name="bread_level_2" value="ブログ01"$>
<$mt:SetVar name="bread_level_2_dir" value="blog01"$>

<mt:ElseIf like="ID02-">
<$mt:SetVar name="bread_level_2" value="ブログ02"$>
<$mt:SetVar name="bread_level_2_dir" value="blog02"$>
...
</mt:If>

<mt:Ignore>########### 第3階層名 ###########</mt:Ignore>
<mt:If name="page_id" like="ID02-01-">
<$mt:SetVar name="bread_level_3" value="ブログ02ページ01"$>
<$mt:SetVar name="bread_level_3_dir" value="blog0201"$>

<mt:ElseIf like="ID02-02-">
<$mt:SetVar name="bread_level_3" value="ブログ02ページ02"$>
<$mt:SetVar name="bread_level_3_dir" value="blog0202"$
...
</mt:If>

<mt:Ignore>########### 出力部分 ###########</mt:Ignore>
<nav>
  <ul>
    <li><a href="/">TOP</a></li>

    <mt:If name="bread_level_2" ne="">
    <li><a href="/<mt:Var name="bread_level_2_dir">/"><mt:Var name="bread_level_2"></a></li>
    </mt:If>

    <mt:If name="bread_level_3" ne="">
    <li><a href="/<mt:Var name="bread_level_2_dir">/<mt:Var name="bread_level_3_dir">/"><mt:Var name="bread_level_3"></a></li>
    </mt:If>  
    <li><mt:Var name="page_title"></li>
  </ul>
</nav>
```


### 詳細
```
<mt:If name="page_id" like="ID01-">
```
page_idにID01-が含まれている場合の表示を設定します。
（例えばID01-01、ID01-01-01などID01を含まないID01以下のページです)


```
<$mt:SetVar name="bread_level_2" value="ブログ01"$>
<$mt:SetVar name="bread_level_2_dir" value="blog01"$>
```
bread_level_2のvalueには第2階層表示名、bread_level_2_dirのvalueには第2階層ディレクトリを設定します。


```
<mt:If name="bread_level_2" ne="">
```
第3階層以下のページで表示されます。bread_level_2が設定されていない場合は表示されません。


以上。
この記事は移行しました

うっかり仕事用のアカウントで投稿してしまったので、この記事は違うアカウントから投稿し直しました。　 

qiitaは投稿した記事を非公開にしたり削除したりする機能が無いようですので、このように跡地が残っています。　 
紛らわしくてすみません
Windows 10 > Error:この操作を実行するアクセス許可が必要です > 対処 > 再発 > ファイルの移動処理でゴーストが残っていたのかもしれない

```txt:動作環境
Windows 10 Pro (64bit) Fall Creators Update適用済
VMware Workstation 12 Pro v12.5.9 build-7535481
```

### 状況

- VMware Workstationにて共有フォルダにしているフォルダがある
- そのフォルダに実行ファイルを置いた
- 実行ファイルをビルドしなおしたので上書きをしようとした
    - >> 以下のエラーが出て上書きできない

> この操作を実行するアクセス許可が必要です

### 対処

以下で対処できそうだ。

1. フォルダ名を変更する
    - 例: tool_171219 を tool_171219b
2. ファイルを上書きする
3. フォルダ名を元に戻す

### 再発

フォルダ名を変更しても上書きできなくなった。

### ファイルが消えた

共有フォルダ設定をしていたVMwareのゲストOSをすべてシャットダウンした。

該当ファイルが消えた。

該当ファイルを移動したことになっていたのだろうか。移動処理をしてファイルがなくなった状態で、別の場所でファイルをコピーしようとしてエラーが出ていたのかもしれない。
移動済みでファイルが見えなくなるはずであるが、エクスプローラーではファイルが見えている状態になる、というのは時々発生するような気がする。
VMwareの共有フォルダの処理の不具合かもしれない。


https://www.merriam-webster.com/dictionary/decoy
> : someone or something used to draw attention away from another had a decoy distract the guard

「やつは我ら7人の小人衆9グループのおとり。。。」
【資料を美しく】クラウドサーバー・パワポ /フリー素材

【更新履歴】
2018/02/02 Azure、さくらVPS追加

---
※普段使っている私的なまとめです。
 これで大体の資料は作れます。Excel・PowerPointのオブジェクトから卒業しましょう！
# クラウドサーバー素材
構成図等の設計資料を作成時に使用します。それぞれの公式でのリンクを紹介します。
##AWS(AmazonWebService)
私はPowerPointの使用が主です。チームで設計共有するならCacooもありかな。
https://aws.amazon.com/jp/architecture/icons/
アイコン：PowerPoint、Visioステンシル、EPS/SVG、Sketch
![image.png](https://qiita-image-store.s3.amazonaws.com/0/142933/8fa79a7f-bb04-6c40-e7e6-716f7d22edb9.png)
オンライン：Lucidchart、Cacoo、Creately、draw.io、Cloudcraft、DC Solution Factory
![image.png](https://qiita-image-store.s3.amazonaws.com/0/142933/4f1471b6-970c-758c-952a-4ea774dcd0cb.png)

##GCP(GoogleCloudPlatform)
さすがGoogle。Googleスライド版もあります。
https://cloud.google.com/icons/?hl=ja
アイコン：Googleスライド、PowerPoint、EPS/SVG他
オンライン：Lucidchart、draw.io、Cacoo
![image.png](https://qiita-image-store.s3.amazonaws.com/0/142933/20134bbd-cff6-3447-c517-af94eeaf8aaa.png)

##MicrosoftAzure
以下サイトのダウンロードボタンで、一式一気に落とす方式です。
IconSet、Visio stencil, PowerPoint, PNG, SVG
https://www.microsoft.com/en-us/download/details.aspx?id=41937
![image.png](https://qiita-image-store.s3.amazonaws.com/0/142933/41b63152-f366-6246-df5a-55aa51ed3c87.png)

##さくらVPS
「こちらからダウンロードできます。」のリンクからダウンロードできます。
あまりさくらっぽさはなくて、汎用的かなーと思います。
https://knowledge.sakura.ad.jp/4724/
![image.png](https://qiita-image-store.s3.amazonaws.com/0/142933/597f77b3-cc41-d98e-7dad-e6283a524146.png)

# パワポ用素材
パワーポイントやKeynote作成時に
##ヒューマンピクトグラム
比較的真面目なプレゼン資料に人を使いたいときはこちらから頂いています。
といっても若干遊びゴゴロも多めなサイトです。
http://pictogram2.com/
![image.png](https://qiita-image-store.s3.amazonaws.com/0/142933/5ece0750-e888-96e2-d573-3b3bf364e7db.png)

##icooon-mono
アイコンサイズのものを中心に取り扱っています。
http://icooon-mono.com/
![image.png](https://qiita-image-store.s3.amazonaws.com/0/142933/1f2d08e5-9a3c-8929-8d1d-9570c06c059e.png)

##いらすとや
設計書というよりはブログでよく見る素材ですよね。メジャーなので一応紹介です。
http://www.irasutoya.com/
![image.png](https://qiita-image-store.s3.amazonaws.com/0/142933/8ccf073b-5051-c7ec-aeda-cd315cfc3cad.png)
MTアイテムのアップロードオプションを全ユーザ&全ブログに設定するjQuery

MovableTypeのアイテムのアップロードオプションを全ユーザ&全ブログに設定するjQueryを作成しました。
アイテムを追加するときは、「既存のファイルを上書きする」をデフォルトにしたいのに、ユーザを作成するたびに「既存のファイルを残して、別のファイル名でアップロードする」になってしまう・・・。
を解決するためにjQueryを書きました。

## 必要なプラグイン
[MTAppjQuery](https://github.com/tinybeans/mt-plugin-MTAppjQuery)
MTの管理画面をjQueryでカスタマイズして使いやすくするプラグインを入れておきます。


## カスタムフィールドからアイテムを追加の場合
```user.js
$(document).ready(function() {
  $('.mt-dialog').on('DOMSubtreeModified propertychange', function(){
    $('iframe').contents().find('#auto_rename_non_ascii').prop('checked', false);
    $('iframe').contents().find('#operation_if_exists').val('2');
    $('iframe').contents().find('#normalize_orientation').prop('checked', false);
  });
});
```
アイテムを追加するとき、htmlでは`.mt-dialog`クラス配下にiframeが現れます。ここの設定をjQueryで変更してしまいます。
###### 変更を監視
`DOMSubtreeModified propertychang` 
###### ファイル名の変更
`#auto_rename_non_ascii` 
###### 既存ファイルの処理
`#operation_if_exists` 

- val('1')　：既存のファイルを残して、別のファイル名でアップロードする
- val('2')　：既存のファイルを上書きする
- val('3')　：アップロードしない

###### 画像向きの修正
`#normalize_orientation` 


## メニューからアイテムを追加の場合
動的にiframeを生成するわけでないので、以下の記述のみでOK。

```user.js
$('#auto_rename_non_ascii').prop('checked', false);
$('#operation_if_exists').val('2');
$('#normalize_orientation').prop('checked', false);
```

以上。
【ASP.NET C#】Vue.jsやその他のjavascriptライブラリをDebugとReleaseで自動的に切り替える正しい方法

# 経緯

ASP.NET Web ApplicationでデフォルトのSite.Masterにこんな感じにかかれていたため、他のライブラリでやる方法を探していた。

```XML
<asp:ScriptReference Name="jquery" />
<asp:ScriptReference Name="bootstrap" />
```

検索すると自力で切り替えている人など居たので、[Microsoftのブログ](https://blogs.msdn.microsoft.com/webdev/2012/09/21/asp-net-4-5-scriptmanager-improvements-in-webforms/)通り、こんな感じでどうでしょう。
えっ、常識？
と言うか、英語のマニュアル読めば、最初から書いてある簡単なことでした。

# ASP.NET Webフォームでのやりかた

1. Nugetでvue.jsもしくはお目当てのライブラリをインストールしたり、Scriptsに直接置く。（なんでも良いけど）

2. Global.asaxのApplication_Startに記載する。（バージョン番号を変数にしたほうがスマートかもね。）

```csharp
ScriptResourceDefinition scriptRefVue = new ScriptResourceDefinition();
scriptRefVue.Path = "~/Scripts/vue.min.js"; // リリース用
scriptRefVue.DebugPath = "~/Scripts/vue.js"; // デバッグ用
scriptRefVue.CdnPath = "https://cdn.jsdelivr.net/npm/vue@2.5.13/dist/vue.min.js"; // CDNのリリース用
scriptRefVue.CdnDebugPath = "https://cdn.jsdelivr.net/npm/vue@2.5.13/dist/vue.js"; // CDNのデバッグ用
ScriptManager.ScriptResourceMapping.AddDefinition("vue", null, scriptRefVue); // ここで指定した名前がマッピングされる
```

3. Site.MasterのScriptManagerタグ内に追加

```XML
<asp:ScriptReference Name="vue" />
```

出ました！

![image.png](https://qiita-image-store.s3.amazonaws.com/0/235255/e2b3caf9-86ee-a2bc-4b44-4983a27370a8.png)

# ASP.NET MVCの場合
ASP.NET MVCだと、APP_Start.BundleConfig.csに１つ書くだけだそう。フォルダにmin.jsがあれば、リリース時にそっちを見てくれるとか。
便利な世の中になったもんだ。

```csharp
bundles.Add(new ScriptBundle("~/bundles/vue").Include(
                        "~/Scripts/vue.js"));

```

_Layout.cshtmlにはやはり１行

```csharp
@Scripts.Render("~/bundles/vue")
```
JavaScriptでPlotlyを使う時に誤って外部にデータを送信しないようにする方法

## 背景
JavaScriptでグラフを描いてみたいと思った. Plotlyを使うのがかなり便利そう. でも, Plotlyのデフォルト状態では,保存ボタンややクラウドマークがあり, 外部にデータ送信できるようになっている. 積極的に外部にデータ保存したい場合もあるけど, そうでないときもある

## 前提
ブラウザのJavaScriptでPlotlyを使う. ブラウザでなら画像保存できていい感じ. 
Plotlyのページは[こちら](https://plot.ly/) 
https://plot.ly/

## Plotlyの公式サンプル
サンプルページ
https://plot.ly/javascript/bar-charts/

``` javascript
var data = [
  {
    x: ['giraffes', 'orangutans', 'monkeys'],
    y: [20, 14, 23],
    type: 'bar'
  }
];

Plotly.newPlot('myDiv', data);
```
![Imgur](https://i.imgur.com/o8wk5AM.png)
左上のフロッピーディスクのマークや棒グラフのマークを押すとオンランでデータ編集できる. つまり, 外部にデータが送信される.

## 対処法
第4引数にオプションを追加する.

``` javascript
var data = [
  {
    x: ['giraffes', 'orangutans', 'monkeys'],
    y: [20, 14, 23],
    type: 'bar'
  }
];
Plotly.newPlot('myDiv', data, null, {
    editable: true,
    showLink: false,
    displaylogo: false,
    modeBarButtonsToRemove: ['sendDataToCloud']
  }
);
```

## 実践
[jsnote](https://toyoharu-nishikawa.github.io/jsnote/#drawCheckBox=1&sample=sample/plotly/simple_bar.js)に張り付けて, 実践してみた. layoutも追加した.

```` js
var data = [
  {
    x: ['giraffes', 'orangutans', 'monkeys'],
    y: [20, 14, 23],
    type: 'bar'
  }
];

var layout = {
  title: "animals in the zoo",
  xaxis: {
    title: "animal type"
  },
  yaxis: {
    title: "population"
  }
};

Plotly.newPlot('draw', data, layout, {
    editable: true,
    showLink: false,
    displaylogo: false,
    modeBarButtonsToRemove: ['sendDataToCloud']
  }
);
```
![Imgur](https://i.imgur.com/0d7MTke.png)

左上のフロッピーディスクのマークと棒グラフのマークが消えて, ご送信を未然防止できる.


## 参考
- [jsnote](https://toyoharu-nishikawa.github.io/jsnote/)はgithubのページでオンラインで使える.  
https://toyoharu-nishikawa.github.io/jsnote/
- [Docker Hub](https://hub.docker.com/r/toyohal24/jsnote/)からpullしても使える.  
https://hub.docker.com/r/toyohal24/jsnote/
- Git Hubのリポジトリからmasterをクローンしても使える[こちら](https://github.com/Toyoharu-Nishikawa/jsnote)
雪豹でopenocd 0.10.0をビルドしてみた

現在のopenocdはpkgを使ったconfigureになっていて、そのままではusbデバイスを使ったビルドができないので無理矢理ビルドしてみた。

まず環境変数に以下を設定。

```
CFLAGS=-Wno-override-init -I/<libusb.hのpath>
LDFLAGS=-L<libusb.aのpath> -lusb -framework IOKit -framework CoreFoundation -lobjc
```

configureの14768行に以下を追加。

```
  14768         use_libusb1=yes
  14769 $as_echo "#define HAVE_LIBUSB1 1" >>confdefs.h
  14770 $as_echo "#define HAVE_LIBUSB_ERROR_NAME 1" >>confdefs.h
```

でconfigureを実行してmake

```
./configure --disable-internal-libjaylink
make
```

libusbをスタティックリンクしているので、依存無く実行できて便利です。

0.10.0はlibftdi無しでlibusb 1だけでftなデバイスが使えるようになっているようだ。
ホームゲートウェイ(RT-500KI)でL2TP VPNサーバー設定&クライアント設定(Windows10/iPhone)

フレッツ光ネクスト契約時に設置してもらったホームゲートウェイ機器「RT-500KI」にVPNサーバーの機能があるらしいので設定してみました。(※固定IP推奨)

# 使用環境
・ホームゲートウェイ RT-500KI
・Windows10
・iPhone6 Plus
・インターリンク 固定IP(プロバイダー)

**調べてみたところRT-500KI以外にも以下の型番で同様の設定ができるようです**

```
RS-500MI、RS-500KI、RT-500MI、RT-500KI、PR-500MI、PR-500KI
RV-440NE、RV-440MI、RV-440KI、RT-400NE、RT-400MI、RT-400KI、PR-400NE、PR-400MI、PR-400KI
```

# 1.RT-500KI管理画面でVPNサーバー設定

1.管理画面にログインし「詳細設定」の「VPNサーバー設定」ページを表示

2.接続するアカウントの設定を行うので「編集」を押してID/PASSを設定(任意の文字列)

3.事前共有鍵の「表示」ボタンを押して鍵をメモします(クライアント設定時に使用)

4.VPNサーバー機能の起動「有効にする」にチェックを入れて**設定ボタンをクリックして保存します**

# 2.グローバルIPアドレスの確認

・ホームゲートウェイ管理画面から確認
・[診断くん](http://taruo.net/e/)にアクセスして確認

等有りますので環境に合わせて使い分けてください


# 3-1.クライアントVPN設定(Windows10)

「設定」->「ネットワークとインターネット」->「VPN」を表示し「VPN接続を追加する」を選択
![step4.jpg](https://qiita-image-store.s3.amazonaws.com/0/223901/117f049b-3653-7a2a-c6e2-ced0d50c83b1.jpeg)

必要情報を入力してVPN設定を行う
![step3.jpg](https://qiita-image-store.s3.amazonaws.com/0/223901/671fd6c4-6fac-2c4f-04f9-2ee961970e84.jpeg)

そのままでは接続できなかったので作成したVPN設定の変更を行います
「コントロール パネル」->「ネットワークとインターネット」->「ネットワーク接続」を表示し先程作成した名称の接続設定プロパティーを表示
![step5.jpg](https://qiita-image-store.s3.amazonaws.com/0/223901/7b30e26f-a3de-ee16-6691-a727fc33bdcd.jpeg)

以下のように変更
![step6.jpg](https://qiita-image-store.s3.amazonaws.com/0/223901/8d25c056-9c6b-474d-9f04-766610959d4c.jpeg)

これで接続ができるかを確認します。
**自宅での接続確認を行う場合はモバイル端末等の回線を使用すると自宅からでも接続確認が行なえます**

# 3-2.クライアントVPN設定(iPhone)

こんな感じで設定したら簡単につながりました
![step7.jpg](https://qiita-image-store.s3.amazonaws.com/0/223901/06066302-58d4-593c-c5b0-7e090d831e10.jpeg)


# まとめ

VPN機器を購入しようか検討していたところにまさかのホームゲートウェイの機能でVPN機能が構築できてしまいました。
今まで自宅のサーバー側(NAS等)で接続IPの制御をしていたところローカル以外すべて拒否に変えることができたので運用も楽になりました。

固定IPを使用していない人は定期的にIPが変わってしまうのでその都度クライアント設定の変更が必要になるので使いづらいと思いますが環境(固定IP等)がすでにある人はお試しください。


# 参考サイト

・[NTT ホームゲートウェイ ひかり電話ルータ L2TP VPNサーバー設定](https://www.akakagemaru.info/port/hgw-l2tp.html)
・[RT-500KI VPNサーバ設定](http://ezxnet.com/ntt/entry10214/)
Python3でpipを使いたい

##環境
OSX      10.13.1
Python   3.6.4

##試しにpipを呼び出してみる

```
$ pip -v
zsh: command not found: pip
```

command not found が出てpipが呼び出せない

##解決方法

```
pip3 -v
```

と、Python3を呼び出すかのように
pip3と呼び出すと問題なく動作した。
Killの使い方

= killの説明

== 要約
 * kill -9 (kill -s SIGKILL) すぐつかうな。プロセスに以下のクリーナップ処理の機会を与えないからな。
   * socketコネクションの切断
   * tempファイルのクリーンナップ
   * 子供たちのことを考えろ
   * プロセスのターミナル特性のリセット

    1. kill -15 (SIGTERM)
    2. kill -2 (SIGINT)
    3. kill -1 (SIGHUP)
    4. これでもだめならそんな行儀の悪いプログラムは捨てろ!
シェルスクリプト書き始めて苦戦したこと

頼まれた作業が手作業でやるにはあまりに手間だったのでシェルスクリプトに初めて手を出した．
今まで使用した言語との違いで躓いたところを今後のためにメモ書きしていく．

#グローバル変数とローカル変数
端末上でグローバル変数を宣言したつもりで

```bash
foo=123456
```

としておきスクリプト上で

```bash
sudo mkdir -p /$foo
```

と書いたところどうも変数が認識されていなかったようなので調べたところ，シェルスクリプトにおいて定義された変数はそのシェルの中でのみ有効ということらしい．端末からアクセスしている親シェルで定義した変数はシェルスクリプトで使用する子シェルでは参照できないそうだ．そのため変数をグローバル変数化するためにはexportコマンドを使用すればよいとのことなので

```bash
export foo
```

としたところ上手く実行できた．

[参考サイト](http://www.atmarkit.co.jp/ait/articles/0010/19/news003.html)

#if文
if文の基本的なコマンドについては
[シェルスクリプト(bash)のif文とtestコマンド([])自分メモ](https://qiita.com/toshihirock/items/461da0f60f975f6acb10)
を参照に作成．
その際に前提条件のところをよく読んでいなかったためunknown commandのエラーが発生．
単純に
`if [ -e $dir ];`
のように条件文の両端の括弧と条件文との間に空白が必要なためだった．また，私が知る限りの他言語と違い`if`と`[`の間にも空白が必要．

他にも上記のグローバル変数化をしたにも関わらず変数が認識されていなかったので何故かよく見てみると

```bash
if[! -d ${dir}]; then mkdir -p /$foo; fi
else ...
```

これは他サイトを参照して実行したが単純に`;`と変数の間に空白が無かったため起きていたエラーであった．シェルスクリプトでは`;`も一つの文字として認識されるようなので空白を入れる必要がある．

#まとめ
これから随時更新されていくと思います．
hyperappでview(コンポーネント)がrender(再描画)されるタイミング 

## 概要
- hyperappにおいてviewが再描画されるタイミングはいつ?
 - **react**の【**setState実行** -> **state更新** -> **コンポーネントをrender(再描画)**】に当たる部分の処理の流れを知りたい。

## reactの場合

```js
import React from 'react'
import {render} from 'react-dom'

class Counter extends React.Component {
  constructor() {
   this.state = {
    current : 0
   }
  }

  countUp() {
   this.setState({　// ★ 実行後にviewが再描画(render)される ★
    current : current + 1
   })
  }

  render() {
   return (
    <div>
      current count : {this.state.current}
      <button onClick={::this.countUp}>count up</button>
    </div>
   )
  }
}


render(
 <Counter />,
 document.getElementById('count-up')
)
```

## hyperappの場合

```js
import {h, app} from 'hyperapp'

const state = {
 current : 0
}

const actions = {
 countUp : () => state => {
  return { // ★ 実行後にviewが再描画される ★
   current : state.current + 1
  }
 }
}

const view = (state, actions) => (
     <div>
      current count : {state.current}
      <button onclick={actions.countUp}>count up</button>
     </div>
)


app(
 state,
 actions,
 view,
 document.getElementById('count-up')
)
```

## 解説
- 「actions」に定義した関数の**戻り値として渡されたオブジェクトを新たなstateとして、viewの再描画(render)が行われる**

```js
const state = {
 current : 0
}

const actions = {
 countUp : () => state => {
  // reactの【 setState({ current : this.state.current + 1 }) 】に当たる
  return {
   current : state.current + 1
  }
 }
}
```

#### 追記
試していく中で気づいて、自分的にすごくスッキリしたので記事にしましたが、[公式のサンプル](https://github.com/hyperapp/hyperapp#getting-started)をしっかり読めばその時点で気付けそうなもんでしたね。
Redashの内部データベースに直接クエリーする

Redashを使い込んでいくと、だんだんRedash内部のMetadataデータベースに直接クエリーをかけたくなってきます。

* [redashに接続されるデータソースを運用する際に確認しておきたいredashのmetadata](https://qiita.com/hideji2/items/ffc5ede1f20e194b9a56#_reference-c436bd02ef47c26c1ed7)
* [Redashのmetadataから便利な情報を取ってくる話](https://qiita.com/lab0926/items/89681649decfc378c36a)

どんな用途があるのか上記記事が色々と参考になりますが、私の環境ではバージョンの違いなのか、記事に書いているようなユーザー名とパスワードでDBにアクセスすることができなかったので、Postgreの新規ユーザーを作りRedashでアクセスするまでの手順をまとめました。AMIからRedash環境を構築した場合の話ですのでDockerから作っている人には必要のない手順かと思います。

---

まずはsshでRedashを立ち上げているサーバーにログインし、postgresユーザーでredashデータベースに接続します。

```
sudo -u postgres psql redash
```

現状のユーザー一覧を確認します。

```
redash=# \du
                                   List of roles
 Role name |                         Attributes                         | Member of
-----------+------------------------------------------------------------+-----------
 postgres  | Superuser, Create role, Create DB, Replication, Bypass RLS | {}
 redash    |                                                            | {}
```

`redash`というユーザーが存在することがわかりますが、今回はこれとは別に読み込み専用のユーザーを作成しようと思います。ユーザー名は`redash_reader`、パスワード`redash_reader`で作成しますので、自由に変更してください。

```
#redash_readerを"redash_reader"というパスワードで作成
redash=# CREATE ROLE redash_reader WITH PASSWORD 'redash_reader' NOCREATEROLE NOCREATEDB NOSUPERUSER LOGIN;

#redash_readerユーザーにSELECT権限を付与
redash=# GRANT SELECT ON ALL TABLES IN SCHEMA public TO redash_reader;
```

念のためredash_readerユーザーが作成されたことを確認します。

```
redash=# \du
                                     List of roles
   Role name   |                         Attributes                         | Member of
---------------+------------------------------------------------------------+-----------
 postgres      | Superuser, Create role, Create DB, Replication, Bypass RLS | {}
 redash        |                                                            | {}
 redash_reader |                                                            | {}
```

後はredashの管理画面のDATA SOURCESからPostgreSQLを選択肢、先ほど作成したユーザー名とパスワードを入力。Database Nameは```redash```です。
<img width="882" alt="Screen Shot 2018-02-01 at 12.18.50.png" src="https://qiita-image-store.s3.amazonaws.com/0/51569/55377440-3b72-2629-120b-c021839b5ec9.png">


Test Connectionが成功すればあとはクエリーを書くだけです。

<img width="847" alt="Screen Shot 2018-02-01 at 12.28.52.png" src="https://qiita-image-store.s3.amazonaws.com/0/51569/7698afca-e06c-e48d-cccd-0ae4b3e1e853.png">
bashのプロンプトをちょっと見やすくした


```
$ vim ~/.bashrc
```

.bashrcに下記を追記

```
export PS1="\[\e[32m\]\u@\h:\w\[\e[0m\]\\n\\$ "
```

変更を反映

```
$ source ~/.bashrc
```

これで.bashrcが再読込されるけど、どうやらMacはターミナル起動時に.bashrcが読み込まれるようになっていない？

```
$ vim ~/.bash_profile
```

下記を追記

```
if [ -f ~/.bashrc ] ; then
. ~/.bashrc
fi
```

ターミナル再起動

![スクリーンショット 2018-02-01 12.42.46.png](https://qiita-image-store.s3.amazonaws.com/0/124843/caa29ee6-30de-dd7a-9eef-7f0352078211.png)

ちょっと見やすくなった

オススメの設定があったら知りたい:flushed: