OmniAICreator/Qiita-1.07M huggingface dataset:
VueプロジェクトをFirebaseでホスティングする

## node.js, vue-cliのインストール

下記よりインストールし、コマンドが通るようになること。
https://nodejs.org/ja/download/

```
$ node -v
バージョン
$ npm -v
バージョン
```

次に、vue-cliをインストール。

```
$ npm install -g vue-cli
```

## Vueプロジェクトの作成・起動

下記のコマンドにてVueプロジェクトを作成し、プロジェクトフォルダに移動しておく。
※対話形式で基本的にすべてyesを選択する。また、npmかyarnはどちらでもよい。

```
$ vue init webpack vue-firebase-sample
$ cd vue-firebase-sample
```

次に、作成したプロジェクトをローカルで起動してみる。

npmの場合

```
$ npm run dev
```

yarnの場合

```
$ yarn dev
```

そして、下記へアクセスすると、デフォルトのVueアプリケーションのが起動している。
`http://localhost:8080/`

## Firebaseへデプロイ
まず、[Firebaseコンソール](https://console.firebase.google.com/)へアクセスする。
下記の手順でプロジェクトを作成する。
 1. プロジェクト名を入力する。
 2. Google Analyticsは無効化する。
 3. プロジェクトを作成を押下する。

作成したプロジェクトのコンソール画面へ遷移する。
左側のスライダーの`開発 > Hosting`を押下する。

#### firebase cliをインストールする。

```
$ npm install -g firebase-tools
$ firebase -V ←大文字のVなので注意。
バージョンが表示されればOK
```

#### firebaseにログインする。

```
$ firebase login
Allow Firebase to collect CLI usage and error reporting information?　Yと回答する。
ブラウザ上に移り、権限を許可する。
```

#### プロジェクトディレクトリを設定する。

```
$ firebase init
対話形式で下記の通り、進める。
? Which Firebase CLI features do you want to set up for this folder? Press Space
 to select features, then Enter to confirm your choices. Hosting: Configure and 
hostingをspaceで選択し、Enterを押下する。

? Please select an option:
❯ Use an existing projectを選択する。 

? What do you want to use as your public directory? dist
Enterを押下する。

? Configure as a single-page app (rewrite all urls to /index.html)? No
Enterを押下する。
```

#### モジュールをビルドする。

```
$ npm run build
```

#### デプロイする。

```
$ firebase deploy
Hosting URL: {リンク} ← 左記のリンクにホスティングされている。
```

## 再デプロイする場合

vueプロジェクトを編集した後、下記を実行する。

```
$ npm run build
$ firebase login
ログインされていれば、グーグルアカウントが表示される。
$ firebase deploy
そして、ホスティングURLにアクセスする。
```
[Swift]オシャレなNavigationBar(色・フォント・アイテムのアレンジ)の作成

本記事では、**オシャレなNavigationBar**の作成の仕方(**色・フォント・アイテム**のアレンジの仕方)を紹介します！
とても簡単に実装可能なのでぜひ試してみてください！

# Before
![スクリーンショット 2020-06-13 20.23.49.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/588214/cdc9b800-eac7-9299-aac2-a631a678624b.png)

# After
![スクリーンショット 2020-06-13 20.25.41.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/588214/cee1bd66-3f02-30a1-75bb-7f94f301d4af.png)

上記のように、NavigationBarをアレンジするだけでオシャレになりましたね！

では、下記のように実装していきましょう！

# 1. Main.storyboardの準備
まず、Main.storyboardに下記の写真のようにNavigationControllerを作成します。
これで、**Before**の部分は完成です！
![スクリーンショット 2020-06-13 3.08.27.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/588214/0f87113b-a119-3721-46c2-029f7174ed06.png)

# 2. `SceneDelegate.swift`にデザインをアレンジするためのコーディング
それでは、**After**のようにオシャレにデザインしていきましょう！
とても簡単で、`SceneDelegate.swift`に下記のコードを追加するだけです！
これで、全てのNavigationBarのデザイン（背景・フォント・アイテム・色）をアレンジすることができます！

```swift:SceneDelegate.swift
import UIKit

class SceneDelegate: UIResponder, UIWindowSceneDelegate {

    var window: UIWindow?


    func scene(_ scene: UIScene, willConnectTo session: UISceneSession, options connectionOptions: UIScene.ConnectionOptions) {
        
        guard let _ = (scene as? UIWindowScene) else { return }

        
        // 全てのNavigationControllerのそれぞれの色を変更する場合ここに書く

        // ナビゲージョンアイテムの文字色
        UINavigationBar.appearance().tintColor = UIColor.yellow

        UINavigationBar.appearance().titleTextAttributes =
            // ナビゲーションバーのタイトルの文字色
            [.foregroundColor: UIColor.white,
             // フォントの種類
             .font: UIFont(name: "Times New Roman",
                           // フォントサイズ
                           size: 27)!]

        // ナビゲーションバーの背景色
        UINavigationBar.appearance().barTintColor = UIColor.red
    }

    // 以下省略
    
}
```

## 参考
画面ごとに、NavigationBarをデザインしたい場合は下記の記事を参考にしてみてください。
[[Swift]オシャレなNavigationBar(色・フォント・アイテムのアレンジ)の作成(画面ごとに設定)](https://qiita.com/tomo_s1/items/87e298c6ac9b8b6e6aa6)
Unity をライブラリ化して Android で使う


基本的には [UnityをAndroidアプリの中に埋め込む](https://qiita.com/niusounds/items/ba3c676cfd47b542a6b0) 通りにやればできると思います。少し時間が経って新しくなっているので、箇所箇所でエラーが出たので、その内容を書いています。

# 前提
名称           | バージョン
---------------|-----------
Mac OS         | 10.15.5
Unity          | 2019.3.0f6
Android Studio | 4.0


# 補足一覧
## エラーでは無いですが
初めてやると実行ボタンの ▶︎ が非活性でどうしようと思うかもしれないが、Android Stuido で起動すると、すぐGradleビルドが実行されて、裏側でモジュールのダウンロードとなどいろいろやってくれています。それが完了すれば押せるようになるので、待つべし。よく見るとAndroid Studioの下の方で実行中のメッセージが出ているはずです。

## GradleプロジェクトをAndroidライブラリ用に書き換える で出るエラー
普通にやっていると、

> GradleプロジェクトをAndroidライブラリ用に書き換える

のところで、以下エラーが発生するかと思います。

``` kotlin
Could not find method bundle() for arguments [build_5tr13prejz4zjojiaprk1aauk$_run_closure2$_closure9@45060b8e] on extension 'android' of type com.android.build.gradle.LibraryExtension.
```

bundle.gradle から

``` kotlin
    bundle {
        language {
            enableSplit = false
        }
        density {
            enableSplit = false
        }
        abi {
            enableSplit = true
        }
    }
```

を消し去ることで解消できます。

## アプリからUnityを呼び出すの kotlin 版
MainActivity から呼び出すならこんな感じのコードになります。

``` kotlin
        val intent = Intent(this, UnityPlayerActivity::class.java)
        startActivity(intent)
```


## アプリからUnityを呼び出す で出るエラー

普通にやっていると、

> アプリからUnityを呼び出す

のところで、以下エラーが発生するかと思います。
（ビルドは通るけど、実行するとクラッシュするので、Logcat をみて見てください。）

``` kotlin
    java.lang.UnsatisfiedLinkError: dalvik.system.PathClassLoader[DexPathList[[zip file "/data/app/com.example.myapplication3-tMH0XN0tKN_2SDmrPpPLmA==/base.apk"],nativeLibraryDirectories=[/data/app/com.example.myapplication3-tMH0XN0tKN_2SDmrPpPLmA==/lib/arm64, /system/lib64, /system/product/lib64, /hw_product/lib64, /system/product/lib64]]] couldn't find "libmain.so"
```

これは、build.gradle に以下を追加することで解消することができます。

``` kotlin
    defaultConfig {
        ndk {
            abiFilters 'armeabi-v7a', 'x86'
        }
    }
```
行の二重化+ マクロ

改行単位で複数行もまとめて複製するマクロです。
なぜか本体機能には折り返し単位しかないので……

<!-- 見れるようなコードじゃないからしまっとく? -->
<details>
<summary>**マクロコード** (duplicateLines.js)</summary><div>

``` javascript:duplicateLines.js
/**********************************************************
# 行の二重化+ マクロ
通常のは折り返し単位且つ1行のみなので、改行単位＆複数行選択に対応。
**********************************************************/

var KEEP_SELECT = 1; //行選択状態の維持 => 複数行の連続複製用

//function put(msg){if(typeof(outp)=='undefined'){TraceOut('\r\n▼-- $t @['+ExpandParameter('$M').replace(/^.*?([^\\\/]+)$/m,'$1')+'] > $f --',1),outp=1} TraceOut((''+msg).replace(/^([\S])/gm,'\t$1'),0)}

//== メイン処理 ===========================================
function duplicateLines(){
	var txt=GetSelectedString(0), f=txt!='', row=ExpandParameter('$y')-0, len=1;
	if(f){row=LayoutToLogicLineNum(GetSelectLineFrom());//複数行選択?
		len=LayoutToLogicLineNum(GetSelectLineTo())-LayoutToLogicLineNum(GetSelectLineFrom())+1;
		if(LineColumnToIndex(GetSelectLineTo(),GetSelectColmTo())<2){len--}
	}
	if(row>GetLineCount(0)){return false} txt='';
	for(var i=0; i<len; i++){txt+=GetLineStr(row+i)}

	CommitUndoBuffer(); AddRefUndoBuffer(); AppendUndoBufferCursor(); SetDrawSwitch(0);
	MoveCursor(row+len,1,0); InsText(txt);
	var pos=ExpandParameter('$y')-0; MoveCursor(row+len,1,0);
	if(KEEP_SELECT){if(f && KEEP_SELECT){MoveCursor(pos,1,1)}}
	SetUndoBuffer(); SetDrawSwitch(1); ReDraw();

	return true;
}

if(Editor){duplicateLines()}
```

</div></details>

* 折返し表示中でも改行単位で行を複製します。
* 複数行選択時は選択範囲単位で複製します。[^1]
  * デフォルトでは複製した行は選択状態になります。[^2]   
    `KEEP_SELECT = 0`にすると選択状態にならなくなります。

ぶっちゃけ、行選択＆コピペでも良いようなマクロですが、選択範囲が適当で良い・クリップボードを汚さないので使い道はあるかも知れません。

[^1]: 各行ごとに二重化じゃないです
[^2]: 複数行を連続複製する為の措置です
brewで入れたVim8のDependenciesがpython@3.8になってdeopleteが動かなくなったのに対処したメモ

2020/10/21現在
brewで入るvimは`python@3.9`になっている。
3.8を3.9に読み替えればOK。

---

brewで入れてるVim8をアップデートしたらdeopleteが動作しなくなったのに対処したメモ。

エラー文にinitializeとあるので、なにやら初期化時にエラーが起きている。

```
[deoplete] [vim-hug-neovim-rpc] requires one of `:pythonx import [pynvim|neovim]`
 command to workfunction deoplete#enable[9]..deoplete#initialize[1]..
```

deopleteのrequirementでも変わったかね？と確認すると `msgpack` をpipでいれろとある。
入れた記憶がなかったのでインストール。まあ入っていたのだけど。

```
$ pip3 install -U msgpack
$ pip3 install -U pynvim
````

が、まだエラーが出る。

Vim側で
`:echo has("python3")` で1になるのでVim側のifは有効。
`:pyx print(sys.version)` すると

```
3.8.3 (default, May 27 2020, 20:54:22)
[Clang 11.0.3 (clang-1103.0.32.59)]
```

3.8・・・？ `$ python3 -V` をすると3.7が出てくる。これは/usr/bin/にあるmacOS Catalinaのものだ。どうやらbrewのvimのpython dependencyが `python@3.8` になったようだ。

brewで入ったpython 3.8用の/usr/local/bin/pip3.8があるので、そちらでmsgpackとpynvimを入れる。

```
$ pip3.8 install -U msgpack
$ pip3.8 install -U pynvim
````

まだエラーが出る。

```
[deoplete] [yarp] [deoplete] job is dead. failed establishing channel for ['python3', '-u', ...
```

これは `python3` コマンドを使っているっぽい。でもそっちは3.7なんだよなってことで3.8の方を使われるようにしたい。いっそbrewのpython3パッケージを消そうかと思ったが依存で使われていて消せない。
python3コマンドを3.8の方が使われるようにPATH通すかってことでbrewのlinkを通す事にする。

brewの `python@3.8` はkeg-onlyなので自動では/usr/local/bin/にsymlinkが作られない。のでリンクを作る。

```
$ brew link python@3.8 --force
Linking /usr/local/Cellar/python@3.8/3.8.3... 
Error:Could not symlink bin/pip3
Target /usr/local/bin/pip3
is a symlink belonging to python. You can unlink it:
  brew unlink python

To force the link and overwrite all conflicting files:
  brew link --overwrite python@3.8

To list all files that would be deleted:
  brew link --overwrite --dry-run python@3.8
```

brewのpython3で入ったpip3がいるのでエラー。pip3も3.8の方で良い（今後何か起きるかもだが）のでoverwriteつけて...

```
$ brew link python@3.8 --force --overwrite
```

成功。

/usr/binよりも/usr/local/binの方を優先するPATHにしてるので、これでpython3が3.8に向いて無事deopleteが動いた。

なおったはなおったが、そろそろnvimにした方がトラブル少ないのかもしれないなーと思った。

---

追記
同じ内容で同じ対応をしてるissueがあった。
https://github.com/roxma/vim-hug-neovim-rpc/issues/47#issuecomment-622954462
[超基礎編] jupyterNotebookについて

## これはなにか？
私はソフトウェアエンジニアでもデータサイエンティストでもないですが、日々の業務でMySQLやBigQuery等からデータを抽出する中で、それらを統計的に表現する手法、可視化することに興味が湧いてきました。
それらを実現するにはjupyter notebookが適切だと考え、最近jupyternotebookでPythonを書いています。
本記事は、私がjupyterを利用するにあたっての備忘録をまとめたもので、pandasを使ったCSVデータの読み込みから基本統計量等の確認および簡単なデータの可視化方法をスコープとしています。
※ あくまでスーパー素人が書いた記事です。


## JupyterNotebookとは？

[公式ドキュメント参照](https://jupyter.org/index.html)

## コードメモ

>Pandasとは?・・・データ解析支援する機能を提供するライブラリである。特に、数表および時系列データを操作するためのデータ構造と演算を提供する。
numpyとは？・・・数値解析をするライブラリ
pyplotとは？・・・可視化するライブラリ


### 1.データのインポートおよびデータの確認

```python:test.ipynb
# 1.データ分析に必要なライブラリをインポートします

import pandas as pd 
import numpy as np
from matplotlib import pyplot as plt
%matplotlib inline

#2.データを読み込む ※カラムがある前提です。ない場合はheader=Noneをオプション指定します
# head()、tail()関数を用いることで、先頭あるいは後尾のデータの中身を確認できます。行の数が多い際に使っています
data = pd.read_csv("hogehoge.csv") 

#3.データの行列を確認する
data.shape # -> (行、列）がかえってきます。

#4.基本統計量（データの基本的な特徴。平均、標準偏差、最大値、最小値、等）やデータのTypeの確認をします
# また、mean()などの関数を利用することにより、平均だけ返すみたいなことも可能です
data.describe()
data.info()


# カラムを指定する場合は以下。SQLでいうwhere句に「hogehoge = hoge」の指定をするイメージ
data["hoge"]
```

### 2.データの可視化
```python:test.ipynb

# 折れ線グラフを書く。
# オプションで大きさを指定することが可能。figsize=(横の大きさ,縦の大きさ)で指定します
# また、オプションでタイトルを指定可能です。title = "hoge"
data["hoge"].plot()

# x軸およびy軸の名前を指定します
label = date.plot(figzize=(15,5),title="test")
label.set_xlabel("hogehoge")
label.set_ylabel("hogehoge")

#変数.plot.hist()でヒストグラムを、変数.boxplot(by=x軸)でボックスプロットも可能です。

```
【実行してみた】SinGAN: Learning a Generative Model from a Single Natural Image

適当な記事で申し訳ございません。
単純に動作確認をしただけです。


#元画像

![diecast.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/655110/b7e96cc7-8ac1-6448-6b40-593c9c44b9df.png)
学習時間は1時間程度

#Editing
##Editing入力画像
![diecast2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/655110/b8a67b9c-30cd-d9a2-9cc7-9eec50716f05.png)

##Editing出力画像

###スケール７

![start_scale=7.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/655110/bb7f6bac-7427-b4ec-0215-1f7e7e2c02c5.png)

###スケール6

![start_scale=6_masked.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/655110/080a5275-2144-b37d-3b91-0cc009e445ec.png)

###スケール5
![start_scale=5_masked.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/655110/8385717c-9c9d-5fad-19aa-0972c2b6c405.png)


###スケール3

![start_scale=3_masked.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/655110/542bd401-bcba-a493-f523-414b0e456af0.png)


#アニメーション

###スケール0
![alpha=0.100000_beta=0.800000.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/655110/acfe7716-6bd0-843c-b5f3-2b933ec2ee08.gif)


###スケール1
![alpha=0.100000_beta=0.850000.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/655110/4ebb2b47-315b-be5b-5b93-39595da94c08.gif)


###スケール２
![alpha=0.100000_beta=0.850000 (1).gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/655110/ac581dec-a509-97b0-df98-0750d608396d.gif)
【CentOS 7】CPANをオフラインでインストールする方法【動画解説付き】

![アイキャッチ.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/538330/025173b4-d988-2e2e-4ce5-d75f724cfb76.png)

どうも、プログラミングの鬼シヨツ鬼です。
この記事では「CPANをオフラインでインストールしたいぜ」って人に向けてCentOS7.3におけるインストールする方法を具体的に説明しています。
初心者向けにコマンドの意味などもできるだけ説明しているので、ぜひ参考にしてみてください。

ちなみに、この記事は次の動画と同じ内容ですので、記事だけだと分かりづらい部分は、そちらもご活用ください。
(ボタンの位置や操作方法などがわかるので、初心者の方は動画のほうが分かりやすいかも)
[YouTube:CPANをオフラインでインストールする方法](https://www.youtube.com/watch?v=YAX0c6FGph4)

#準備するもの
・インターネットに接続されたサーバ(CentOS)
・インターネットに接続できないサーバ(CentOS)
・愛と勇気

#概要
流れとしては、オンライン環境でCPANミラーと呼ばれる、CPANモジュールの詰め合わせをダウンロードします。
そして、そのダウンロードしたCPANミラーからオフラインでインストールするという流れです。

| CPANミラーとは       |
|:-----------------|
| CPANでインストールできる全てのモジュールの最新版をオフラインでインストールできるようにまとめたCPANモジュールの一式です。全部で4GBちょっとなのでDVDなどに焼いておくと持ち運ぶこともできます。           |


【オンライン側】
１．cpanmコマンドを使えるようにする
２．minicpanコマンドを使えるようにする
３．minicpanコマンドを使ってCPANミラーを作る

【オフライン側】
１．cpanmコマンドを使えるようにする
２．オンライン環境で作ったCPANミラーを使ってインストールする

#オンライン側での作業
###cpanmコマンドを使えるようにする
cpanmコマンドはperlのライブラリのインストール作業を助けてくれるコマンドです。
下記のコマンドでcpanmコマンドを使えるようにします。
`yum install perl-App-cpanminus`

###cpanminiコマンドを使えるようにする
cpanminiコマンドは、CPANミラーを作ってくれるコマンドです。
下記のコマンドでcpanminiコマンドを使えるようにします。
`cpanm CPAN::Mini`

###CPANミラーを作る
minicpanコマンドを使って、CPANミラーを作ります。
`minicpan -r ダウンロード元のURL -l ダウンロード先ディレクトリ`
`(例)minicpan -r http://cpan.metacpan.org/ -l /home/usr01/minicpan/`
ちなみに、ダウンロード元としては、下記のURLなんかを指定します。

・http://cpan.metacpan.org/
・http://mirror.jre655.com/CPAN/

[詳しくはこちら](https://www.cpan.org/SITES.html)


#オフライン側での操作
###cpanmコマンドを使えるようにする
基本的にはオンラインと同じですが、オフライン環境ですので、OSのインストールに使ったDVDイメージを使ってインストールします。
詳しくは動画を見てください。

###CPANミラーをコピーする
オンライン環境で作ったCPANミラー一式を適当なディレクトリに保存します。

###CPANミラーを使ってインストールする
次のようなコマンドで好きなCPANモジュールをインストールすることができます。
`cpanm --mirror CPANミラーをコピーしたディレクトリ インストールしたいCPANモジュール名`
`(例)cpanm --mirror /home/usr01/minicpan CPAN::Mini`


#まとめ
CPANミラーを作って持ち歩いていれば、万が一インターネットの通っていない無人島に流れ着いた時もときもCPANモジュールをインストールすることができますね！
最後まで、読んでくれてありがとう。
参考になったらシェアしてね。
docker debian系イメージでgit系が使いやすくなるレシピ

開発環境作るときにコピペすると便利。


```Dockerfile:Dockerfile
FROM # debian系のimage ex: buildpack-deps ruby node

# 日本語環境追加については https://qiita.com/hikaruna/items/51f4da641f91ce25cadf
RUN apt-get update && apt-get install -y \
locales \
&& apt-get clean -y && rm -rf /var/lib/apt/lists/* \
&& sed -i -e 's/# \(ja_JP.UTF-8\)/\1/' /etc/locale.gen \
&& locale-gen \
&& update-locale LANG=ja_JP.UTF-8

RUN apt-get update && apt-get install -y \
less \
&& apt-get clean -y && rm -rf /var/lib/apt/lists/*
ENV LANG=ja_JP.UTF-8

RUN { \
echo 'source /usr/share/bash-completion/completions/git' ; \
echo 'source /etc/bash_completion.d/git-prompt' ; \
} >> /etc/bash.bashrc
ENV PROMPT_COMMAND='__git_ps1 "\u@\h:\w" "\\\$ "' \
GIT_PS1_SHOWDIRTYSTATE=1 \
GIT_PS1_SHOWCOLORHINTS=1
```


後は、各自.gitconfig等をmountしたり、ssh_auth_sockをマウントしたら完璧だと思う。
(そしてvscode remote containerはそのへんを勝手に自動でやってくれるので便利=おせっかい)
【学習記録】herokuへrailsアプリのデプロイ

### 詰まった点
- gitのリモートリポジトリの内容がデプロイされる。（解釈、間違いかも）
　そのため、変更はリモートのmasterブランチにマージする
- テンプレートリテラルを使用しているとエラーになる。

対処法

```ruby

config/environments/production.rb

config.assets.js_compressor = :uglifier　をコメントアウト
もしくは
config.assets.js_compressor = Uglifier.new(harmony: true)　とする

```
- デプロイできるが、ｊｓが読み込まれない。

```application.js

//= require jquery を一番前に
【AWS】初めてサーバーレスWebAPIを作った話

#始まり
以前、4年ほど勤めていた会社では、Windows向けのスタンドアローンアプリケーションしか開発したことがありませんでした。
退職後、Pythonを使った機械学習の勉強を始め、作成したプログラムをどう生かすか考えた時に、行きついた先がWebAPIでした。
とは言え、WebAPIを作ることに関してほとんど知識がなく（WebAPIという言葉すら知らなかったくらいです）、下のようなサービスを作りたいなぁ...くらいの構想からスタートしました。
![Untitled Diagram Base.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/358498/d0fe418e-74ed-62bc-3080-63b4acf089d7.png)
図を見たらわかりますが、技術も言葉もほぼ知らない、右も左もわからない状態でした。（これが一番つらかったです）


#完成図
いろいろ四苦八苦して、最終的に以下のようなアーキテクチャとなって、初めてのWebAPIが完成しました。
方針として、サーバーを自分で用意しないで、AWSを利用しました。

![Untitled Diagram.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/358498/234d6791-9e4d-dfac-6d9e-a94632d5700f.png)
[draw.ioの使い方](https://ferret-plus.com/8408)

#調べて実現して、まとめたこと
実現するまでの技術的な裏付けを調べるのに、一番時間をとりました。
次に時間をとったのが、AWSの使い方でした。こちらは備忘録としてまとめました。

[AWSを利用したサーバーレスWebAPI開発環境の構築（zappaでAWSLambdaにデプロイする）](https://qiita.com/nemutas/items/2d0d3ea584b06d054f42)
AWSのアカウントのつくり方から、スクリプトをAWSへアップロードする手順までまとめています。

[zappa経由でデプロイしたAWSLambda関数（WebAPI）にCloudWatch Eventsを設定する](https://qiita.com/nemutas/items/383a107c2dc146c98919)
EventBridgeを使って、タイムスケジュールに従ったイベントの登録の仕方をまとめています。

[【Python】AWS S3バケットにCSVファイルをアップロードしたり、データを読み込んだりする](https://qiita.com/nemutas/items/c3346a866fa7fe6f7d60)
S3バケットへのファイル保存と、そのファイルの読み込み方法をまとめています。

#アプリケーション
リクエストは`HTTP通信を使ったURI`、レスポンスは`JSON`データとなっているため、どんなプラットフォームでの開発もできます。ここがWebAPIの強みです。

今回作成したWebAPIは、データの更新頻度が高くないため（S3バケット内のデータの更新が1日1回）、取得したデータをローカルファイルに保存する想定にしています。アプリケーションではそちらのファイルを参照します。そして、アプリケーション内でユーザーの任意のタイミングでWebAPIにアクセスして、データを取得してローカルファイルを更新するようにします。

#総括
作りたいものを作るために、`どういう技術を使えばいいのか`、`どう調べればいいのか（専門用語を知っているか）`知識をつけることが、エンジニアにとって一番重要だと身をもって経験しました。

私の好きな漫画のひとつに、`宇宙兄弟`があります。その中のキャラクターのブライアン・Jがこんな言葉を残しています。

>人の人生には、いくつもの”夢のドア”がある。人は例えば「宇宙へ行く」みたいな大きな夢を持った時、目の前に現れたバカでかいドアに萎縮して向こう側へ行くことを諦めちまう。「開けられるわけがない」ってな。
>
だがビビることはないんだよ。本当ははじめから、そんな”バカでかいドア”なんてものはない。
>
小さなドアがいっぱいあるだけだ。
>
“成長のドア”、”発見のドア”、”勝利のドア”、”賞賛のドア”、他にもいろいろ見つかるだろう。そしてその小さなドアを開けるたび、君らの夢が１つずつ叶っていくのがわかるはずだ。
>
（中略）
>
手探りでも何でもいい 意地でも次のドアに手をのばし続けることだ。

WebAPIを作る試みは、まさにこんな感じでした。
【MySQL】私的よく使うコマンド

備忘録として
#データベースの作成

```sql
CREATE DATABASE データベース名;
```
`CHARACTER SET`でデータベースデフォルトの文字コードを設定できる

**例**

```sql
CREATE DATABASECREATE database CHARACTER SET utf8;
```

#テーブルの作成

```sql
CREATE TABLE テーブル名 (列名 データ型 列フラグ [, ...])[テーブルオプション]
```
##例

```sql
CREATE TABLE member(id INT PRIMARY KEY AUTO_INCREMENT,nam VARCHAR(255) NOT NULL,sex CHAR(1) DEFAULT'男',old INT NOT NULL,enter DATE NOT NULL,memo VARCHAR(255) DEFAULT NULL);
```
##データ型
###数値

|データ型|概要|
|---|---|---|
|INT[(len)][UNSIGNED][ZEROFILL]|-2147483648~2147483648<br>(UNSIGEDを指定すると0~4294967295)|
|FLOAT[(len,dec)][UNSIGNED][ZEROFILL]|単精度浮動小数点数。|
|DOUBLE[PRECISION][((len,dec))][UNSIGNED][ZEROFILL]|倍精度浮動小数点数。|
|DECIMAL(len[,dec])[UNSIGNED][ZEROFILL]|文字列として格納された数値。|

###文字列

|データ型|概要|
|---|---|---|
|CHAR(len)|固定長文字列|
|VARCHAR(len)|可変長文字列|
|TEXT|2<sup>16</sup>-1バイトの可変長文字列|

###日付

|データ型|概要|
|---|---|---|
|DATETIME|日付型時刻。|
|DATE|日付型|
|TIME|時刻型|

###バイナリ

|データ型|概要|
|---|---|---|
|BLOB|2<sup>16</sup>バイト|
|LONGBLOB|2<sup>32</sup>バイト|

###列挙
|データ型|概要|
|---|---|---|
|ENUM(*var1,var2*)|単一選択が可能な列挙型|
|SET(*var1,var2*)|複数選択が可能な列挙型|

##列フラグ

|列フラグ|概要|
|---|---|---|
|[NOT] NULL|NULL値を許可/禁止|
|AUTO_INCREMENT|自動連番列を定義|
|PRIMARY KEY|主キー列を定義|
|DEFAULT 'デフォルト値'|デフォルト値を定義|
|UNIQUE|列の値が一意であることを宣言|

#テーブルの削除

```sql
DROP TABLE [IF EXISTS] テーブル名 [, テーブル名] ...
```
#テーブルの制約を見る

```sql
SHOW COLUMNS FROM テーブル名;
```
WSL2とWSLの速度を比較。WSL2が３倍速かった

私がWSLを使う理由は、vueの開発環境のため。

npm run buildの時間を比較してみました

time npm run build
で時間を比較

WSL(ubuntu-18)
```
real    2m4.786s
user    0m37.063s
sys     0m18.281s
```

WSL2(ubuntu-20)
```
real    0m42.878s
user    1m33.658s
sys     0m9.280s
```

124/42=2.95
netCDFファイルをpythonで描画

#netCDFファイルをpythonで描画

```python:read_netCDF.py
import matplotlib as mp
import numpy as np

ind='hoge.grd'
Dat = np.netcdf(ind,'r').variables['z'][::-1]
lon=np.netcdf(ind,'r').variables['x'][::-1]
lat=np.netcdf(ind,'r').variables['y'][::-1]
NX, NY=np.meshgrid(lon, lat)

#カラーバーの最小，最大値指定しつつ，カラーバーの中心(z=0)の色は維持．
norm = mp.colors.TwoSlopeNorm(vcenter=0.0, vmin=-0.2, vmax=0.1)
#2次元データの一部を切り抜き [pixel]
extX0=950
extX1=1600
extY0=1100
extY1=1750

#figure sizeも指定
fig=plt.figure(figsize=(10,10))
#colormapをjet
plt.pcolormesh(NX[extY0:extY1, extX0:extX1], NY[extY0:extY1, extX0:extX1], Dat[extY0:extY1, extX0:extX1], cmap='jet', norm=norm)　
plt.colorbar() # カラーバーの表示 
plt.xlabel('Longitude [deg.]')
plt.ylabel('Latitude [deg.]')
plt.show()
```

こんな感じの図が表示される↓
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/654731/797eb62c-fd53-a979-eab1-e73a3a646c64.png)
不要なコードを見つけるPeripheryを実行するターゲットをXcodeGenで追加する

プロジェクトの不要なコードを見つけてくれるPeripheryというツールがあります。

https://github.com/peripheryapp/periphery

このREADMEを読んでみると、Periphery用のターゲットを作って利用する方法が書いてあって面白そうだったのでXcodegenで生成するためのyamlを書いて見ました。

```project.yml
aggregateTargets:
  Periphery:
    buildScripts:
      - script: periphery scan --project vear.xcodeproj --schemes App --targets App --format xcode
```

Xcode11から追加されたAggregate Targetsというターゲットタイプを使っているのが面白い点ですね。
Excel方眼紙のメンテナンスの手間を少しでも減らす技術


ドキュメントを作るとなると、無条件にExcel方眼紙で作ろうとするバカはさっさと死ねと思う今日この頃ですが、、、[^1]

悪名高い、Excel方眼紙の設計書。不毛だとは分かっていても、準委任契約でフォーマットが指定されており有無を言わず受け入れるしかない[^2]とか、既存の設計書が方眼紙状になっているためうかつに手を出せない、という場面は多々あるのではないかと思います。

そこで、Excel方眼紙縛りの中でも少しでも生産性を上げるために、なんか工夫できないか一労働者が考えてみました。

# 典型的なExcel方眼紙の例

まず、次の表を見てください。典型的なExcel方眼紙スタイルで作成した表の例です。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/51871/62e81df3-b1c3-5f66-370f-110bc5ccd29a.png)


この表の問題は「意味もなくセル結合を濫用している」点で、例えば行高さを大きくするのに、わざわざ行を追加しています。別にドラッグ＆ドロップして行高さを調整すればそれで済むじゃないか、と思うでしょう。でもドラッグ＆ドロップして行高さを変更することは「方眼紙」の定義に反してしまい、マナー違反にあたります（方眼状を崩すということは共同体の和を乱すことを意味し、先方に大変悪い印象を与えてしまいます）。したがって行を追加して結合するしかないのです。

# メンテナンス性を向上させたExcel方眼紙

方眼紙にする唯一の利点は「一つのシートに、異なる列幅の表を複数配置できる」点かと思います。そこで（テキストが複数行にわたる論理セルの）列幅だけはセル結合で調整していますが、行高さはドラッグ＆ドロップで調整できるように改善しています。

また、表の見出し行の背景色と、縦罫線は廃止しました。縦罫線をなくすだけでも、メンテナンス時の負担はかなり違います。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/51871/0d9a37e4-f6ec-c93f-b78f-b2f01905c283.png)

## 改善点
自動改行を利用したいためだけに、テキストが複数行にわたる論理セルのみセル結合しています。ここはごめんなさい、良い案がうかびませんでした。それでも理由のないセル結合は廃止し、論理列の幅を大きくする時の手順を一手間だけ減らすように工夫したつもりです。

どれだけ手間が減ったか、「論理セルの幅を大きくする時の手順」を例に比較してみます。

### 「典型的なExcel方眼紙の例」に列を追加する手順
1. セル結合を解除する。
2. セル範囲を選択し、「右側にセルを挿入」を選択する。
3. 一番右の太罫線が右にずれるので、太罫線の位置を左に戻す。
4. 結合解除した物理セルをセル結合し直す。 
5. 追加した論理列の見出し色が無色になるので、そこに色をつける。

### 「メンテナンス性を向上させたExcel方眼紙」に列を追加する手順
1. セル結合を解除する（セル結合が無い場合はスキップ）
2. 移動したいセル範囲をコピー＆ペースト
3. コピー元のテキストを削除する。
4. 結合解除した物理セルをセル結合し直す。 

改善前は5手、改善後は最小3手・最大4手となり、1～2手が削減されています。

たったこれだけ？と思いますが、修正箇所が多い場合は手数が少ないほうが助かるし、改善後は必要なセルのみ結合しているため、セルを選択する回数が減っています（うーん、説得力的に苦しいかな？）

# あとがき

実際、労働者（筆者）は上記の改善点を採用したことで、方眼紙縛りの中でも相当にパフォーマンスがアップしました。

よい方眼紙ライフを！（^o^）／

[^1]: Excelシートをすぐ方眼紙にする白痴は今すぐ消えてほしい。邪魔。死ね。消えろ。
[^2]: 自社内で完結したドキュメント、あるいは元請けからフリーフォーマットを許されてるのに自らExcel方眼紙を採用し、設計書のメンテナンス時にセル結合＆解除をちまちま繰り返す「Excelで遊ぶSE」も中にはいますが、プロジェクトの予算を使ってExcel遊びするのが好きなんでしょうね。
特定のuserにだけ表示するmotd

# TL;DR

~~みんな大好き~~PAMの出番だ。

```
# Show motd for admin
session     [success=1 default=ignore] pam_succeed_if.so user != admin quiet
session     optional      pam_motd.so motd=/etc/motd.admin
```

# はじめに

厳密には本稿のやり方は「`/etc/motd`に加えて追加MOTDを表示している」だけなので注意してください。

```text:表示イメージ
$(追加MOTDの表示)
Last Login： ...
$(/etc/motdの表示)
```

sshログインの場合は以下の設定を行えば追加MOTDだけの表示になります。

```config:/etc/ssh/sshd_config
PrintMotd no
PrintLastLog no
```

# 検証

`/etc/motd`は空の状態かsshd_configで無効化されている前提になります。

## 設定

AA作るの面倒なのでfiglet入れます。

```shell-session
[root@svr02 ~]# yum -y install epel-release
[root@svr02 ~]# yum -y install figlet
[root@svr02 ~]# echo -e "\e[31m$(figlet -f slant ADMINISTRATOR)\e[m" > /etc/motd.admin
[root@svr02 ~]# cat /etc/motd.admin
    ___    ____  __  ________   _____________________  ___  __________  ____
   /   |  / __ \/  |/  /  _/ | / /  _/ ___/_  __/ __ \/   |/_  __/ __ \/ __ \
  / /| | / / / / /|_/ // //  |/ // / \__ \ / / / /_/ / /| | / / / / / / /_/ /
 / ___ |/ /_/ / /  / // // /|  // / ___/ // / / _, _/ ___ |/ / / /_/ / _, _/
/_/  |_/_____/_/  /_/___/_/ |_/___//____//_/ /_/ |_/_/  |_/_/  \____/_/ |_|

```

今回はsshログインに対して追加表示させるので`/etc/pam.d/sshd`の最後にルールを追加する。
[pam_motd](http://www.linux-pam.org/Linux-PAM-html/sag-pam_motd.html)はsessionでしか使えないので注意。

```diff:/etc/pam.d/sshd
+# Show motd for admin
+session     [success=1 default=ignore] pam_succeed_if.so user != admin quiet
+session     optional      pam_motd.so motd=/etc/motd.admin
```

1行目：adminユーザ以外は1行分ルールをスキップする。
2行目：motdとして/etc/motd.adminを表示する。

## 動作確認

```shell-session:vagrantユーザでログイン
❯ ssh vagrant@192.168.1.12
Warning: Permanently added '192.168.1.12' (ECDSA) to the list of known hosts.
[vagrant@svr02 ~]$
```

```shell-session:adminユーザでログイン
❯ ssh admin@192.168.1.12
Warning: Permanently added '192.168.1.12' (ECDSA) to the list of known hosts.
    ___    ____  __  ________   _____________________  ___  __________  ____
   /   |  / __ \/  |/  /  _/ | / /  _/ ___/_  __/ __ \/   |/_  __/ __ \/ __ \
  / /| | / / / / /|_/ // //  |/ // / \__ \ / / / /_/ / /| | / / / / / / /_/ /
 / ___ |/ /_/ / /  / // // /|  // / ___/ // / / _, _/ ___ |/ / / /_/ / _, _/
/_/  |_/_____/_/  /_/___/_/ |_/___//____//_/ /_/ |_/_/  |_/_/  \____/_/ |_|

[admin@svr02 ~]$
```

# コンソールログインでもやりたい

`/etc/pam.d/login`に同様に設定を入れれば可能ですが、CentOSのコンソールログインでLast LoginとMOTDの表示を無効化する方法を探せなかったので冒頭で言及した通り表示がキモいことになります。
とはいえ、コンソールログインをするケースは緊急事態かつ熟練の管理者に限られるので、このようなMOTDの表示をしたいケースはあまりないかなと思っています。
PIFuHDをWindowsでとりあえず動かしてみた

# はじめに
FacebookResearchからPIFuHDが公開されていました！以前PIFuを試して遊んでいた延長でPIFuHDも試してみようと思いました。

この記事では、環境構築から用意していただいているサンプルをWindows上で実行するところまでの手順を記載します。

偉大なPIFuHDのリポジトリは[こちら](https://github.com/facebookresearch/pifuhd)

# 実行環境
- Windows10 64bit Home
- Anaconda3
- RTX2080Ti
- CUDA 10.1

# 環境構築
### 仮想環境の作成
```
(base)$conda create -n pifu python=3.7.0
(base)$conda activate pifu
```

### ライブラリのインストール（pip使ってしまったので、これを参考にconda installで入れていただければ...）
```
(pifu)$conda install pytorch torchvision cudatoolkit=10.1 -c pytorch
(pifu)$pip install pillow==6.0.0 scikit-image tqdm opencv-python trimesh
(pifu)$conda install pyopengl
```

### WindowsにGLUTをインストールする
今回は本家のGLUTではなく、FreeGLUTをインストールしました。
[こちら](http://files.transmissionzero.co.uk/software/development/GLUT/freeglut-MSVC.zip)から「freeglut-MSVC-3.0.0-2.mp.zip」をダウンロード→解凍し、freeglut\bin\x64\にあるfreeglut.dllをC:\Windows\System32の中にコピーしました。


> https://tadaoyamaoka.hatenablog.com/entry/2017/02/28/064625

こちらの記事を参考にさせていただきました。（ありがとうございます！）


### ffmpegのインストール
> https://fukatsu.tech/windows-ffmpeg

こちらの記事の手順をそのまま使わせていただきました。（ありがとうございます！）


# 実行手順
### コードのダウンロード
```
(pifu)$git clone https://github.com/facebookresearch/pifuhd.git
(pifu)$cd pifuhd
```

### モデルのダウンロード
```
(pifu)$mkdir checkpoints
(pifu)$cd checkpoints
(pifu)$wget "https://dl.fbaipublicfiles.com/pifuhd/checkpoints/pifuhd.pt" -O pifuhd.pt
(pifu)$cd ..
```
wgetがない場合は、[ここ](https://dl.fbaipublicfiles.com/pifuhd/checkpoints/pifuhd.pt)からpifuhd.ptを直接ダウンロードして、checkpoints配下に格納してください。

### コードを修正
私の環境だとOpenGLを使うときにエラーが出たので、lib/render/gl/render.pyを以下のように修正しました。

```python
[render.py]
class Render:
    def __init__(self, width=1600, height=1200, name='GL Renderer',
                 program_files=['simple.fs', 'simple.vs'], color_size=1, ms_rate=1):
        self.width = width
        self.height = height
        self.name = name
        self.display_mode = GLUT_DOUBLE | GLUT_RGB | GLUT_DEPTH
        self.use_inverse_depth = False

        global _glut_window
        if _glut_window is None:
            glutInit()
            glutInitDisplayMode(self.display_mode)
            glutInitWindowSize(self.width, self.height)
            glutInitWindowPosition(0, 0)
            # ここを修正
            # _glut_window = glutCreateWindow("My Render.")
            _glut_window = glutCreateWindow(b"My Render.")

```

### demo.shのコマンドを実行する
```
(pifu)$python -m apps.simple_test
(pifu)$python -m apps.render_turntable -f ./results/pifuhd_final/recon -ww 512 -hh 512
```

上記コマンドを実行すると、画面上に以下のようなアニメーションが流れるかと思います！
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/130155/93805c14-de22-28ef-08a2-b86b07d92d7f.png)

加えて、results/pifuhd_final/recon配下に「result_test_512.mp4」も出力されていると思います。

# おわりに
今回はFacebookResearchから公開されたPIFuHDのサンプルをWindowsで動かしてみました。
基本的にはREADME.mdを確認すれば簡単に試すことができるかと思います。

今後は、用意されたサンプルではなく自分の画像などで試してみようかと思います。
PIFuはSementic-Segmentationする必要がありましたが、PIFuHDではPose-Estimationで得られるキーポイントの情報でよいみたいです。公式ではOpenPoseを使った試し方が公開されていましたが、別にPose-Estimationアルゴリズムで出力形式を合わせられればなんでもよいと思います。
SwiftUIでサクッとButtonのイメージを実装する

## 環境
環境
Xcode11.5
Swift5
SwiftUI

## 何をしているか
SwiftUIフレームワークを用いた場合に, UIButtonに自前のimageを格納して実装しています。

### 前準備
1. UIButtonに格納する自前のイメージを作成します。
![button.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/195876/84d2ffef-7576-554d-a525-555985c14657.png)

2. Assetsに1.で作成した画像を格納します。
<img width="1437" alt="Screen Shot 2020-06-13 at 19.25.53.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/195876/4e8da53e-e4ec-123a-c172-835cfc00ef47.png">

### コードで実装
```ContentView.swift
import SwiftUI

struct ContentView: View {
    var body: some View {
        Button(action: {
            
        }, label: {
            // 自作したイメージのファイル名
            Image("button")
            .renderingMode(Image.TemplateRenderingMode?.init(Image.TemplateRenderingMode.original))
        })
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}


```

### シュミレータ実行
以下、このように自前イメージが格納されたUIButtonが表示されます。
<img width="322" alt="Screen Shot 2020-06-13 at 19.32.39.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/195876/a58ee3fc-e1e4-36d5-77b1-3d2535a0c170.png">

### 参考文献
https://stackoverflow.com/questions/56820779/how-can-i-create-a-button-with-image-in-swiftui

https://qiita.com/Masataka-n/items/760b56807322478285b6
AWS IoT Device Managementのフリートインデックスを試す。

[フリートプロビジョニングで作成したモノのシャドウをフリートインデックスでクエリする](https://qiita.com/sabmeua/items/670d57975aa55024a4f5)とほぼ同じ内容ですが、フリートインデックスを試してみました。

# フリートインデックスの作成を有効にする

AWSマネジメントコンソールでAWS IoTを開き、設定に移動します。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41574/b9674d89-3677-3c93-9269-6c49f2cd60b8.png)

`フリートインデックス作成を有効にする`をオンにするとフリートインデックスが作成されます。

その下のチェックは、、、見づらい。。

上から順番に

* **モノのインデックス作成** -   名前、説明、および属性に基づいてモノを検索します。
* **Device Shadow の追加** -   モノのインデックスに Device Shadow データを含めます。
* **モノの接続の追加** -   モノのインデックスにモノの接続データを含めます。
* **モノのグループのインデックス作成** -   グループ名、説明、および属性に基づいてモノのグループを検索します。

全部チェックつければすべてインデックス化されますが、課金がインデックスの更新でも発生するため、不必要な項目はチェックをオフにしましょう。

料金表
https://aws.amazon.com/jp/iot-device-management/pricing/

# 検索する

## マネジメントコンソール

マネジメントコンソールから検索するには`管理`->`モノ`の`フリートインデックス作成`から行えます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41574/6dc3e78e-bab3-a7cb-dae8-981b1818d0e8.png)

左の`検索`を選択

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41574/b30d61d6-1a2e-f065-1c22-d69ee9314fda.png)

ページ下部にサンプルクエリがあるので、とてもわかり易いです。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41574/655fc242-db07-8c3e-152a-e049bde3aede.png)

**現在接続中にデバイスを検索**

`connectivity.connected:true`

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41574/961d18d6-c8bc-3f5e-e772-aae957cd4332.png)


切断されているデバイスの場合は`false`にするだけです。
簡単ですね。

## CLI

上記と同様、接続中のデバイスを検索するには、

`aws iot search-index --query-string 'connectivity.connected:true'`

簡単ですね。
1日でWebRTCを使った素朴なビデオチャットを作ってみた時にひっかき集めたリンク集

WebRTCっていう技術を使うと、ビデオチャットや音声通話をWebの技術で作ることができます。
そんなWebRTC、「ちょっと試してみてよ」ってことになったので色々調べてみました。

「これもリンクに加えてよ！」って記事があればコメントください。
特にSaaSのサービスのリンクとか強化したいですね。

# 参考図書
- [WebRTC初心者でも簡単にできる！Node.jsで仲介（シグナリング）を作ってみよう | HTML5Experts.jp](https://html5experts.jp/mganeko/5349/)

この記事をそのまま作るとステップバイステップでネットワーク越しのWebRTCが作れますね！
SEO弱いんだよこの記事！　なんでもっと上に上がってこないの！

しかし、この記事のWebRTC実装ではNAT越え（ルーターから先との通信）ができません。
NAT越えをするためにはSTUNサーバーやTURNサーバーを用意、維持する必要があります。

そのためにどんなサーバー（とコード）が必要かについても連載にコード付きで乗っています。
- [連載 | WebRTCを使ってみよう！ | HTML5Experts.jp](https://html5experts.jp/series/webrtc-beginner/)

# 自前でシグナリングサーバーやSTUNサーバー、TURNサーバーを作りたいわけではない

- 自分でVPSとかにホストする
  - [OpenAyame プロジェクト](https://gist.github.com/voluntas/90cc9686a11de2f1acca845c6278a824)
  - [OpenAyame/ayame: WebRTC Signaling Server Ayame](https://github.com/OpenAyame/ayame)
     - 株式会社時雨堂がOSSでWebRTCのシグナリングサーバーのソースを公開しています
     - AyameはP2Pにしか対応していません
     - Ayameは1ルーム最大2名までしか対応していません

- SaaSでいい
  - [WebRTC SFU Sora](https://sora.shiguredo.jp/)
      -  株式会社時雨堂のサービス。同時接続数によるが結構かかる
  - [SkyWay | アプリやWebサービスに、ビデオ・音声通話をかんたんに導入・実装できるSDK](https://webrtc.ecl.ntt.com/)
      - 接続回数50万回/月まで、サーバ通信量500GB/月までタダで使えるSaaS。越えると１０万円〜

# 御託はいい！ 早くビデオチャットが作れればいいんだ！
- [Ayame Lite](https://ayame-lite.shiguredo.jp/beta)
  - WebRTCの公開TURNサーバー。Ayame を無料で利用できる無保証のサービス。
  - 1 ルームは最大 2 名に制限
  - Ayame Lite は転送量制限はアカウントごとなどはありませんが、 **サーバの転送量が決まっているためそれを超えると全員が利用できなくなります**
- [OpenAyame/ayame-web-sdk: Ayame Web SDK](https://github.com/OpenAyame/ayame-web-sdk)
  - 上述のAyameやAyame Liteに接続するWebのサンプル
- [OpenAyame/ayame-react-sample: Ayame React サンプル](https://github.com/OpenAyame/ayame-react-sample)
  - ReactNativeのサンプル。チェックアウトしてyarn serveすれば動くよ
- 前述のSkyWayとかもいいみたいですよ。（[TwiCall](https://twicall.net/)がSkyWayを採用して開発されたなど）

# WebRTCとは？ を知りたい
- [WebRTC コトハジメ](https://gist.github.com/voluntas/67e5a26915751226fdcf)
コンテキスト

# コンテキスト(context)とは
* DeepL翻訳  
文脈
* Google翻訳  
環境

他に思いつく表現としては、

* 観点
* 状況

いい表現が思い至ったので追記。

# 世界観
文脈でも良いのだけど、文脈というのはそれに対する観測者の意識が入るが、世界観はその中で当たり前のもの。
例えば、業務部門に所属するような方々はいちいちシステムにおける文脈などは意識しない。
当たり前のように存在する事象をいちいち意識することはない。だが、そこには色々な前提がある。

世界観における活動、をコンテキストと捉えても良いかも知れない。
その場合は、世界観は環境、と言い換えられるかもしれない。

## 実装におけるコンテキストの性質
* いつでも参照できる
* 状態を持つ
* ファクトリパターンやストラテジパターン、アダプターパターンで利用されるイメージ
* コンテキストは他のコンテキストと共存する

## 実装におけるコンテキストとして管理する例
* 言語別表示
* システム管理者向け表示文言、エンドユーザー向け表示文言
* 本番用、開発用の違い
* テスト実行時か本番実行時か
* エラーコンテキスト  
※ エラー処理に関する情報（処理やコンテナ）をコンテキストとして管理すると意外と楽という話。個人的にはreactでそういう案を出している例に感銘を受けた。
* 画面表示のダークテーマ、ライトテーマ
* ログイン、非ログインの状態

# コンテキストとは
どこかのサイトで拝見した名言がある
> コンテキストはコンテキストによって決まる
【heroku】S3を用いた画像投稿のエラー解決について（ Missing required arguments: aws_access_key_id, aws_secret_access_key (ArgumentError)）

# 経緯
どうも、プログラミング（３ケ月）初心者です！
今回は、herokuデプロイしたアプリケーションへ画像投稿できるように、ｓ３を導入しました。
この中で２日苦しんだことがあったので、共有したいと思います。

ちなみに、作業自体は、以下のサイトを参考に実施しました。
[herokuでS3に画像をアップロード(Rails)](https://qiita.com/4EAE_Learner/items/a8c0513c51e4199d8cdf)

※今回紹介するコードは全てターミナル上で実行するものになります。

# エラーについて
### （意気揚々）最初に紹介したページに沿って設定、いざ！！
```
git push heroku master
```

###（地獄の始まり）あれ、ちゃんと設定したのに…
>remote:        Tasks: TOP => environment
remote:        (See full trace by running task with --trace)
remote: 
remote:  !
remote:  !     Precompiling assets failed.
remote:  !
remote:  !     Push rejected, failed to compile Ruby app.
remote: 
remote:  !     Push failed
remote: Verifying deploy...
remote: 
remote: !	Push rejected to dailystack.
remote: 

最初のうちはどこがエラー吐いてるのか確認方法もわかりませんでした。

### （困惑）まず、ログを見てみるか…
```
$ heroku logs --tail
```
>heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=dailystack.herokuapp.com request_id=57401fa0-57b2-48ca-96b1-d0b49ad53fa2 fwd="111.239.154.52" dyno= connect= service= status=503 bytes= protocol=https
・
・
・

ふ、ふーん。なるほどね。（やべー、全くわかんない）

### （一筋の光）Railsを走らせてみようか。
```
$ heroku run rails c
```
> Missing required arguments: aws_access_key_id, aws_secret_access_key (ArgumentError)

キーが上手く設定せれていないのだろう。
これ以上どう設定すればいいのやら…


# 解決方法
### 原因それは…
ずばり、heroku上で環境変数を設定できていなかったことでした。
ずっと、不思議ではありました。
**ローカルで設定した環境変数をherokuはどうやって値を引っ張ってるんだろう**って。。

はい、そんなことできるわけないですよね笑
できたら環境変数の意味全くないです。
### 環境変数の設定方法
```
$ heroku config:set S3_ACCESS_KEY=" <<CSVダウンロードしたAccessキー>> "
$ heroku config:set S3_SECRET_KEY=" <<CSVダウンロードしたSecretキー>> "
$ heroku config:set S3_BUCKET_KEY=" <<S3のBucketの名前>> "
$ heroku config:set S3_REGION=" <<ap-northeast-1>> "

# << >>はわかりやすいように付けているだけです。実際は消してください。 
```
上記のコマンドでherokuに環境変数を設定してあげます。
最初に紹介したサイトでも一番最後に載ってましたね。。
意味が理解できてなくて飛ばしてました、、てへ

# まとめ
さて、いつものことながら、拙いポエムを最後まで読んでいただき、ありがとうございました。

今回重要と感じたのは、エラーが出た時の対応についてです。
初心者の皆さんはherokuでエラーを吐かれても最初、何が起こっているかわからないと思います。

長ったらしかったかも知れませんが、今回は私なりのエラーへのアプローチ方法も記載していますので、何かの参考になれば嬉しいです。
Python スライスを使って文字列の一部を切り取る

#はじめに
Pythonで文字列を切り取る際に便利なスライス機能。
```[]```内で```:```を使い、切り取る文字を指定するが、説明の多くがいまいちピンと来ませんでした。
ここでは自分なりの解釈を掲載してみようと思います。

#スライス ```[]```
```python
str_1 = 'python'
print(str_1[2:6])
# 'thon'
```
例えば、文字列`'python'`の`thon`のみを取り出したかった場合、スライスを使い`[2:6]`と指定すればOKな非常に便利な機能。
しかし、ここでその数字の設定方法に違和感を感じます。

なぜなら、スライスは[開始位置:終了位置]で指定しますが、開始位置は文字列を0から数えた数字、終了位置は文字列を1から数えた数字、になるからです。
慣れればなんてこと無いのだと思いますが、全然しっくりこない。

###捉え方を変えてみる（回りくどくする）
自分なりの解釈で書き変えたものが以下です。

```python
str_1 = 'python'
start = 2
count = 4
print(str_1[start:start+count])
# 'thon'
```
まず`start`で何文字目からカウントするかを指定します。
`t`は0から数えて2文字目なので、`2`を指定します。

次に、開始位置から何文字取り出したいか、を`count`で指定します。
`'thon'`は4文字なので、`4`を指定します。

スライスはこのように解釈します。
[ (開始位置) : (開始位置＋文字数) ]
プログラム上では`[start:start+count]`で指定します。
これは`[2:6]`で指定した場合と同義ですが、しっくりくる説明かなと思います。

#最後に
実際にプログラムを書くときには、こんなに回りくどい方法で書く必要は無いと思います。
ただ、指定の方法に迷ったときなど、思い出すとミスが減らせます。
スライスを開発した経緯などは知らないのでわからないですが、ここで書いたような考え方で開発していたのなら良いな。。。
jetson nano上でTensorFlow環境を構築する

# 3行で
* jetson nanoで手軽に深層学習を試したいが、jetson nanoがarmアーキテクチャなせいで環境構築がトリッキー
* 深層学習に使えるとはいえ、非力なマシンなのでライブラリのインストールに時間がかかる
* nvidia提供のdockerイメージを使うと基本的な環境は構築済み！簡単！


# 環境
|  |使用環境|
|---|---|
|ハードウェア|jetson nano|
|JetPack|JetPack 4.4 Developer Preview|

# 方針
ndivia提供のコンテナを使います。この記事で紹介する以外にも、色々なコンテナがあります。
[nvidia NGC](https://ngc.nvidia.com/catalog/all)

この記事で使うコンテナはこれです。
[Machine Learning for Jetson/L4T](https://ngc.nvidia.com/catalog/containers/nvidia:l4t-tensorflow)

>The l4t-ml:r32.4.2-py3 tag is available for Python 3.6 with the following components:
l4t-ml:r32.4.2-py3
TensorFlow 1.15
PyTorch v1.5.0
onnx 1.6.0
numpy 1.18.2
pandas 1.0.3
scipy 1.4.1
scikit-learn 0.22.2
JupyterLab 2.0.1
note: the l4t-ml container requires JetPack 4.4 Developer Preview (L4T R32.4.2)

とのことなので、機械学習でよく使う基本ライブラリとTensorFlow, PyTorchのフレームワークが入ったイメージになります。
TensorFlowが入っているということは、TensorFlowに内蔵されたkerasもあるので、kerasも使えます。

# 使い方
公式の通り

```bash
sudo docker pull nvcr.io/nvidia/l4t-ml:r32.4.2-py3
sudo docker run -it --rm --runtime nvidia --network host nvcr.io/nvidia/l4t-ml:r32.4.2-py3
```

でもよし。このイメージをベースにアレンジしたコンテナイメージを作りたいなら、

```dockerfile:Dockerfile
FROM nvcr.io/nvidia/l4t-ml:r32.4.2-py3
```

から`Dockerfile`を作ればOKです。
`docker pull`にまあまあ時間(数十分ぐらい)かかりますが、ホストOSに直接導入するよりはるかに短い時間で終わります。

# 参考
armアーキテクチャへの各種深層学習フレームワークをホストOSに直接導入するには下記を参照ください
[Jetson Zoo](https://elinux.org/Jetson_Zoo)

# 感想
このコンテナ、公開されたのが2020年4月30日と（記事公開時点で）かなり最近です。
ちょっと前は四苦八苦してホストOSにTensorFlow入れてたんですが・・・、jetsonの進化はすごいスピードですね。

# 追記
2020.08.25
jetpack 4.4がリリースされたことに伴い、docker pullの対象も変わりました。
jetpack 4.4を使う場合は
`nvcr.io/nvidia/l4t-ml:r32.4.3-py3`をpullなりFROMに指定するなりしてください。
【Python】SSL認証に関するエラー返ってきたときの対処法


**状況**: モジュール*urllib.request*で*UserAgent*をヘッダーにつけて*https*リクエストでスクレイピングしたときに以下のようなエラーメッセージがでた．．

```
ssl.SSLCertVerificationError: [SSL: CERTIFICATE_VERIFY_FAILED] certificate verify failed: unable to get local issuer certificate (_ssl.c:1056)

During handling of the above exception, another exception occurred:
```


**問題**: *https*通信における暗号化方式の一つとして*SSL*というものが利用されていてその際に起きたエラー．SSLとはWebサーバに「SSLサーバ証明書」と呼ばれる電子証明書を配置しておき接続時に検証することでWebサイトを運営する会社の身元を確認できる暗号化方式である．またSSLサーバ証明書そのものは発行を認められた「認証局」による運営元の認証作業を通過する必要があり，逆に信頼できない発行元のSSLサーバ証明書が利用されている場合にはWebブラウザに警告画面が表示される．それによって今回のようなSSLエラーが表示されることがある．

**解決方法**：以下を追加．

```python

import ssl
ssl._create_default_https_context = ssl._create_unverified_context
```
セキュリティ上は安全とは言えないのでその点に注意してご利用ください．
PhalconのVoltでfor文を使う方法

最近Phalconに触る機会があり、Voltテンプレートエンジンでfor文を書きたいときに苦戦したので、備忘録としてメモ( ..)φ。

## 環境

- PHP 7.2
- Phalcon 3.4

## 概要

PhalconではVoltというテンプレートエンジンが採用されており、いくつかの制御構文を使用できます。
その中にループ処理のための`for`文があるのですが、これはPHPの`foreach`文のような動作をします。

```html
{% for user in users %}
    * Name: {{ user.name }}
{% endfor  %}
```

今回はPHPの`for`文に該当するループ処理をするための方法を記載します。

## 結論

voltでは、`..`という演算子があり、PHPの[range関数](https://www.php.net/manual/ja/function.range.php)のようなことができます。
これとVoltの`for`文を組み合わせて、下記のような処理を書くことでPHPの`for`文のようなループ処理を実現できます。

```html
<select>
{% for year in 1950..2020 %}
    <option>{{ year }}</option>
{% endfor  %}
</select>
```

## 参考

[Volt: テンプレートエンジン &mdash; Phalcon 2.0.8 ドキュメント](https://teruchiphalcon-docs.readthedocs.io/ja/latest/reference/volt.html)
ESP-32でMicroPythonをはじめよう

マイコンや電子工作から始まった人にとってC言語は当たり前かもしれませんが
フロントエンドから始めた方にC言語は敷居が高いようです。
そんな中で組み込み系のPythonとしてMicroPythonがあります。

今回は、ESP-32でMicroPythonを始める方に向けて導入部を説明します。

なお、日本語ドキュメントがありますので、こちらを参照ください。
https://micropython-docs-ja.readthedocs.io/ja/latest/esp32/tutorial/intro.html

##環境
・Windows10
##使用ソフト
・コマンドプロンプト
・TeraTerm

・pip (python3)
##ターゲットボード
ESP-32 Devkit-C

Macの人は、こちらが良いかと
https://qiita.com/moomooya/items/ea30fe1113b21ebc9329

##バイナリファイルのダウンロード
以下サイトからバイナリファイルをダウンロードします。
http://micropython.org/download/esp32/
![1.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/285344/dc6cce6e-3ed3-de07-6bcc-4af3a595f4a1.jpeg)
ご自身の環境に合わせて適切なファイルを選択します。
私は、こちらです
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/285344/028c4fce-74ec-fe5b-4596-34d3ac49ad13.png"width="500">
##バイナリファイルの書き込み
まずは、起動します
検索窓でCMDと打てばコマンドプロンプトが起動します。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/285344/4edf5873-7ca7-ac96-8092-8e93289b8b49.png"width="500">
コマンドプロンプトで

```
pip install esptool
```
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/285344/7d54bc1f-ef9b-c3ce-cbc4-ac65ec8c6782.png"width="500">
なお、pipが入っていない人は、
Python環境から構築する方が良いようです。
https://gammasoft.jp/python/python-library-install/

(pipまたはpip3など・・・）

これでesptoolがインストールされました。
![1-5-2.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/285344/2baee541-4df8-58cc-2391-795e8114a927.jpeg)

esptool.pyを使います
ファイルは、Pythonフォルダの下になります。
Python3.7の場合こちらです。
C:\Python37\Lib\site-packages

MicroPythonを書き込む前にerase_flashします、
次に、write_flash します。
COMxはご自身のCOMポートを
ファイルは、先ほどダウンロードしたファイルを指定します。

```
cd C:\Python37\Lib\site-packages
esptool.py --chip esp32 --port COMx erase_flash
esptool.py --chip esp32 --port COMx write_flash -z 0x1000 ファイル名.bin
```

###erase_flash
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/285344/3321d207-1448-f5be-127e-2761208954d6.png)

###erase_flash後にリセットすると（TeraTerm）
![1-7-2.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/285344/fece9f40-9735-7c31-31c3-810d1c60738f.jpeg)

###ファーム書き込み
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/285344/16dd6c96-e266-2eec-65a5-b21246761f71.png)

##起動
TeraTermがこの画面になれば正常に起動したことになります。
なお、接続は、
ビットレート：115200
です。

##プログラミング
クイックリファレンスを参考にプログラムを書いていくことになります。
https://micropython-docs-ja.readthedocs.io/ja/latest/esp32/quickref.html#

起動時の画面を対話モード（MicroPython REPL）と言うそうです。
なお、ファイルを書き込みしていない為、リセットすると初期化されることになります。
別途ファイルを書きこむ手法があります。
MicroPythonは、プログラムを書く際に、スペースやインデントを付け間違えると動かないケースもあります。
専用のエディタを使用するか、ファイルを転送などがあります

専用のエディタとしては
uPyCraftなどがあるようです。

以上、導入についての解説でした。
Pythonを用いた計測器制御 [pyvisa]

# はじめに
pythonを用いた計測器制御の方法を最近知りました。
有名な計測器制御ソフト（LabV*EWなど）と比べて、汎用性・自由度が高いことに感動を覚えています。
具体的なサンプルプログラムなどは後日まとめるとして、ここでは使用頻度の高いpyvisaのコマンドを列挙します。
自分用の備忘録なのであしからず。

参考ページ: PyVISA
https://pyvisa.readthedocs.io/en/latest/

# 環境
python3.7.7
Windows10

# 環境構築
ここではPythonはインストール済と想定しています。
### NI-VISAのインストール
通信を行うために必要なもの。National Instrumentsが無償提供するものが一般的。自分の使用するPCのOSにあったものをインストールする。他にもPyVISAでは、他社提供のVISAでも動く。
（Keysight VISA, R&S VISA, tekVISA、など）


### PyVISAのインストール
pip（pip3）から入れる。

```
$ pip install pyvisa
```

これで環境構築は完了。
非常に簡単。

## サンプルコード
```python
import pyvisa

rm = pyvisa.ResourceManager()
visa_list = rm.list_resources()
usb_1 = visa_list[0]
inst_1 = rm.open_resource(usb1)

inst_1.write('*IDN?')
out = inst_1.read()

# queryを用いてももちろんOK
# out = inst_1.query('*IDN?')

print(out)
# (計測器の情報）
```
以下より、このコードの説明をする。

python上でimport、インスタンスの生成を行う。

```python
import pyvisa

# インスタンス生成、おまじないのようなもの
rm = pyvisa.ResourceManager()
# PCに接続された計測器のVISAリソース名の取得
visa_list = rm.list_resources()
```
ここで、```rm```は任意。また、```rm.list_resources()```はlistでVISAリソース名が返ってくる。ここでは機器1つがUSBポートに接続されていると仮定。VISAリソース名の取得を行う。

```python
# VISAリソース名
usb_1 = visa_list[0]
```
VISAリソース名を使って、計測器を指定。

```python
# 計測器の指定
inst_1 = rm.open_resource(usb1)
```

###VISA書き込み
```python
inst_1.write('*IDN?')
```

```'*IDN?'``` は計測器の機種情報を聞くためのコマンド。多くの機器で採用されている。

### VISA読み込み
```python
inst_1.read()
```
先程送ったクエリに対する返答を読むことができる。
今回、'IDN?'を送っているので、機種情報が返ってくる。

### VISAクエリ
```python
inst_1.query('*IDN?')
```
クエリを送り、返り値を受け取るまで一度に行ってくれるスグレモノ。上2つを1行で書くことができるため、簡素化することができる。
なお、クエリのないコマンドを送るとエラーが出るため注意。

### 複数コマンドの一度送信
```python
inst_1.write('*rst, *IDN?')
```
複数のコマンドを一度に送信することもできる。機器の設定コマンドなど、何行も書くとプログラムが煩雑になる。これを使うといくぶんかスッキリする。
ただ、一度に多くのコマンドを送りすぎると、通信が追いつかなくなるため、時間を置くなど様子見は必要。

ここまでで紹介したVISA通信用コマンドと、ループ等のプログラミング基礎骨格、計算などを組み合わせ、制御プログラムを構築する。
なお、VISAを経由し計測器に送るSCPI通信用のコマンドは、各種計測器の取説を参照すること。

# 最後に
ここではPythonを使って計測器を制御する方法について説明しました。
計測器との接続方法は、USBケーブル、NI社のUSB-GPIBケーブルを使うと良いと思います。
GPIBケーブルは少々高額だし、最近の計測器は基本的にUSB端子がついてるので、USBケーブルでの接続をおすすめします。

今後、実際に制御を行うプログラムやそのときに使うコードなどを簡単にまとめていく予定です。

https://github.com/QualiaLab/pyvisa_IDN.git
GitHubのAzure/go-autorestのREADME(v14.1.1)を日本語訳

今後の理解のために、GitHubのAzure/go-autorestのv14.1.1のREADME([v14.1.1](https://github.com/Azure/go-autorest/blob/v14.1.1/README.md))を日本語訳しました。

- [GitHub - qt-luigi/go-autorest-docs-jp: Azure/go-autorestの日本語訳 (original: https://github.com/Azure/go-autorest)](https://github.com/qt-luigi/go-autorest-docs-jp)

go-autorestは、GoでAzureへアクセスする際の認証や、Goの基本型を変換するヘルパーを利用する際になどに使用します。

- [「autorest」および「go-autorest」とは？ - Qiita](https://qiita.com/qt-luigi/items/08ce47416bd1ea340ce6)
フルパスからフォルダパスを取る｜Power Query

色々方法はありますが、忘れてしまっていたので、書き残しておきます。
その場で書けないといけないですね。:sweat:

##コード

```pq:フォルダパスを取る
(Target as text)=>
    Text.BeforeDelimiter(Target, "\", {0, RelativePosition.FromEnd})
```

実行した様子。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/370992/a0dd9b31-e279-fb3e-61e3-c247b275e649.png)

##参考
[Text.BeforeDelimiter - PowerQuery M | Microsoft Docs](https://docs.microsoft.com/ja-jp/powerquery-m/text-beforedelimiter)
AmazonLinux2 に RemoteDesktop でログインする

# AmazonLinux2 に RemoteDesktop でログインする

時々、Linux環境のGUIが必要になる時があります。(UIインストーラしかない時とか)
AmazonLinux2でそんな状態になった時用の手順です。
(今時、多くはないですが)

クライアントの準備も Windows Remote Desktop Client を使うだけなので楽です。

なお、以下2つの記事を組み合わせた内容です。

- [Amazon Linux 2 を実行している Amazon EC2 インスタンスにグラフィカルユーザーインターフェイス (GUI) をインストールしたいと考えています。どうすればよいですか?]( https://aws.amazon.com/jp/premiumsupport/knowledge-center/ec2-linux-2-install-gui/)
- [WindowsのRDPを使ってクラウド上のLinuxインスタンスに接続する](https://qiita.com/yamada-hakase/items/a8efe626f598c5eb6f8c)

## TL;DR

MATE, TigerVNC をインストールして xrdp をたちあげれば Windows Remote Desktop から繋がる。

## 手順

### 1. MATEをインストールする

```bash
sudo amazon-linux-extras install mate-desktop1.x
sudo bash -c 'echo PREFERRED=/usr/bin/mate-session > /etc/sysconfig/desktop'
```

2つ目のコマンドで、全てのユーザに対し MATE をデフォルトデスクトップとして指定します。

### 2. TigerVNCをインストールする

```bash
sudo yum install tigervnc-server
vncpasswd
```

2つ目のコマンドは、VNC固有パスワードを設定します。

```
sh-4.2$ vncpasswd
vncpasswd
Password:
Verify:
Would you like to enter a view-only password (y/n)? n
A view-only password is not used
sh-4.2$
```

### 3. xrdp をインストール、起動する。

```bash
sudo amazon-linux-extras install epel
sudo yum install xrdp
sudo systemctl start xrdp
sudo systemctl enable xrdp
```

amazon linux extras で epelリポジトリを使えるようにした上でインストールします。

### 4. 接続してみる

Windows からのログインです。標準のリモートデスクトップクライアントを使っています。

![login.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/286147/9ea1cd67-c98a-6884-57bb-4b3abef61d96.png)

ユーザとパスワードを入れてOKします。

![loggedin.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/286147/12ffeb3a-d59b-85a7-5738-6bd8784165b7.png)

入れました。

Macの Microsoft Remote Desktop でも同様に入れました。

![msremotedesktop.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/286147/94e51fb6-7929-b350-eef4-26afa1702fc1.png)

## おまけ

### epel 入れた後、リポジトリの参照がうまくいかなかった時

このページを参考にしました。
[yum updateで「他のミラーを試します」から進まない時の対処法](https://monakaice88.hatenablog.com/entry/2016/10/30/101409)

書いてあることとちょっと違いますが、 `/etc/yum.repos.d/epel.repo` を開き、以下対処で解消しました。参考まで。
- baseurl のコメントアウトを外す
- metalink をコメントアウトする

(以下、修正後の例)

```/etc/yum.repos.d/epel.repo
[epel]
name=Extra Packages for Enterprise Linux 7 - $basearch
baseurl=http://download.fedoraproject.org/pub/epel/7/$basearch
#metalink=https://mirrors.fedoraproject.org/metalink?repo=epel-7&arch=$basearch
failovermethod=priority
enabled=1
gpgcheck=1
gpgkey=file:///etc/pki/rpm-gpg/RPM-GPG-KEY-EPEL-7

...
```