OmniAICreator/Qiita-1.07M huggingface dataset:
serverを巡回し、各サーバでdf; wを実行しサーバの状況を一括出力するスクリプト


##概要
リストに記述したサーバをssh接続で巡回し、各サーバで単純なコマンドを実行し、その出力を一括してlessで見る。

追記：実行中に出力を見られるように、teeで改変

##環境
- スクリプト実行:MacOS (Mojave) GNU bash, version 3.2.57(1)-release (x86_64-apple-darwin18)
- サーバ群：Ubuntu, Debian, CentOS, MacOS, Raspbian

##準備
- 各hostは鍵認証でsshログインできるように、あらかじめ設定しておきます。
- ~/.ptrlにホスト名を列挙しておきます。

```~/.ptrl
host1
host2
.
.
hostn
```
##スクリプト
- cmmnd1には、実行したいコマンドを記述しておきます。


```:~/bin/ptrl
#!/bin/bash
hosts=`cat ~/.ptrl`
cmmnd1="df -H; w; exit"
logf="/tmp/ptrl"

date >$logf
for host in $hosts;
do
        echo "----------------------------"
        echo $host
        echo "----------------------------"
        echo "$cmmnd1" |ssh $host
#done >>$logf 
#コマンド実行中に出力をみられるように改変
done |tee -a $logf
less $logf
```

- /tmp/ptrlには、最新の巡回結果を残しておきます。

##出力例
```
2019年 4月23日 火曜日 23時52分40秒 JST
----------------------------
host1
----------------------------
Linux host1 4.9.0-8-amd64 #1 SMP Debian 4.9.144-3.1 (2019-02-19) x86_64

The programs included with the Debian GNU/Linux system are free software;
the exact distribution terms for each program are described in the
individual files in /usr/share/doc/*/copyright.

Debian GNU/Linux comes with ABSOLUTELY NO WARRANTY, to the extent
permitted by applicable law.
Filesystem      Size  Used Avail Use% Mounted on
udev            488M     0  488M   0% /dev
tmpfs           100M   13M   88M  13% /run
/dev/vda2        50G  7.9G   39G  17% /
tmpfs           499M     0  499M   0% /dev/shm
tmpfs           5.0M     0  5.0M   0% /run/lock
tmpfs           499M     0  499M   0% /sys/fs/cgroup
tmpfs           100M     0  100M   0% /run/user/1000
 23:52:40 up 1 day, 13:40,  2 users,  load average: 0.00, 0.05, 0.01
USER     TTY      FROM             LOGIN@   IDLE   JCPU   PCPU WHAT
----------------------------
host2
----------------------------
Linux host2 4.9.0-8-amd64 #1 SMP Debian 4.9.144-3.1 (2019-02-19) x86_64

The programs included with the Debian GNU/Linux system are free software;
the exact distribution terms for each program are described in the
individual files in /usr/share/doc/*/copyright.

Debian GNU/Linux comes with ABSOLUTELY NO WARRANTY, to the extent
permitted by applicable law.
ファイルシス   サイズ  使用  残り 使用% マウント位置
udev             488M     0  488M    0% /dev
tmpfs            100M   12M   88M   13% /run
/dev/vda2         50G  6.7G   41G   15% /
tmpfs            499M     0  499M    0% /dev/shm
tmpfs            5.0M     0  5.0M    0% /run/lock
tmpfs            499M     0  499M    0% /sys/fs/cgroup
tmpfs            100M     0  100M    0% /run/user/1000
 23:52:41 up 1 day,  1:34,  1 user,  load average: 0.00, 0.00, 0.00
USER     TTY      FROM             LOGIN@   IDLE   JCPU   PCPU WHAT
<以下略>
```
Concurrency Method in Java with basic example

Java Concurrency Method basic example
**What is a Thread**
A Thread is a lightweight Process. Any Process can have multiple Threads running in it.
For example in a web browser, we can have one thread Which will load the User Interface and we can have one more thread which will actually retrieve all the data that needs to be displayed in the User Interface.
**What is Multi-Threading**
Multithreading enables us to run Multiple Threads Concurrently.
For example in a web browser, we can have on the thread which handles the User Interface and in Parallel, we can have one more thread which is fetching the data to be displayed.
So multithreading improves the responsiveness of a System.
**What is Concurrency**
Concurrency in the Context of Threads enables us to run multiple Threads at the same time. Here [Java concurrency example](http://candidjava.com/tutorial/java-concurrency-and-executors-framework-example/).
But do the Threads Really run at the same time?
**Single Core Systems**
The Thread Scheduler provided by the JVM decides which Thread runs at any given time. The scheduler gives a small time slice to each Thread.
So at any given time, we have an only thread which is actually running in the processor. But because of the time slicing, we get the feeling that multiple threads are running at the same time.
**Multi Core Systems**
Even in Multiple Core systems, the thread scheduler is involved. But since we have multiple cores, we can actually have multiple threads running at the exact same time.
For example, if we have a dual-core system, then we can have 2 threads running at the exact same time. The first thread will run in the first core, and the second thread will run in the second core.
**Why is Multi-threading needed?**
Multithreading enables us to improve the responsiveness of a System.
For example in a web browser, if everything ran in a single Thread, then the system will be completely unresponsive whenever data is being fetched to display. If it takes 10 seconds to fetch the data, then in that 10 seconds we won't be able to do anything else in the web browser like opening new tabs or even closing the web browser.
So running different parts of a program in different threads concurrently helps improve the responsiveness of a system.
**How to write Multithreaded Programs in Java**
We can create Threads in java using the following
Extending the Thread Class
Implementing the Runnable Interface
Implementing the Callable Interface
By using the Executor Framework along with Runnable and Callable Tasks
React NavigationでDrawerNavigatorの要素ごとにスタイルを適用する

## やりたいこと
React Nativeのナビゲーションライブラリ、React NavigationでDrawerNavigatorの要素ごとに異なるスタイルを適用したい

## 解決方法
createDrawerNavigator()の引数DrawerNavigationConfigでcontentComponentを指定してやれば良い。

例えば、Drawerの１要素を以下のようにTouchableComponentで定義する

```jsx
<TouchableOpacity onPress={() => navigation.navigate('A')}>
  <Text style={styles.titleA}>A</Text>
</TouchableOpacity>
```

Drawerの要素分だけ定義し、それぞれstyleを適用する。

```jsx
import { SafeAreaView } from '@react-navigation/native';

const DrawerContents = ({ navigation }) => (
  <SafeAreaView forceInset={{ top: 'always' }}>
    <TouchableOpacity onPress={() => navigation.navigate('A')}>
      <Text style={styles.titleA}>A</Text>
    </TouchableOpacity>
    <TouchableOpacity onPress={() => navigation.navigate('B')}>
      <Text style={styles.titleB}>B</Text>
    </TouchableOpacity>
  </SafeAreaView>
);

const styles = StyleSheet.create({
  titleA: {
    padding: 10,
    fontSize: 18,
    fontWeight: '600',
    backgroundColor: 'red',
  },
  titleB: {
    padding: 10,
    fontSize: 18,
    fontWeight: '600',
    backgroundColor: 'blue',
  },
});
```

これをDrawerNavigationConfigのcontentComponentに登録すれば良い。

```jsx
import { createDrawerNavigator } from 'react-navigation';

const DrawerNavigator = createDrawerNavigator(
  {
    A: ScreenA,
    B: ScreenB,
  },
  {
    contentComponent: DrawerContents,
  }
);
```
iOS12.2からはSafari PWAでSNSログインが出来るようになった

## iOS12.2からはSafari PWAでSNSログインが出来るようになった
iOS12.2以前のPWAでは、OAuthログインの処理にバグがありました。

そのため、このような記事まで書いたほどです。
iOSのPWAはSNSログインが出来ないので今だに使い物にならないという話
https://qiita.com/ToshioAkaneya/items/f8c59726ffe8c5127050

しかし、iOS12.2からはこのバグが修正されました。これでPWAを導入するデメリットがほとんどなくなったと言えると思います。
## 終わりに
私は現在、Web3のサービスの開発をしています。詳しくはこちらの記事をご覧下さい。
        [無料でイーサリアムが当たる、Web3時代の寄付サイトを作った話](https://note.com/kenroda/n/n814347fbdcd7)
github desktop にてthis folder contains files !

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


今回のハマり。。。。。。

#github desktop にて



今回からスクール最終課題の初めてのチーム開発ということでチーム皆がgithubからリポジトリをクローンして作業していくのですが、俺のgithub desktop(アプリ)では何故かローカルでコード記述変更等しても反映されない。変更の履歴が一切反映されてない。やばい。。。。
ということで、とりあえず、一回クローンしたリポジトリをローカルの方で削除。

そして、再度git cloneしようと思ったらgithub desktopの方で


##this folder contains files! git can only clone to empty file!

とのメッセージが!!!!
cloneできない。

Google先生に翻訳してもらいましたよ。

**「このフォルダにはファイルが含まれています。 gitは空のファイルにしかクローンできません！」**

とのこと。
で、ファイルを探してたら、何故か普段使ってないディレクトリにそのファイルがありました。
そしてそのファイルを消したら。問題なくgit cloneできました。


これも速攻で英文を翻訳すれば良かったのに、とにかく消してやり直すという行為を何回も繰り返してしまい、反省材料になりました。
やはり、エラー系の文章はしっかり翻訳してから行動した方が近道だと思いました。
ABC - 036- A&B&C

#AtCoder ABC 036 A&B&C
[AtCoder - 036](https://atcoder.jp/contests/abc036)

**2019/05/27**
　問題名修正

#A - お茶

 - $b \div a$だけだと端数切捨てなので、 $ b \%  a$が0より大きければ追加で箱を一つ買う

```java
	private void solveA() {
		int a = nextInt();
		int b = nextInt();

		out.println((b / a) + (b % a > 0 ? 1 : 0));
	}
```

#B - 回転

 - 90度回転

```java
	private void solveB() {
		int numN = nextInt();
		char[][] wk = IntStream.range(0, numN).collect(() -> new char[numN][numN],
				(t, i) -> {
					t[i] = next().toCharArray();
				}, (t, u) -> {
					Stream.concat(Arrays.stream(t), Arrays.stream(u));
				});

		for (int j = 0; j < numN; j++) {
			StringBuilder builder = new StringBuilder();
			for (int k = numN - 1; k >= 0; k--) {
				builder.append(wk[k][j]);
			}
			out.println(builder.toString());
		}
	}
```

#C - 座圧

 - 手法としては**座標圧縮**というらしい

圧縮結果としては以下のようになる（大小関係のみ保持している感じ）

|||||||||||||
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
||3|3|1|6|1|->|1|1|0|2|0|
||3|3|1|90|1|->|1|1|0|2|0|
||9|9|1|10|1|->|1|1|0|2|0|
||9|9|5|10|5|->|1|1|0|2|0|

 - 1,3,6をソートする。

|||||||||||||
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
||3|3|1|6|1|->|1|1|3|3|6|

 - 1は1番目に出現
 - 3は2番目に出現
 - 6は3番目に出現

最小なので、1番目に出現を0番目に置き換えて、$a_i$が出現した番号を出力

|||||||||||||
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
||3|3|1|6|1|->|1|1|0|2|0|

```java
	private void solveC() {
		int numN = nextInt();
		int[] wk = new int[numN];
		Set<Integer> wkL = new HashSet<Integer>();
		for (int i = 0; i < wk.length; i++) {
			wk[i] = nextInt();
			wkL.add(wk[i]);
		}

		List<Integer> tmp = new ArrayList<Integer>();
		tmp.addAll(wkL);
		Collections.sort(tmp);

		for (int i = 0; i < wk.length; i++) {
			int position = Collections.binarySearch(tmp, wk[i]);
			position = position >= 0 ? position : ~position;
			out.println(position);
		}
	}
```
【ExcelVBA】配列/動的配列の要素数を安全に求める

# はじめに

Excelでマクロを書いていると、稀に配列の要素数（長さ）を求めたい時があります。
Javaであれば `{配列}.length` で簡単に求められますが、VBAの場合はそこまで簡単ではありません。

# UboundとLbound

VBAにはUboundとLboundという関数がありますが、これらの関数は以下のように「添え字の最大値/最小値を求める」という処理になっています。
配列の要素数に近いものではありますが、残念ながら配列の要素数そのものではありません...

|関数名|処理内容|
|---|---|
|Ubound(配列)|配列の添え字の最大値を返す。|
|Lbound(配列)|配列の添え字の最小値を返す。|

# 自作関数で配列の要素数を求める

以下のコードの「CalcArrayLength」という自作の関数が、配列の要素数を求める処理になります。

工夫した点は「引数をVariant型にすることで、配列がInteger型でもString型でも関係なく処理できる」という部分です。
引数をVariant型にすると、配列以外が引数となる恐れがあるため、IsArray関数で配列であるかどうかをチェックしています。

また、引数が「Redimで初期化されていない動的配列」の時は、On Error GoToを活用してエラーを吸収するようにしました。
「動的配列が初期化済みかどうかはSgn関数を使って調べる」と書かれているサイトも多いですが、@satoko138 さんの[こちらの記事](https://qiita.com/satoko138/items/7e06dda56683065968f7)によると「Sgn関数を使って判定するのは不適切」ということなので、それを踏まえた実装にしてみました。

```vb:Module1
Option Explicit

Sub Test()
    ' 要素数が11の配列（※添え字が0～10）
    Dim ary1(10) As Integer
    MsgBox "ary1の長さ：" & CalcArrayLength(ary1)

    ' 要素数が10の配列（※添え字が1～10）
    Dim ary2(1 To 10) As String
    MsgBox "ary2の長さ：" & CalcArrayLength(ary2)
    
    ' 初期化済みの動的配列（※添え字が0～5）
    Dim ary3() As String
    ReDim ary3(5)
    MsgBox "ary3の長さ：" & CalcArrayLength(ary3)
    
    ' 引数が初期化されていない動的配列→-1が返される
    Dim ary4() As String
    MsgBox "ary4の長さ：" & CalcArrayLength(ary4)

    ' 引数が配列以外→-100が返される。
    MsgBox "配列以外：" & CalcArrayLength("abc")
End Sub


' 配列の要素数を求める。
'
' ary：対象となる配列。
' return：配列の要素数。引数として初期化されていない配列を指定した時は-1、配列以外を指定した時は-100を返す。
Function CalcArrayLength(ary As Variant) As Integer
    If (IsArray(ary)) Then
        If (IsInitialized(ary)) Then
            CalcArrayLength = UBound(ary) - LBound(ary) + 1
        Else
            CalcArrayLength = -1
        End If
    Else
        CalcArrayLength = -100
    End If

End Function

' 配列が初期化されているかをチェックする。
'
' ary：対象となる配列。
' return：配列が初期化済みならTrue、そうでなければFalseを返す。
Function IsInitialized(ary As Variant) As Boolean
    On Error GoTo NOT_INITIALIZED_ERROR
    Dim length As Long: length = UBound(ary)    ' 動的配列が初期化されていなければ、ここでエラーが発生する。
    IsInitialized = True
    Exit Function
   
' 配列が初期化されていない場合はここに飛ばされる。
NOT_INITIALIZED_ERROR:
    IsInitialized = False
End Function
```
wordpressをローカルに落としていじる

自分用メモです。

##①MAMPをDL
https://www.mamp.info/en/
従っていけばアプリケーションフォルダに配置されたはず

##②DB作成
MAMPのサイト>TOOLS>PHPMYADMIN>Databases
で、DBを作成する

##③WordPressをDL
https://ja.wordpress.org/
従っていけばダウンロードフォルダに配置されたはず

##④WordPressをhtdocsに移動させる

アプリケーション＞MAMP＞htdocs
この中に、DLしたwordpressフォルダごといれる

##⑤サイトにアクセス
[localhost:8888](http:localhost:8888)

そうするとwordpressの画面になるので設定をしていくと入れる


##番外編(テーンプレート)
今回の場合、wordpress用のテーンプレートは出来上がっていて、それをローカルに移して動くか確認作業を行わなきゃいけなかったんだけど、wpサイトの`テーンプレート追加`でzipファイルを入れたらできる風だったんだけどできなくて、zipファイルを解凍したら`フォルダ左下に矢印が表示`されていて、それは`エイリアス`ってやつでファイルあるように見えるけど実は空だよーみたいなテンションらしく、結局`git clone`して、ファイルをローカルにおいてから、そのファイルを`アプリケーション＞MAMP＞htdocs>wordpress>wp-content>themes`にいれたらテーンプレートが表示された。

##番外編(Sass)
そのテーンプレート？のスタイル変更をする場合はSCSSファイルをいじってサイトに反映させるようになっていたらしく、cssファイルをいじっても無駄で、scssファイルを変更>ターミナルで`$ sass theme.scss:theme.css`（scssのファイル名:cssファイル名）をうつ
そうするとscssフォルダにtheme.cssという初見ファイルができる
<img width="671" alt="スクリーンショット 2019-04-23 23.14.33.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/265805/8716aeb6-fadd-2aee-2ad8-c0fadf6c79a5.png">

それを、sassフォルダと同じ階層のcssフォルダに上書きすればスタイルが変更されているのがわかる。



###参考サイト
https://bazubu.com/how-to-insall-wp-in-mamp-23798.html
https://qiita.com/MasatoKawakami/items/7038267359a792c08ff6
Nuxtでfetchした時、ローカルAPIが404になる

# 404が帰ってくる
fetchでapiを叩き、ローカルの関数を実行しようとすると

```vue:entryList.vue
<script>
export default {
  fetch ({ store, params }) {
    store.dispatch('getEntries')
  }
}
</script>
```

```js:store/index.js
<script>
export const actions = {
  getEntries({ commit }) {
    axios.get('/api/getEntries')
    .then((entries) => {
      commit('setEntries', entries)
    })
  }
}
</script>
```

みたいな感じになると思うのですが、404が帰ってくる。

# 原因
クライアントサイドとサーバーサイドでaxiosのbaseUrlを分けていなかったのが原因。
https://ja.nuxtjs.org/api/configuration-env/

答えはいつもドキュメント。
単一行のときは中央揃え、複数行のときは左揃えになるflexbox

# 概要
- flexコンテナの横幅を超えたら折り返すタイプ（ `flex-wrap: wrap` ）のflexbox
- flexアイテムが単一行かつflexコンテナの幅いっぱいにならないときのみ中央揃えにする
  - `justify-content: center` は用いず、flex-startのままmarginで中央に寄せる

# サンプルコード

<p class="codepen" data-height="265" data-theme-id="0" data-default-tab="css,result" data-user="osawa__" data-slug-hash="gydREW" style="height: 265px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid black; margin: 1em 0; padding: 1em;" data-pen-title="1行のときのみ中央寄せになるflexbox">
  <span>See the Pen <a href="https://codepen.io/osawa__/pen/gydREW/">
  1行のときのみ中央寄せになるflexbox</a> by Yuki Osawa (<a href="https://codepen.io/osawa__">@osawa__</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://static.codepen.io/assets/embed/ei.js"></script>

- SASSというかSCSSを使用
  - 素のCSSじゃなきゃいや！ っていう人はもったいないので今すぐSASSというかAltCSSの魅力を感じましょう
  - `$items_per_row` で1行におさまるflexアイテムの最大個数を指定
  - `$item_horizontal_margin` および `$item_vertical_margin` でflexアイテムのマージンを指定
  - `$container_width` でflexコンテナの幅を指定

## いくぶんトリッキーな部分の解説
```scss

width: calc((100% - #{$item_horizontal_margin} * (#{$items_per_row} - 1)) / #{$items_per_row});
```
単に式の見通しが悪いという話ですが、要は
「100%からflexアイテムの個数マイナス1個ぶんのマージンを引いて、それからflexアイテムの個数で割る」
という処理です
※ CSSの calc() の中では #{$hoge} としてやらないとSASSの変数が展開されない点に注意

```scss

:first-child:nth-last-child(-n+#{$items_per_row - 1}) {
  margin-left: auto;
}
```
「最初の要素かつ、最後から数えて指定の個数未満でおさまる要素」
と言葉にしてもなおわかりにくいですが、要は
「（flexアイテムが）指定の個数未満であるときの最初の要素」
ということです
そこに`margin-left: auto`を指定して、

```scss
:last-child:nth-child(-n+#{$items_per_row - 1}) {
  margin-right: auto;
}
```
「最後の要素かつ、最初から数えて指定の個数未満でおさまる要素」
つまり
「（flexアイテムが）指定の個数未満であるときの最後の要素」
に`margin-right: auto`を指定することで中央揃えを実現しています

# 免責
- HTML、JS、およびflexboxの機能に関わらないCSSは超テキトーです
- [Can I use](https://caniuse.com)と経験則によるとIE11以降OKっぽいですが、だめだったらごめんネ
- もっとイケてる実装あったらぜひ教えてください
- ネーミングセンスにまったく自信がないので自信あるひと教えてください

# 実のところ
- キモのコードを思いついたのはおれじゃなくて某友人
- リファクタリングして汎用コンポーネント……というかmixin化したのがおれ
不正なアクセスを低減させるいくつかの方法

# はじめに

実際のところ、サイト側で何をやっても不正なアクセス自体は減らない。
例えば、ファイヤーウォールなどでブロックしても、目につかなくなってるだけで不正なアクセスは発生したままだろう。
とりあえず目につかなくなれば、それで良いってことで。

ここに書いてあることは「正解」ではない。
「このような考え方もある」という程度に捉えて欲しい。
万能薬はないので、「状況に応じて適切にアレンジする」という姿勢が必要だろう。

# SSH

サーバーがあれば、たぶんメンテナンス用にSSH/22も開放してると思う。
しかし、SSH/22はアクセスが多い。
ログを確認してみると、自分以外の不正アクセスが多いことに気づくだろう。
それが少ないなら、かなりラッキーだ。

不正アクセスを減らしたいと思った場合、自分の経験では、ポートを変えてしまうのが効果的だった。
見慣れないポートに変えたら一気にアクセスが減った。というかゼロになった。
どうも、SSHに不正アクセスする側はポート22しか狙わない場合が多いようだ。

# 脆弱性のあるページを探ってるアクセス

phpMyAdminやWordPressの管理画面がインストールされてそうなURLを探るようにアクセスしてくる人たちがいる。
それらを採用してなければ、それらの脆弱性に起因する問題は発生しない。
しかし、なんかウザイわけだ。
そう思ってアクセスを減らしたいと思った場合、自分の経験では、HTTP側を閉じてしまうのが効果的だった。
どうも、探るようなアクセスをする人たちの中には、HTTP側だけにアクセスする人たちがいる。
そして、常時SSL化が普及してきた昨今、HTTP側を開放しておくメリットがどこまであるだろうか?
選択肢の一つとして頭の片隅に置いといても良いと思う。

# フォームがあるページが心配

あれこれ対策したとしても、フォームがあるページは、ちょっと心配だ。
だから、ログは確認したほうがいい。
不正なアクセスがなければ幸せだ。追加の対策は必要ないかもしれない。
でも、それは悪意のある誰かに見つかっちゃったら状況が変わるかもしれない。

見つかりにくくするには、自分では3つのネタを採用してる。

&lt;form&gt;を使わない。
それがあるから、そこにフォームがあるって判断できちゃうわけで、なければ良いのではないか? という発想だ。
&lt;form&gt;がなくても、ボタンのclickイベントを拾ってPOSTすれば問題ない。

ボタンに&lt;input&gt;とか&lt;button&gt;を使わない。
それがあるから(略)
clickイベントを拾ってPOSTするなら、&lt;input&gt;とか&lt;button&gt;じゃなくてもいいよね?
ボタンだけじゃなく、他のモノも排除できたら完璧かもしれない。

最初のGETに対してHTMLの枠組みと基礎的なJavaScriptだけ返し、そのJavaScriptからページ本体をリクエストさせる構成にする。
そうすると、フォームを探るようなアクセスでJavaScriptが処理されないなら、ページ本体が届かない。
届かないなら見つからないよね? という発想だ。
どうも、何かを探るようなアクセスではJavaScriptが処理されてる場合は少ないようだ。

現状、フォームのあるページに対する不正と思えるアクセスは皆無なので、何も考えずに3つをやっておけば良いと考えてる。

見つかりにくくするのとは違うけど、もうひとつネタがある。
POSTリクエストの遷移の正当性を確認することだ。
フォームのページをGETされたとき、サーバー側にデータを保存する。
同じものを出力するHTMLにも含めておき、POST時に送信させる。
POSTされたとき、それとサーバー側のデータを比較する。
一致してなければPOSTを信用できないので、処理する必要はない。
Leetcode #575 Distribute Candies

Time complexity: O(n), the entire candies array is traversed only once.
Space complexity: O(n), set will be of size n in the worst case

```swift
func distributeCandies(_ candies: [Int]) -> Int {
    var set = Set<Int>()
    for candy in candies {
        set.insert(candy)
    }
    return min(set.count, candies.count / 2)
}
```
CNNダウンサンプリング時の位置ずれ問題と簡単な解消方法

# はじめに

典型的なCNNでは何らかの形でダウンサンプリングが行われます。
従来は2x2プーリングをストライド2x2で使われていましたが、最近は3x3畳み込みや3x3プーリングをストライド2x2で使われることが多いようです。

このようなダウンサンプリングをする時にちょっとした罠になるのが座標計算です。
各種のディープラーニングフレームワークでは、Convolutionのパディング方式として"SAME"モードが指定できると思いますが、ナイーブにこれを使うと、ダウンサンプリング層のたびに受容領域の位置が出力に対してずれていくという問題があります。
通常のディープなモデルを使っているうちは影響は少ないですが、高速化のためにネットワークを小型化したりするとこの問題が表出してきます。

# 問題の再現

下記のようなモデルがあったとします：

```python:
h = Conv2D(1, kernel_size=(3, 3), strides=(2, 2), padding="same")(x)
h = Conv2D(1, kernel_size=(3, 3), strides=(2, 2), padding="same")(h)
h = Conv2D(1, kernel_size=(3, 3), strides=(2, 2), padding="same")(h)
y = Conv2D(1, kernel_size=(3, 3), strides=(2, 2), padding="same")(h)
```

このとき、受容領域は次のようになります。
出力が左上と右下にあるときを比較すると、出力座標に対して受容領域の位置がずれていることがわかります。

出力セル：
![imageonline-gifspeed-6886473.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/191697/2b1834fd-5be3-2262-06ff-245534a00edd.gif)
対応する受容領域：
![imageonline-gifspeed-6720023.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/191697/63d66acb-0cfe-546a-768d-01bcc32a7342.gif)

# 解決策

ダウンサンプリングの回数を予め考慮してはじめにパディングをしてしまうことで、簡単に解消できます。
なお入力画像サイズが偶数だと１ピクセルのずれは出ますので、その点は注意してください。

```python:
h = ZeroPadding2D(((7, 8), (7, 8)))(x)
h = Conv2D(1, kernel_size=(3, 3), strides=(2, 2), padding="valid")(h)
h = Conv2D(1, kernel_size=(3, 3), strides=(2, 2), padding="valid")(h)
h = Conv2D(1, kernel_size=(3, 3), strides=(2, 2), padding="valid")(h)
y = Conv2D(1, kernel_size=(3, 3), strides=(2, 2), padding="valid")(h)
```

同様に可視化します。治っていますね:grinning:
出力セル：
![imageonline-gifspeed-6886473.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/191697/22b5cbc6-7abb-75d8-80be-b82e800a59b6.gif)
対応する受容領域：
![imageonline-gifspeed-1062095.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/191697/ffa9e949-b353-ca24-ade4-38f6a2b9e211.gif)

# 検証用コード

検証に使ったコードを記載しておきます：

```python:cnn_receptive_field.py
from keras.layers import *
from keras import backend as K
import cv2

height, width = 128, 128
layers = 4
cell = 2**layers

# 受容領域を可視化するためのモデル
m = Input(batch_shape=(1, height//cell, width//cell, 1))
x = K.ones((1, height, width, 1))

# "same" mode
# h = x
# for i in range(layers):
#     h = Conv2D(1, kernel_size=(3, 3), strides=(2, 2), padding="same")(h)

# padding
h = ZeroPadding2D(((cell//2-1, cell//2), (cell//2-1, cell//2)))(x)
for i in range(layers):
    h = Conv2D(1, kernel_size=(3, 3), strides=(2, 2), padding="valid")(h)

d = Lambda(lambda x: x*m)(h)
g = K.gradients(d, x)

func = K.function([m], g)


# 可視化実施
count = 0
for i in range(height//cell):
    for j in range(width//cell):
        mask = np.zeros((1, height//cell, width//cell, 1))
        mask[0, i, j, 0] = 1
        grad = func([mask])[0]

        receptive_field = np.zeros_like(grad)
        receptive_field[grad != 0] = 1

        cv2.imshow("mask", mask[0])
        cv2.imshow("receptive_field", receptive_field[0])
        cv2.waitKey(0)

        # cv2.imwrite(f"img/mask{count:04d}.png", (mask[0]*255).astype(np.uint8))
        # cv2.imwrite(f"img/field{count:04d}.png",
        #             (receptive_field[0]*255).astype(np.uint8))
        # count += 1
```
ピアソンVUEでAWS認定試験を受けてきた

2019年4月8日からAWS認定試験の会場にピアソンVUEも追加されましたね。
PSI会場で受けたことはないのですが、ピアソンVUEの情報があまりないので、載せときます。
今回の試験会場は、大阪府の梅田テストセンターです。

# 試験前
AWS認定のサイトで新しい試験の予約をするとき、「ピアソンVUEによるスケジュール」を選択して画面の指示どおりに申し込みます。
ここらへんは、PSI会場のときと同じじゃないでしょうか。


# 試験当日
1. テストセンター入り
**本人確認書類が2種類必要なので、持っていくのを忘れないようにしましょう。**
詳しくはAWS認定のサイトを確認してください。私は運転免許証とクレジットカードを提示しました。
試験開始の15分前までにテストセンター入りします。
**15分前、厳守。**遅れると怒られるようです。

2. 受付
受付で何時からどの試験を受けるのか聞かれて受験規程を渡されます。表裏じっくり読みます。
AWS認定試験の場合は専用の受付用紙があるので記入し、本人確認書類2種類と一緒に受付へ提出します。
その後、カメラで顔写真を撮られました。

3. 試験会場入り
試験開始の5分前になったら、試験監督員が呼びに来ました。
**会場へ持ち込んでよいのは、受付が指定した本人確認書類1つと、ロッカーの鍵、ハンカチ、ティッシュのみです。
それ以外の荷物はすべてロッカーにINします。**
監督員に従って、パソコンのある会場へ入室します。なお、テスト中に書き込む用紙はパソコンの前に置いてありました。下敷きみたいなボードですが、消すものがないので、足りなくなった場合は監督員を呼んで新しいものと交換してもらうそうです。
パソコンの前に監督員を呼ぶボタンがありました。

4. 試験開始
監督員がパソコンの専用ソフトを起動してくれるので、待ちます。
ソフトが起動したら注意事項を読んで、試験開始です。

5. 試験終了
見直して、もーいいや！って思ったら画面上の試験終了ボタンを押します。
アンケートを9問回答したら、突然合否が表示されるので、時間が余っていたらここで少し感慨にふけっても良いでしょう。
なお、終了時間前でも退室できます。

6. テストセンター出る
終わったら、**下敷きみたいなボードと本人確認書類、ロッカーの鍵を持って**受付に戻ります。
受付でボードを返して、返却の署名をして終了です。
ロッカーの荷物を出して、ロッカーの鍵を返したらテストセンターを出ます。

# 試験後
いつかは分からないのですが、試験後6時間くらいで、AWS認定のサイトに結果が掲載されていました。

# 所感
AWS認定試験は日本語の通じない監督員と遠隔でチャットするとか、カメラで常時監視されるとか聞いていたのでビビってましたが、少なくともピアソンVUE梅田テストセンターではそんなことはなかったです。
至って普通に試験を受けられました。
同じようにビビってる方はピアソンVUEでトライしてみてはどうでしょうか。
[Python]UNIX秒(UTC)をISO8601(JST)に変換する

# 用途

データとしてはUTCのエポック秒を持ちつつビューには日本時間の見やすい表記にしたい場合

# やること

`datetime` のオブジェクトでタイムゾーンを操作して最終的に文字列や数値として書き出す

# UNIX(UTC) to ISO8601(JST)
```python
from datetime import datetime, timezone, timedelta


JST = timezone(timedelta(hours=+9), 'JST')

# [サンプル]UNIX秒(UTC)を生成
epoch = int(datetime.now(timezone.utc).strftime('%s%f')) // 1000000

# datetime(JST)に変換
dt = datetime.fromtimestamp(epoch).replace(tzinfo=timezone.utc).astimezone(tz=JST)

# ISO8601表記
print(dt.isoformat()) 

# あるいは任意のフォーマット
print(dt.strftime('%Y-%m-%d %H:%M:%S'))
```


# ISO8601(JST) to UNIX(UTC)

```python
from datetime import datetime, timezone, timedelta


JST = timezone(timedelta(hours=+9), 'JST')

# [サンプル]時刻を表す文字列(JST)を生成
now = datetime.now(JST).strftime('%Y-%m-%d %H:%M:%S')

# datetime(UTC)に変換
dt = datetime.strptime(now, '%Y-%m-%d %H:%M:%S').astimezone(tz=JST).replace(tzinfo=JST).astimezone(tz=timezone.utc)

# UNIX時間(UTC)
print(int(dt.strftime('%s%f')) // 1000000)
```
クエリを書くときの注意

#SQLを書くときの注意点
###先輩からコードレビューで指摘をもらったのでメモ

####悪い例

```sql
select * from BbsApp
where id <> 20
```

↑のクエリでは20に等しくないレコードを取得している。
ですが、このクエリだと実行時に全レコードの20ではないやつを探り、データが多ければ多いほど負荷がかかってきてしまう。
「!=」も同様。

####良い例
```sql
select * from BbsApp
where id < 20
````

必ずどちらかの不等号をつけて実行する。
↑のクエリであればid < 20なので20より下のレコードを探るので、負荷が軽減される。
小さなことだが、データ次第では致命的になるので気を付けよ
Leetcode: #594 Longest Harmonious Subsequence

Time Complexity: O(n). One loop is required to fill map and one for traversing the map.

Space Complexity: O(n), In worst case map size grows up to size n. 

```swift
func findLHS(_ nums: [Int]) -> Int {
    var dict = [Int: Int]()
    for num in nums {
        if let value = dict[num] {
            dict[num] = value + 1
        } else {
            dict[num] = 1
        }
    }
    var answer = 0
    for num in dict.keys {
        if let value = dict[num + 1] {
            answer = max(answer, value + dict[num]!)
        }
    }
    return answer
}
```
vimで折畳み(folding)まとめ

これは良い。コーディング中にメソッドなどをまとめて視界から外すことができる。

# はじめに
普段Vimを使っていて，[コーディング中にみたくない部分を隠す方法](https://qiita.com/ysuzuki19/items/da511005ec4ac9c636e4)を考えていたのですが，コメントで`折畳`というありがたい言葉をいただきました．
自分の備忘録を兼ねて，まとめます．

# 折畳とは
IDEなどでよくある`{}や[]などをまとめて隠すもの`で，`+`や`-`でその状態が表現される（のをよく見る）．
Vimでもできるということを全く知らなかった．

# 折畳チートシート
折畳に関するコマンドは`z`から始まる．
参考は[こちら](https://vim-jp.org/vimdoc-ja/fold.html)のページおよびvim上で`:h fold`をして表示されたページとする．

折畳に関するコマンド一覧は以下である．

コマンドの動作について，特に指定しない場合はすべてカーソル行とする．

|コマンド|動作|
|---|---|
|`zf`|折畳作成|
|`zd`|折畳削除|
|`zD`|折畳を全て削除|
|`zE`|ページ全体の折畳みを全て削除|
|visual + zf|選択範囲を折畳|
|`2 + zF`|2行折畳|
|`2,5 fo`|2行から5行を折畳|
|`zo`|折畳を削除せず開く|
|`zO`|折畳みを全て削除せず開く|
|`zc`|開いている折畳を閉じる|
|`zC`|開いている折畳を全て閉じる|
|`za`|折畳の状態を切り替える|
|`zA`|全ての折畳の状態を切り替える|
|`zv`|カーソル行を表示|
|`zx`|折畳のUndo|
|`zX`|折畳のRedo|
|`zm`|ページ内の折畳を一段階閉じる|
|`zM`|ページ内の折畳を全段階閉じる|
|`zr`|ページ内の折畳を一段階開く|
|`zR`|ページ内の折畳を全段階開く|
|`2,5 foldo`|2行から5行の折畳を開く|
|`2,5 foldc`|2行から5行の折畳を閉じる|
|`zn`|ファイル全体の折畳を開く|
|`zN`|ファイル全体の折畳を閉じる|
|`zi`|ファイル全体の折畳の状態を反転|
|`zj`|上の折畳に移動|
|`zk`|下の折畳に移動|

#　Vimで折畳みを使う方法
最も簡単なのは，`zf`コマンドで折畳を作成し，`zd`コマンドで折畳を削除する．
とりあえず`Visual + zf`で選択範囲を折畳してくれるというのも覚えておいた方が良さそうだ．
全て覚えるのは面倒なので，取り敢えず自分が使っているのは，`Visual+zf`,`zd`,`zm`,`zr`である．

# folding状態を保存する
開くごとにfldingを作成し直すのは骨が折れるため，`~/.vimrc`に以下を追記することを勧める．[こちら](https://vim-jp.org/vim-users-jp/2009/10/08/Hack-84.html)のものをそのまま持ってきた．

```:~/.vimrc
autocmd BufWritePost * if expand('%') != '' && &buftype !~ 'nofile' | mkview | endif
autocmd BufRead * if expand('%') != '' && &buftype !~ 'nofile' | silent loadview | endif
set viewoptions-=options
```

# 参考
- https://vim-jp.org/vimdoc-ja/fold.html
    - foldingに関すること全般
- https://vim-jp.org/vim-users-jp/2009/10/08/Hack-84.html
    - folding状態保存方法

# おわりに
実際に自分ではまだ使っておらず，これから使おうと思っているところですので，何かあれば教えていただけると幸いです．
また，まだVim初心者ですので，他にも便利なものがあれば教えてくれると幸いです．
ペースト(貼り付け)時に構成されるHTMLを手軽に確認するサイトを構築しました。

# 作ったもの
コピペ時のHTMLの内容を可視化してくれるもの
https://furugen.github.io/Peek-at-HTML/
![ペーストgif.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/48623/b4725f59-3971-a6e5-ddce-20e56d19d22e.gif)
![Capture4.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/48623/91a6816c-dbf0-9226-ab27-34a6190234b1.gif)

# どんなもの？
Office系のソフト(ExcelやWordなど)の一部や、Webページの一部をコピーしてペーストするとそのまま見た目が貼り付けされる機能があったりしますよね。
あれらは、コピーするときにHTML化したうえでコピーされるため、ペースト時に体裁などが復元することが可能です。
今回作成したサイトは、コピーしクリップボードに保持されているHTMLの情報を可視化してくれます。

# どんな使い方を想定？
単純にどんなHTMLの構成になっているんだろう？って場面でも使えますし、
Excelなどの、HTML形式でコピーされた内容を解析するような用途でも使えます。

# HTMLの抽出方法
サンプルコード、いたってシンプルでJavascriptで貼り付け時のイベントを購読して、クリップボードからhtml形式でデータを取得してます。

```javascript

addEventListener("paste" , function(e){
     e.preventDefault();
     var html_data = e.clipboardData.getData("text/html");
});
```
Aws初学者が ソリューションアーキテクトを取得する

AWS Innovate カンファレンスなるものを見た。
これからは、クラウドだ。ということで、これまで触ったことのないAWSの知識を得るため、AWS認定試験（ソリューション　アーキテクト）を目指すことにした。

ちなみに自分は、インフラやITの基本的な知識は持っている。

##黒本（AWS認定　ソリューションアーキテクト　アソシエイト教科書）
<a target="_blank"  href="https://www.amazon.co.jp/gp/product/4295005495/ref=as_li_tl?ie=UTF8&camp=247&creative=1211&creativeASIN=4295005495&linkCode=as2&tag=carppucopage-22&linkId=576a56ea36455ec9706549c8aff5795a"><img border="0" src="//ws-fe.amazon-adsystem.com/widgets/q?_encoding=UTF8&MarketPlace=JP&ASIN=4295005495&ServiceVersion=20070822&ID=AsinImage&WS=1&Format=_SL250_&tag=carppucopage-22" ></a><img src="//ir-jp.amazon-adsystem.com/e/ir?t=carppucopage-22&l=am2&o=9&a=4295005495" width="1" height="1" border="0" alt="" style="border:none !important; margin:0px !important;" />
とりあえず一通り読んで、AWSの単語や考え方を知る。

##[AWS Well-Archtected　フレームワーク](https://d1.awsstatic.com/International/ja_JP/Whitepapers/AWS_Well-Architected_Framework_2018_JA_final.pdf)
前述の教科書、認定試験はこのフレームワークを実践的に落とし込めるということか。
###フレームワーク5本柱
・運用上の優秀性（運用管理）
・セキュリティ
・信頼性（高可用性）
・パフォーマンス効率
・コスト最適化
##[これだけでOK！ AWS 認定ソリューションアーキテクト – アソシエイト試験突破講座](https://www.udemy.com/aws-associate/learn/lecture/13377860#content)
期間限定で、無料で講義がきける。視聴した上で、6月までに試験に合格すれば、Amazonギフト券1000円がもらえる。[認定資格応援キャンペーン](https://pages.awscloud.com/JP_EV_Get_Cert_Innovate_LP.html)

##[umedy これだけでOK！ AWS 認定ソリューションアーキテクト – アソシエイト試験突破講座（初心者向け20時間完全コース）](https://www.udemy.com/aws-associate/learn/lecture/13377858)
実際のAWSを使ったハンズオンが取り入れられており、わかりやすそう。（受講中）
割引をしていて、手軽に受講できます。

受講を続けて、その感想を追記します。

##[黒本から始めるWeb問題集](https://aws.koiwaclub.com/)
1セクション7問程度　かける120セクション
問題を解きながら（暗記しながら）、AWSの特性を理解していく。
上記のudemyのハンズオンと合わせると、問題の内容と実装とがつながり、理解しやすい。

##受験してきました。6月29日
歌舞伎町の試験センターです。
結果、無事**合格**しました。（得点は別途連絡があるようです。）

難しかった。。。。


試験前日の夜と今朝の朝に、Webの問題集をやりまくりました。

試験の内容ですが、過去問やサンプル問題がそのまま出ることは、、、、まずありません。

様々な要求に対してベターなソリューションを選択肢から選ぶ問題がほとんどで、
AWSのサービスの定義や知識そのものについての問題は、ほとんどありません。

AWSのいろいろなサービス、アーキテクトの特徴をしっかりと理解して、
問いにある要求に応えられるアーキテクチャを選べるかです。

これまでやってきた試験とは、少し毛色が違いますね。。

知識とITアーキテクチャをしっかりと頭に入れて、試験に臨んでいただければと。。

次の目標を目指して！
PureScriptのTheseとネスト化Either

```
purs --version
0.12.5
```

# 前置き

## Tuple

```hs
data Tuple a b = Tuple a b
```

簡単にはa **かつ** bを表す。

レコードがあるので、パフォーマンス的な意味でもあまり使い道は無いはず。
敢えて`Tuple`を使いたいという場面は限られてきそう。

## Either

```hs
data Either a b = Left a | Right b
```

簡単にはa **または** bを表す。

これを応用して純粋な例外処理にも使える。
例外処理に使う時は慣例的に`Left`がエラーを表す。


# Theseとは？

`purescript-these`パッケージを参考にしてみる。

```hs
data These a b
  = This a
  | That b
  | Both a b
```

具体例で考えると分かりやすい。
例えば、ユーザーはTwitterアカウントかGithubアカウントのどちらかを持っていないといけないとする。
例えば以下のように書いてみる。

```hs
data UserAccount = Either TwitterAccount GithubAccount
```

上記の実装だとTwitterアカウントとGithubアカウントを同時に持つことができないという意味になってしまう。こうして見ると`Either`はXOR的にも見える。
そこで、疑似的には以下のように書くことになる。

```
UserAccount
  is TwitterAccount
  OR GithubAccount
  OR TwitterAccount AND GithubAccount
```

これは`These`を使うと簡潔に書ける。
拡張性には乏しいが、知っておくと便利かも。

```hs
data UserAccount = These TwitterAccount GithubAccount
```

# 3種類以上のデータ型の組み合わせ

# Data.Either.Nested

`Tuple`と`Either`は2つのデータ型しか組み合わせることができない。

原始的には、ネストすることで複数のデータを組み合わせることができる。
ただし、コンパイラは本来`Either a (Either b c)`や`Either (Either a b) c)`を異なるものとして認識するはずで、同じものとして使うには工夫が必要になってくる。

幸いにも`purescript-either`パッケージには`Data.Either.Nested`があり、10個までのネストに対する処理がハードコードされている。

ドキュメントの使用例が分かりやすい。

```hs
data Color = Red Number | Green Number | Blue Number

fromEither3 :: Either3 Number Number Number -> Color
fromEither3 = either3 Red Green Blue

toEither3 :: Color -> Either3 Number Number Number
toEither3 (Red   v) = in1 v
toEither3 (Green v) = in2 v
toEither3 (Blue  v) = in3 v
```

実用上は確かに10個もあれば十分そう。

11個以上のネストをする時は`Variant`を使うと良い？
(いわゆるextensibleというやつで、Proxyを筆頭とした型レベルの知識が必要になるらしい。)

# 複数のTuple

これに関しては`Tuple`を使うまでもなくレコードが良い仕事をしてくれるし、トランスパイルしたときのパフォーマンスもレコードのほうが良いはず。
JavaScript以外にトランスパイルする時は役に立つのかもしれない。
Leetcode #599 Minimum Index Sum of Two Lists

Time complexity: O(l1 + l2)
Space complexity: O(l1 * x), where x refers to the average string length

```swift
func findRestaurant(_ list1: [String], _ list2: [String]) -> [String] {
    var dict = [String: Int]()
    for (index, store) in list1.enumerated() {
        dict[store] = index
    }
    var leastIndex = 2000
    var answer = [String]()
    
    for (index, store) in list2.enumerated() {
        if let value = dict[store] {
            if value + index < leastIndex {
                leastIndex = value + index
                answer = [store]
            } else if value + index == leastIndex {
                answer += [store]
            }
        }
    }
    return answer
}
```
macOSでスリープ解除されたら自動的にWi-Fiテザリング に繋がるようにする

# 概要
ほとんど @ishkawa さんの[この記事](https://blog.ishkawa.org/2018/11/09/1541697110/)の通りだが、bluetoothテザリングがどうにも遅く、Wi-Fiテザリングに変更したときのメモ。

# 変更点
```
touch ~/bin/connectBluetoothTethering
chmod +x ~/bin/connectBluetoothTethering
```
↓

```
touch ~/bin/connectWifiTethering
chmod +x ~/bin/connectWifiTethering
```

- `~/bin/connectWifiTethering` の内容

```
#!/usr/bin/osascript

set SSID to "Your iPhone Name"
-- 他の既知のネットワークがある場合それに繋がるのを待つ
delay 3

tell application "System Events" to tell process "SystemUIServer"
	set var1 to value of attribute "AXDescription" of menu bar items of menu bar 1

	if (var1 contains "Wi-Fi, No Signal.") then
		tell application "System Events"
			tell process "SystemUIServer"
				set sMenu to (menu bar item 1 of menu bar 1 whose description contains "Wi-Fi")
				tell sMenu
					click
					-- パーソナルホットスポットが表示されるのに時間がかかるので待つ
					delay 3
					tell (menu item SSID of menu 1)
						click
					end tell
				end tell
			end tell
		end tell

	end if
end tell

```
日本語環境の場合は `"Wi-Fi, No Signal."` を `調査中` 、 `"Wi-Fi"` を `調査中` に変更。


- `.wakeup` の内容

```
~/bin/connecBluetoothTethering
```

↓

```
~/bin/connectWifiTethering
```

# 参考
https://blog.ishkawa.org/2018/11/09/1541697110/
https://discussionsjapan.apple.com/thread/110200637
https://apple.stackexchange.com/questions/184899/applescript-to-identify-the-current-status-of-network-connection
https://stackoverflow.com/questions/43780648/applescript-if-contain
https://alvinalexander.com/apple/applescript-for-loop-while-loop-examples
Chrome リモート デスクトップ接続がうまくできない場合の解決策

Chrome リモート デスクトップ接続がうまくできない場合の解決策の覚書きです。

##対象ツール
Chrome リモート デスクトップ

##事象サマリ
以下2事象の解決策
1. Chrome リモート デスクトップが真っ白になる（何も表示されない）
2. 接続時にエラー：「リモートのパソコンが接続リクエストに応答しません」が出る

##解決策
###1.Chrome リモート デスクトップが真っ白になる（何も表示されない）
####その1：i-フィルター アンインストール
①「コントロールパネル」>「プログラム」>「プログラム」> 「プログラムのアンインストールまたは変更」
②「i-フィルター」を検索し、アンインストール
※うまくいかない or i-フィルターが見つからない場合はその2を実行

####その2：「ハードウェア アクセラレーションが使用可能な場合は使用する」のチェックを外す
①「Google Chromeの設定」 > 「設定」 > 「詳細設定」 > 「ハードウェア アクセラレーションが使用可能な場合は使用する」をOFFにする

###2.接続時にエラー：「リモートのパソコンが接続リクエストに応答しません」が出る
####その1：リモートアシスタンスの接続許可
①「コントロールパネル」 > 「システム」 > 「リモートの設定」
②「リモート」タブの「リモートアシスタンス」の「このコンピュータのリモートアシスタンス接続を許可する」にチェック
③「適用」 > 「OK」
※うまくいかない場合はその2を実行

####その2：5222ポートをのトラフィックを許可する
①「コントロールパネル」 > 「システムとセキュリティ」 > 「Windowsファイアウォール」 > 「詳細設定」 
②「セキュリティが強化された Windows ファイアウォール」にて、
「受信の規則」 > 「新しい規則」
③「新規の受信の規則のウィザード」にて、「ポート」を選択 > 「次へ」
④「TCP」、「特定のローカルポート」を選択し、「5222」と入力 > 「次へ」
⑤「接続を許可する」> 「次へ」　 
⑥ドメイン、プライベート、パブリックのうち必要なものにチェックを入れて、「次へ」
⑥任意の「名前」、「説明」を入力し、「完了」

##備考
その1, その2と記載していますが、順序はお好みでOKです。

##参考
####1. Chrome リモート デスクトップが真っ白になる（何も表示されない）
[Google Chromeで表示されない(白い画面)場合の解決策！](http://blog.livedoor.jp/pc7_77/archives/2465209.html)
[「i-フィルター 6.0」アンインストールガイド](https://www.daj.jp/cs/support/pc/if6/uninstall/)
[リモートデスクトップでもハマった](http://172m.blog.jp/archives/56142321.html)

####2.接続時にエラー：「リモートのパソコンが接続リクエストに応答しません」が出る
[「～接続リクエストに応答しません」Chrome リモートデスクトップで接続できない場合に確認する事](https://www.beginnerweb.net/chromeremotodesk.html)
[Chromeリモートデスクトップが接続できない時に確認すること。](http://k0567.net/chrome-remote-desktop/)
[Windows10 - ファイアウォール - 特定のポート番号の通信を許可
](https://pc-karuma.net/windows-10-firewall-open-port/)
Angular vs React: Which is the Winner?

Every time when front-end development is needed the Angular vs React dilemma appears. The choice depends on many factors because even front-end developers themselves have been debating the question for many years.

Angular vs React: What is the Difference?

The first difference between Angular and React is their architectures. Let's see the difference between a framework and a library.

As you may know, Angular is a full-fledged framework, which makes the engineering experience seamless, while React is a JavaScript Library. By the way, “Is React a framework?” because many developers consider React to be a framework, as the broad ecosystem lets it be integrated with multiple additional libraries and tools, granting it the capabilities of a framework. If you use Angular, everything you need to start building an app is already provided right out of the box. This is a plus and minus at the same time.

The following important thing to be considered is the difference between TypeScript and JavaScript. React uses JavaScript, which is trendy and many developers are already familiar with it, which makes it easier to find a development team for a project.

Angular is based on TypeScript, which was developed by Microsoft and positioned as a superset of JavaScript, a web application development tool that enhances JavaScript. It is more challenging to find developers familiar with TypeScript, but it is possible because the popularity of Angular continues to grow.

On the one hand, Angular and React have much in common, but on the other hand, their differences cannot be ignored. You must decide which tool better suits the needs of your project before choosing Angular or React.

####The Pros and Cons of Angular Framework

![angular vs react](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/290718/5fbe40d3-cd3b-4eba-6c51-fcb4ebaf126c.png)

####React Library: Benefits & Downsides

![react vs angular](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/290718/ab6adde9-d4ef-801b-a141-77b97fe5d63b.png)

Here [https://mlsdev.com/blog/angular-vs-react](https://mlsdev.com/blog/angular-vs-react) you will find out more about the differences between React and Angular.
Leetcode #645 Set Mismatch

Time complexity: O(n)
Space complexity: O(n)

```swift
func findErrorNums(_ nums: [Int]) -> [Int] {
    var missing = 0
    var dict = [Int: Bool]()
    for num in nums {
        if dict[num] == nil {
            dict[num] = true
        } else {
            missing = num
        }
    }
    for num in 1...nums.count {
        if dict[num] == nil {
            return [missing, num]
        }
    }
    return []
}
```
phpが動かない時にやったことメモ

#地獄の業火に焼かれてもらうぜ
サーバーの移転作業を終え、ちゃんと動作しているか確認を…
あれ？index.htmlが404エラーを吐いてる…？
コレってどうしたら良いんですか？？？

…え
自分で考えてみろ？
たまにはハマってもらうって？？

くっそー！絶対直してみせる！！

##.htaccessを消してみる
どうやら.htaccessでのリダイレクトがそもそも効いてないっぽい。
なので.htaccessを削除して動作を確かめる

結果はページが表示される様になったが、表示が崩れてる…。

##.htaccessにバグを仕込んでみる
.htaccessの1行目に`test`という文字を仕込んでみる。
もし.htaccessのロードが行われているなら500エラーを吐くはず。

結果は500エラーを吐いた。ということは.htaccessはロードされている。

##.htaccessの権限や文字コード、改行コードを確かめる。
もしかしたらコレが悪さしてるかもしれん。
権限を0644に
文字コードをshift_jisに
改行コードを/nに
してみた。

結果は404エラーを吐く。関係無いみたい。

##リダイレクト先のページを見てみる
.htaccessによるとリダイレクトでpage.phpに飛ぶはず。
じゃぁブラウザでpage.phpを叩いてみよう。

結果、PHPが動いていないのかソースコードがDLされる。

##php.iniを弄る
ログをみるとタイムゾーンの設定がされてない、との一文が。
なので

```
[Date]
date.timezone = "Asia/Tokyo"
```

結果、改善されず。

##httpd.confを弄る


```
<IfModule mime_module>
   AddType application/x-httpd-php .html
</IfModule>

<directory "/hoge">
 AllowOverride all
</directory>
```

結果改善されず…
（コメントにも書いていただいてますが、良くない書き方みたい）

#助けてドラえも～ん！
しかたないなぁ～
ちゃらちゃらちゃ～ん
原因は「FastCGI」～

な、なに～！？
apacheの動き方？を「FPM」に変えると正常に動作しはじめました。

##これはあまりやってはいけない

- サーバーのコアな部分を弄らない
- 弄る前にcpコマンドでバックアップを取っておく



#編集後記
入社17日目
やっぱバグ探しは体力持っていかれます。
しかもサーバー関連は、まだどこを追って良いのか
どこを弄ればいいのかわからないから
もう大変です。
Githubからherokuへの自動デプロイ


##Githubからの自動デプロイ

多くの場合はherokuなどの本番環境へ直接デプロイするのではなく
Githubから自動デプロイを行うようです。
この時gitflowに則るとmasterブランチは常にリリース版となるので
masterブランチと本番環境は常に同期している状態となります。
そのためgithubではmasterブランチとは別に
develop, featureブランチなどで作業する、という前提です。

このデプロイの手間を削減できるため非常に便利な設定です。

##設定方法

設定は全てherokuのサイトからGUIで可能です。


- ダッシュボードから対象のアプリを開く
- メニューの中の**「deploy]**へ
- DeploymentMethodを**Github**へ変更
- App connnected to Githubの項目で対象のレポジトリ、 **master**ブランチを選択
- Automatic Deployを**enable**へ変更
UnityでUrlSchemeからアプリを開いたときのurlを取得できるようにしてみた。(iOS,Android両対応)

# UnityでUrlSchemeからアプリを開いたときのurlを取得できるようにしてみた。

気になったのでやってみました。
というより、いい感じのライブラリがあるだろうと思ってたんですよ。
幾つかのアプリがいい感じにUrlSchemeでキャンペーンやってたりするので！！

でもなかった…
いやOS別ならあるんですよ。

iOS
[Unity/iOS で起動 URL を取得する (Unity 2018.3)](https://qiita.com/bugfire/items/4ce546c76870c670eca1)
https://github.com/Bugfire/Unity_OnOpenURL.git

Android（こちらは古い）
[[Unity][Android] カスタムURLスキームを使ってアプリを起動する（Unity Android編）](http://westhillapps.blog.jp/archives/25883001.html)

の二つの記事がそれにあたります。

両方まとめてかんたんにしてよーー！！！
っていう怠惰メンタルがこうふつふつとわいてきてですね・・・！！！

簡単に両対応しました！！！
リポジトリはこちら
https://github.com/Marimoiro/urlschemereceiver.git

# 導入方法

こちらの[unitypackage](https://github.com/Marimoiro/urlschemereceiver/blob/master/urlreceiver.unitypackage)を突っ込んでください。

## ios
ProjectSettingsからiOSのurlschemeを設定しておしまい。

# Android 
AndroidManifest.xmlの&lt;application&gt;タグの中に以下を追記してください。

```
        <!-- url receiver activity -->
        <activity android:name="urlreceiver.IntentReceiveActivity">
            <intent-filter>
                <data android:scheme="{Your Url Scheme}" />
                <category android:name="android.intent.category.DEFAULT" />
                <category android:name="android.intent.category.BROWSABLE" />
                <action android:name="android.intent.action.VIEW" />
            </intent-filter>
        </activity>
```

# 使い方

UrlSchemeReceiverクラスが全てです。

```
    public static class UrlSchemeReceiver
    {
        /// <summary>
        /// url schemeから開かれていればtrueさもなくばfalse
        /// </summary>
        public static bool OpenFromUrlScheme { get; private set; }

        /// <summary>
        /// 開かれたurlscheme
        /// e.g. urlscheme://example
        /// 
        /// もしurlscheme以外からアプリが起動されていれば null
        /// </summary>
        public static string OpenUrl { get; private set; }

        /// <summary>
        /// 開かれたurlschemeの//以降の部分
        /// e.g. example
        /// 
        /// もしurlscheme以外からアプリが起動されていれば null
        /// </summary>
        public static  string SpecificPart { get; private set; }
    }
```

# ライセンスについて
一応ないとまずいかなと思って2条項BSDつけていますが、（個人の見解ですが）このプログラムは著作権が発生していないのでは？と思います。
詳しい人教えてください。

もし使うことがあればStarかLGTMつけてほしいなほしいな！！
GASにて最新のバージョンで更新したはずなのに、変更が反映されなかった時の覚書

## 結果
バックアップのつもりでコピペしたファイルが原因かもしれません。
バックアップのつもりでコピペしたファイルを削除するか関数名を変更するなどして対処しましょう。

## 出くわした事態(しょうもないので閲覧注意)

スクリプトエディタでファイルをコピペして、バックアップファイル(コピーファイル)を作る。
そしたら以下の順番でファイルが配置される。

以下は「main.gs」をコピペした例

1. main.gs
2. コピー_main.gs


当然ですが、ファイルをコピペしただけなので、バックアップ用に作成した「コピー_main.gs」は、「main.gs」と同じ関数を持っている。

```js:main.gs
function doPost (){
}
```

```js:コピー_main.gs
function doPost (){
}
```

この状態で「main.gs」のdoPost()関数を変更及び更新しても、
**ファイルの順番が後に並んでいる「コピー_main.gs」のdoPost()が結果的に呼ばれます。**

最新のバージョンで更新したはずなのに、変更が反映されないという時に確認してみてください。
「コピー_main.gs」を削除するか関数名を変更するなどして対処しましょう。
ファイルの並び替えができればよいのだけれど・・・
【JavaScript】始めたての頃に間違えた初歩的な出力問題【アロー関数】

>〜　とある、もくもく会にて　〜

## 🔰 初めてのアロー関数

*※ 実話*
　

自分「先輩PC忘れたんですか？（チャンス..!!）」
　　「暇ならJavaScript教えてくれませんか」
先輩「いいよ〜JavaScript始めたの〜？」

自分「はい、まだ全然ですが**`アロー関数`**が知りたいです」
先輩「おっけ〜じゃあ適当に書くから、出力結果は何になる〜？」
　
（MacにVSCodeでカタカタ書き始める）
　
## 出力問題 1

```JS:問題１

let f = (x) => 1
f(42);

console.log(f(42));
```
　
自分「（おお！矢印だ..！）う〜ん...**`42`**ですか？」

先輩「お〜！ `Node.js`は入れてる〜？」
自分「はい！インストールしてます」
先輩「じゃあ出力してみよう〜」

```:コマンドプロンプト
cd ./Desktop/workspace/JavaScript
node Question1.js
```

<details>
<summary>答え（クリックで開く）</summary><div>

```:コマンドプロンプト
1
```

</div></details>
　
　
　
　
　
　
　
　
　
　
　
　
　

先輩「はいハズレ〜」

自分「えっ..`42`はどこに行ったんですか」
先輩「これをな〜普通に書くとこうなるんよ〜」

```js:先輩のコード
let f = function(x){
    return 1;
};
console.log(f(42));
```
先輩「xは`42`だけど、返ってくるのはただの`1`なんだよ〜」
自分「は〜なるほど」

　
自分「つまりこう書けば、結果は`42`になるんですね」

```JS:私のコード

let f = (x) => x
f(42);

console.log(f(42));
```
　
自分「functionで書くとこうなる」

```js:私のコード
let f = function(x){
    return x;
};
console.log(f(42));
```

先輩「そう〜」

　
自分「2行目の`f(42);`ってなんですか？」
先輩「消し忘れたけどまぁいいやって、消しても同じ〜」

```JS:問題１

let f = (x) => 1
console.log(f(42));
```

自分「あぁ…あとさっき、お〜！って言ったのはなんですか」

先輩「じゃあ次〜」
自分「・・・。」
　

## 出力問題 2

先輩「ｶﾀｶﾀ...次はこれどうなる？」

```JS:問題２

let f = (x) => y
console.log(f(42));
```

自分「`y`が返ってくるので、`y`ですか？」
先輩「ファイナルアンサー？」
自分「はい」
先輩「お〜！じゃあ出力してみよう〜」
　

<details>
<summary>答え（クリックで開く）</summary><div>

エラー

```:コマンドプロンプト
ReferenceError: y is not defined
```

</div></details>

　
　
　
　
　
　
　
　
　
　
　
　
自分「えっ」

先輩「変数を定義してないからな〜」
自分「んn...（2行程度の問題に正解出来なかった...）」
　
## 💘 アロー関数とは

ES6（ES2015）で導入された新しい関数の書き方
文字どうり、矢 `=>` を使って書く。

```js:アロー関数
let sum = (a, b) => a + b;
console.log(sum(3, 7));  // 結果：10
```

```js:functionの場合
function sum(a, b){
    return a + b;
}
console.log(sum(3, 7));  // 結果：10
```
　 
　 
複数行の場合は、`{}`でも書ける。


```js:複数行の場合

let sum = (a, b) => {
    let result = a + b;
    return result;
}
console.log(sum(4, 5)); // 9
```
　
　

## ・ アロー関数での`this`について

>従来の無名関数とthisの参照が異なる。
従来の無名関数は関数の呼び方によってthisの参照先が異なるが、アロー関数は関数が定義されたスコープ内のthisを参照する。

つまり`this`を使用する場合は気を付ける必要がある。
少し難しいので下記を参考にしましょう。

**▪️ 参考記事**
[【JavaScript】アロー関数式を学ぶついでにthisも復習する話](https://qiita.com/mejileben/items/69e5facdb60781927929)
　[JavaScript の this を理解する多分一番分かりやすい説明](https://qiita.com/takkyun/items/c6e2f2cf25327299cf03)
　
　

# 💬 終わりに
ちょっと恥ずかしいのですが...ここまでの内容は実話で、
昔、もくもく会でお会いした際の、[先輩（GitHub）](https://github.com/noqisofon)とのやりとり。
しかしアロー関数は知っておくべきもので頭にもしっかり残したいので、1つでも記事を書いておきたかった。

ちなみにこの時に、定数の**`const`**で配列の内容が変更出来る事でも**ヒッカケ**られました。
...でも教えてくれてありがとうね！

（ところで、もくもく会にPC持たずに何しに来たんだ...。）
　
　

# リンク

🐦 Twitter
https://twitter.com/aocattleya
:octocat: GitHub
https://github.com/aocattleya
📗 Qiita 
https://qiita.com/aocattleya
席替え用プログラム(ワンライナー)

昔、ES2015の練習用に書いた席替え用プログラムが発掘されたので晒しておきます。

まずは基本形。JavaScriptではrange関数がないのでArray.keys()の結果をスプレッドオペレータで展開してからソートします。

```JavaScript:席替え用プログラム(基本形)
[...Array(25).keys()].map(x=>++x).sort(()=>Math.random()-0.5)
// (25) [1, 15, 2, 18, 3, 10, 12, 4, 21, 20, 23, 19, 5, 16, 9, 8, 6, 11, 17, 24, 22, 14, 7, 13, 25]
```

座席表らしい表示になるようにjoinでセパレータを入れて結合し、指定列数で改行コードを入れる処理を追加しました。
5の倍数の配列の時に最後にゴミが入る問題があるのですが、対応を入れるのが面倒なので放置しています。

```JavaScript:席替え用プログラム(表示用加工版)
"| "+[...Array(25).keys()].map(x=>++x).sort(()=>Math.random()-0.5).map((x,i)=>i%5==4?x+" |\n":x).join(" | ")+" |"
// "| 15 | 11 | 14 | 8 | 19 |
//  | 3 | 10 | 17 | 2 | 7 |
//  | 13 | 5 | 16 | 9 | 21 |
//  | 12 | 18 | 24 | 23 | 1 |
//  | 4 | 6 | 22 | 20 | 25 |
//  |"
```
コマンドラインからmac対応アプリをインストールできるcaskがすごい

#アプリがcaskでインストール可能か検索
```terminal
$ brew search google-chrome
```
※以前は brew cask search google-chrome だったが、
現在は上記のように変更されました

#アプリのインストール
```terminal
$ brew cask install google-chrome
```
これだけ！
機械学習・AI関連の職業をざっくりとまとめてみた

# はじめに

色々なやることがあるこの界隈の仕事を「データサイエンティスト」で一緒くたにされるのもなんだかなぁ・・・と思ったので、採用市場でどんな求人があるのかを調べて傾向をまとめてみました。
内容については私の偏見が大いに含まれるので、参考程度に。

### 関連

- [データサイエンティストになってしばらく経ったので、最低限やっていくのに必要なスキルセットを整理してみる](https://qiita.com/calderarie/items/d5dc44865c4f54440be6)
- [データサイエンティストに対する面談時のスキルチェック観点について](https://qiita.com/calderarie/items/1c421bcb611910607614)


# 各職業

## アナリスト

- 仕事内容
 - データの可視化や集計などを行い、分析に基づいた提案、改善を行う
- ステータス
 - ビジネス： ★★★★☆
 - データサイエンス： ★★★☆☆
 - データエンジニアリング： ★★☆☆☆
- 関連スキル・経験
 - Python、R、SQLなどによるETL
 - KPIの設計、それに応じた分析手法選択、施策立案

## 機械学習エンジニア

- 仕事内容
 - 機械学習や人工知能アルゴリズムを組み込んだサービスの開発
- ステータス
 - ビジネス： ★★★☆☆
 - データサイエンス： ★★★★☆
 - データエンジニアリング： ★★★★☆
- 関連スキル・経験
 - 分析やモデルを活用したWEBアプリケーション開発
 - ビッグデータを扱う機械学習モデルの実装経験

## リサーチャー

- 仕事内容
 - 機械学習や人工知能アルゴリズムの研究
- ステータス
 - ビジネス： ★★☆☆☆
 - データサイエンス： ★★★★★
 - データエンジニアリング： ★★★★☆
- 関連スキル・経験
 - 深層学習、画像認識、音声認識、自然言語処理、最適化手法、分散処理などの研究経験

## データエンジニア

- 仕事内容
 - ビッグデータを扱う分散処理や可視化のための基盤を開発・運用する
- ステータス
 - ビジネス： ★☆☆☆☆
 - データサイエンス： ★★☆☆☆
 - データエンジニアリング： ★★★★☆
- 関連スキル・経験
 - 分散処理データ基盤の開発運用
 - AWS、GCPなどのクラウドインフラストラクチャの知識

## 分析プロジェクトリーダー

- 仕事内容
 - 分析実施やモデルやデータ基盤開発などのプロジェクトを推進する
- ステータス
 - ビジネス： ★★★★☆
 - データサイエンス： ★★★☆☆
 - データエンジニアリング： ★★★☆☆
- 関連スキル・経験
 - プロジェクトマネジメント
 - 分析業務の経験

## 分析コンサルタント

- 仕事内容
 - データ利活用のデザインやリテラシー教育などのコンサルティングを行う
- ステータス
 - ビジネス： ★★★★★
 - データサイエンス： ★★☆☆☆
 - データエンジニアリング： ★☆☆☆☆
- 関連スキル・経験
 - 顧客の要求定義、それに対するコンサルティング能力
プログラミング学習記録66〜インターネット技術〜

##今日やったこと
- インターネット技術について学ぶ

昨日の続きです。
FTPやSSLなど聞いたことはあるけど、よくわからなかったことについて学びました。

FTPは、wordpressでブログを作って、FFFTPというソフトでテーマのphpファイルをいじる時に使いました。

SSLは、ブログをhttpからhttpsに変更する時に「SSL化」として使いました。

なんでわざわざFTPソフトを使わなきゃいけないのかな？と思っていたのですが、FTPソフトを使わないとファイルの共有、転送ができないんですね。

自分のPCで開いたブラウザ上で表示する分にはFTPソフトを使わなくても問題ないのですが、ブログを一般公開する場合は、サーバを通じてるのでFTPソフトじゃないとダメみたいです。

詳しいことはよくわかりませんが、FTPの基礎の基礎がわかってよかったです。

最近はすっかり乏しいアウトプットになっていますが、少しづつ進めていきます。

<br>
おわり