OmniAICreator/Qiita-1.07M huggingface dataset:
AWS入門、ついでにDocker入門

# 目次
１．概要
２．Dockerとは
３．動かしてみよう
４．管理してみよう
***
##１．概要

・AWS/Docker初心者が
　AWSを使ってDockerを動かしてみました。

・AWSを使って様々な製品、技術に触れるハードルが下がればと思います。

***
##２．Dockerとは
コンテナ型の仮想化環境を
作成、配布、実行するためのプラットフォーム

ホストOS上で仮想化するので
○起動が高速、環境構築が簡単・・・
△ホストOSと同一のOSしか使えない・・・
![Docker比較.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/549521/946f99d6-8e96-9581-0dd6-7c700fac5895.png)
##Dockerの起動イメージ
![Dockerイメージ.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/549521/db66ebd7-9f68-bc1c-8b11-4a91df58d741.png)

***
##３．Dockerを動かしてみよう
（１）AWS EC2の立ち上げ
（２）Dockerをインストール
（３）DockerイメージからDockerコンテナを動かす

![動作イメージ.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/549521/30cdbdd5-2434-fe70-b1db-992410c7c352.png)

（１）AWS EC2の立ち上げ
EC2コンソール上からインスタンスを立ち上げる。
（今回はAmazon Linux 2）

（２）Dockerをインストール
AWS提供リポジトリからDockerが取得できる。
(数秒で完了)

```ruby:docker1.log
$ sudo yum install docker
読み込んだプラグイン:extras_suggestions, langpacks, priorities, update-motd
~中略~
インストール:docker.x86_64 0:18.09.9ce-2.amzn2
依存性関連をインストールしました:
  containerd.x86_64 0:1.2.6-1.amzn2              
  libcgroup.x86_64 0:0.41-21.amzn2   
  pigz.x86_64 0:2.3.4-1.amzn2.0.1                
  runc.x86_64 0:1.0.0-0.1.20190510.git2b18fe1.amzn2
完了しました!
```

（３）DockerイメージからDockerコンテナを動かしてみる
「Unable to find image 'hello-world:latest' locally
latest: Pulling from library/hello-world」
→ローカルにhello-worldイメージが存在しないため、
　DockerHubのライブラリから取得。

```ruby:docker2.log
$sudo docker run hello-world
Unable to find image 'hello-world:latest' locally
latest: Pulling from library/hello-world
1b930d010525: Pull complete 
Digest: sha256:4fe721ccc2e8dc7362278a29dc660d833570ec2682f4e4194f4ee23e415e1064
Status: Downloaded newer image for hello-world:latest

Hello from Docker!
This message shows that your installation appears to be working correctly.
```
***
##４．Dockerを管理してみよう

（１）DockerHub
（２）Amazon ECS/ECR

（１）DockerHub
Dockerイメージを公開・共有できるサービス
![DockerHub.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/549521/1366c176-0e4a-f703-1c88-22a44a8c3f9f.png)

（２）Amazon ECS/ECR
ECS:Amazon Elastic Container Service
Dockerコンテナの管理サービス。

|![ECS1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/549521/7dc26784-2e58-68e6-f536-13f00e1fb13f.png)|
|:-:|

|![ECS2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/549521/17a4d56a-53f0-27ed-41b2-57bb51f36852.png)|
|:-:|

|![ECS3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/549521/ff835dda-0a3b-68c8-cb8d-703ae5aff111.png)|
|:-:|

|![ECS$.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/549521/1a2a79f6-3344-78b9-c79b-618fc5875f4f.png)|
|:-:|

ECR：Amazon Elastic Container Registry
Dockerイメージの管理サービス。
<img width="1225" alt="スクリーンショット 2019-12-19 3.05.59.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/549521/4ed0f081-8e4f-dc75-bc0b-5fbac7211b03.png">
sbt consoleのキーバインドをvimに変更していく

## はじめに
sbtは立ち上げっぱが前提となっているcliですよね。[^1]
そうすると困るのはなんでしょう。
そうです、キーバインドですね。
普段のshellではせっかくvimなどのキーバインドを使用していても、sbtになると突然バインドは失われます。
衰退です。
そんなお困りのscala民のためにsbtでもvimキーバインドを使用できるように設定しましょう。

## 設定方法
簡単です。
`$HOME/.inputrc`に以下を追記しましょう。

```shell
set editing-mode vi
```

これで平和が訪れます。

## `.inputrc`とは
そもそも`.inputrc`とは何でしょう。
実態はlinuxの設定ファイルです。
具体的にはreadlineという行操作を支援するライブラリの設定を行うための設定ファイルです。
bashを始めとする各CUIはこのライブラリを利用して行操作を実現しています。
ここから察するにおそらくsbtもreadlineを利用しているのでしょう。

## まとめ
sbtを使うイライラもこれで解消。

## 参考
https://stackoverflow.com/questions/53458458/using-vim-in-scala-sbt-console-scala-repl
http://x68000.q-e-d.net/~68user/unix/pickup?%7E%2F%2Einputrc
http://x68000.q-e-d.net/~68user/unix/pickup?readline

[^1]: scala界の象徴こと水島さんのブログを参考(http://kmizu.hatenablog.com/entry/2017/05/06/160822)
Intersection ObserverのrootMarginには負の値を指定できる

# tl; dr

- IntersectionObserverの`rootMargin`オプションに`'-50% 0px -50% 0px'`とか指定できる
- 要素が画面の真ん中に来たときにイベント発火！とかできる

Google Chrome Version 79で確認しています。

# Intersection Observerとは

[Intersection Observer API \- Web API \| MDN](https://developer.mozilla.org/ja/docs/Web/API/Intersection_Observer_API)

JavaScriptにおいてDOM要素の交差を監視することができるAPIです。
いままでonscrollなどで実装していた画像の遅延読み込みなどが簡単、効率的に実現できます。

使い方としてはこんな感じ

```javascript
var intersectionObserver = new IntersectionObserver(function(entries) {
  // intersectionRatio が 0 の場合、対象がビューの外にあるので、
  // 何かをする必要はありません。
  if (entries[0].intersectionRatio <= 0) return;

  loadItems(10);
  console.log('Loaded new items');
}, {
  root: document.querySelector('#root'),
  rootMargin: '0px 0px 0px 0px',
  threshold: 1.0
});
// 監視を開始
intersectionObserver.observe(document.querySelector('.scrollerFooter'));
```
([IntersectionObserver \- Web API \| MDN](https://developer.mozilla.org/ja/docs/Web/API/IntersectionObserver) の例にオプションを追記)

オプションは3つありますが、ここで注目したいのは`rootMargin`です。MDNの説明では

> 交差状態を計算するときに root の バウンディングボックス に適用されるオフセットの矩形で、計算のために root を効果的に縮小または拡大させます。

というもので、画面内に要素が入ったときではなく、そのちょっと外側に入ったときから早めにイベントを起こさせたい、みたいなのが主なユースケースだと思います。

今回このAPIで遊んでいるうちに、rootMarginに負の値が取れることに気づきました。


# 何ができるか

負の値を指定することで、画面の中央に来たときにイベントを発火させることができます。
ユースケースとしては、長い記事やBBS系のサイトで「ここまで読んだ」的な機能に使えるのでは無いでしょうか。
(画面の中央に来たら読んだよね！という前提)

実際にCodePenでサンプルを作ってみました。
ボックス内をスクロールすると、真ん中の線を超えたときに色が変わります。

<p class="codepen" data-height="520" data-theme-id="default" data-default-tab="js,result" data-user="diaphragm" data-slug-hash="bGNBVxw" style="height: 520px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;" data-pen-title="Intersection observer with negative rootMargin">
  <span>See the Pen <a href="https://codepen.io/diaphragm/pen/bGNBVxw">
  Intersection observer with negative rootMargin</a> by diaphragm (<a href="https://codepen.io/diaphragm">@diaphragm</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://static.codepen.io/assets/embed/ei.js"></script>

# 問題点

- IntersectionObserver自体がまだ実験的なAPI
- 仕様上rootMarginに負の値を渡していいのか未調査(MDNの説明に縮小って書いてあるから意図的だとは思う)
VBA 用のCode Analyzerを書いた


未だに、Excel VBAを主に使っているmnruと申します。
今ライブラリを作成しており、そのリファクタリング用にexcelのマクロファイルから、すべての関数を抜き出すようなツールを使いたかったのですが、しっくりくるのがなかったので自作しました。analyzerというには名前負けしていますが[github] (https://github.com/mnru/VBA-CodeAnalyzer)にMITライセンスで公開しているので、よかったら使ってみてください。

<img width="926" alt="image.PNG" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/7906/07e80092-0d75-42b0-ea81-79c8a56fd3b9.png">

上の画像がその作成中のライブラリ「modFnc」と「modAry」を解析したものです。関数型風のプログラミングを目指した関数と配列のライブラリで、advent calendarの開催中にもう少し開発を進めて、どんなものかを説明できればなあと思っています。


2020-1-18更新

Code Analyzer をExcelのアドインにしました。
使いやすくなったと思うので、試してもらうと嬉しいです。
<img width="944" alt="image.PNG" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/7906/a2b70033-0c11-09f7-14e4-46a525c4dd1e.png">
WACATE 2019 冬 に行ってきました その1

テスト界隈では有名なWACATE、ついに参加してきました。
精神と時の部屋はここにあったか！ という感じです。

# 概要

- そもそもWACATEとは
    - [公式サイト](https://wacate.jp/)
    - **W**orkshop for **A**ccelerating **CA**pable **T**esting **E**ngineers
        - 内に秘めた可能性を持つテストエンジニアたちを加速させるためのワークショップ、だそうです。
        - というわけで「ワカテ」と名がつくけど若手でなくても参加OK
    - 毎年夏と冬に開催
        - 1泊2日でソフトウェアテストに関するセッションやワークショップが行われます。
        - 基本的に夏は深く狭く、冬は浅く広いテーマを扱うので、冬は初心者向けらしい。
            - とはいえ [朝から晩までみっちり濃厚なプログラム](https://wacate.jp/workshops/2019winter/program/) が組まれています。

- 当日の様子はTwitterがわかりやすいかも
    - [Togetter](https://togetter.com/li/1442999) (まとめ感謝)
- すでに他の方から参加レポートが上がっています。早い！
    - [WACATE2019冬 参加レポート](https://medium.com/wingarc/wacate2019%E5%86%AC-%E5%8F%82%E5%8A%A0%E3%83%AC%E3%83%9D%E3%83%BC%E3%83%88-298438ee7eff)
    - [WACATE2019冬「あなたの番です」参加レポート1日目！](https://yuki-shiro.hatenablog.com/entry/2019/12/17/205802)


# ポジションペーパーセッション

参加者は事前にポジションペーパーを提出しており、全員分のペーパーがまとめられた冊子が当日に配布されます。
(参考: [実行委員の前回ポジションペーパー紹介 - 実行委員ブログ](https://wacate.jp/2019/11/07/20191107pos/))

5〜6人ずつのグループに分かれているので、まずその中で自己紹介と自身のポジションペーパーの内容について話します。
全員話し終えたら席替えをして、再度自己紹介。

各グループに必ず2回目以上参加している人が入るよう組み分けされているため、不安な点についても気軽に聞くことができて安心です。

# BPPセッション

ポジションペーパーは参加者の投票をもとにBPP(ベストポジションペーパー賞)が与えられます。
前回のWACATEでBPPを取得した方によるセッションが行われました。

## 「お前のポジぺ、それでいいのか？」

前回受賞者、はるにゃんさんのポジションペーパーはWACATEにかなりの爪痕を残したようです。
内容は、こちらを読んで察してください。

- [お前は真の男のためのWACATEに参加したか？ - note](https://note.com/mjtns/n/n1433cc9a4b08)

なお、 [第119回テストラジオ](https://testradio.fm/testradio-no/725/) でこちらのセッションの裏話が公開されています。

- [Podcast](https://podcasts.apple.com/jp/podcast/1000459693227/id1268373805?i=1000459693227)

笑いの絶えないセッション内容でしたが、いくつか鋭い指摘がされていました。

- 決められたフォーマット通りに書いてしまっていないか？
    - 型にはまった内容ばかりではつまらない
    - イロモノの中では硬派が目立ち、硬派の中ではイロモノが目立つ
- ポジぺはコミュニケーションのためにある
    - 会話のきっかけになるような内容が書けているだろうか？

かくいう私もフォーマットに沿ってありきたりな内容に留めてしまったひとりです。
これはリベンジするしかない。

# セッション1: 業務でも活用できるソフトウェアテストの7原則

- 資料
    - [スライド](https://speakerdeck.com/nihonbuson/seven-testing-principles)
    -  [WACATE2019冬でなぜ私は「ソフトウェアテストの7原則」のセッションを行ったのか #WACATE](http://nihonbuson.hatenadiary.jp/entry/2019/12/16/235000)

- JSTQB FL シラバスだと1ページ弱しかないソフトウェアの7原則。
でもテストエンジニア以外の人にも読んでほしい要素が詰まっている…！
というわけで、7原則について具体例を交えながら解説されました。

- ワーク
    - プロジェクトの開始からリリース後までの会話文
    - 会話の中の問題点を挙げて、それに対して7原則の中のどれを意識すべきかをグループで話し合うというもの。

個人で7原則を読んでいると

> 1「テストは欠陥があることは示せるが、欠陥がないことは示せない」
> 2「全数テストは不可能」

といったあたりに意識が向きがちなのですが、
より判断力が求められるのは

> **6「テストは状況次第」(状況が異なれば、テストの方法も変わる)**

だと感じました。

開発サイクルによっては **シフトライト** (シフトレフトではない状態) でもコストがかからないケースがあります。
何らかの理由で原則が守れない場合もあると理解し、寄り添っていく姿勢を忘れずにいきましょう。

---

長くなったので一旦こちらで区切ります。

[やっとその2を書きました。](https://qiita.com/yoya_k/items/4da070c6b44f8db376fb)
サービスを良くするために、データサイエンティストがアルゴリズムより先に考えたいこと

機械学習エンジニア・データサイエンティストの[muraokaz](https://qiita.com/muraokaz)です。[VISITS Advent Calendar 2019](https://qiita.com/advent-calendar/2019/visits)の19日目の記事となります。9日目の記事では可視化の定量評価というややニッチな技術について書きましたが、今回は違った切り口からデータサイエンスについて書いてみたいと思います。

最近、仕事中に接した学生さんから「（企業でやっていくときの）データサイエンスで大切なことって何ですか？」と聞かれました。データサイエンス領域が注目を集めていることもあり、研究室やゼミでデータ分析をしている、あるいはKaggleなどに興味を持ってチャレンジしてみたという学生さんも増えてきていて、就活や卒業を前に、より”実践的”な場面でどんなスキルを身につければ良いのか気にする方が少なくないようです。

# Facebookの事例

私は普段データサイエンスの中でも機械学習領域を扱っており、その役割のひとつについて話すときによく紹介する例として、2018年1月にザッカーバーグが発表したFacebook投稿の表示順序（アルゴリズム）の変更があります。これは、企業やブランドのFacebookページの投稿より友人による投稿を優先して表示する変更で、発表当時大きな反響がありました。
https://www.itmedia.co.jp/news/articles/1801/12/news059.html

詳しくない方のために補足すると、Facebookの「ホーム」フィード（＝ページを開いたときに最初に目にする主要なタイムライン）には友人の投稿のほか、自分が「いいね」をしたFacebookページの投稿などが並びますが、その並び順はデフォルトでは新着順とはなっておらず、Facebookのアルゴリズムが持つ計算式によって算出されたスコアによってその並び順が決まっています（ユーザーは「最新」↔「ハイライト」で並び順を変更できます）。そして上記の発表は、変更前に企業やブランドのFacebookページで高くなっていたスコアを今回調整した（する）、という内容でした。

なぜ、企業やブランドのFacebookページのほうが友人の投稿よりもスコアが高くなっていたのでしょうか。以前、似た（数千万人規模でデータを機械学習するような）フィードアルゴリズムを設計・開発していた経験から推察すると、変更前のスコアは、**ユーザーが興味を持つようなコンテンツを上位に持ってくるように最適化**されていたのではないかと思われます。

Facebookに限らず、最近の多くのWebページやアプリでは、ユーザーがサービス上でどれくらいの時間を過ごしていたか（あるいはどれくらいのコンテンツを閲覧したか）を計測しています。そして、いくつかのサービスでは機械学習アルゴリズムを利用してその数値を最大化するようにコンテンツを選んだり配置する仕組みを採用しています。ユーザーがサービスにより多くの時間滞在することで、掲載されている広告等から多くの収入を得られるようになります。企業やブランドのFacebookページのスコアが高くなっていたのは、端的に言うとこれらの発信した投稿が（友人の投稿と比べて）ユーザーの興味を多く引いていたためであると考えられるのです。

# サービスが何を目指すのか、数値化の難しさ

従って、ザッカーバーグの発表は、**短期的にはユーザーの興味のあるコンテンツの優先順位を下げ、Facebookの収益も下げる施策である**と考えられたため、驚きを持って迎えられました。上記記事にもありますが、ザッカーバーグは「この変更で、ユーザーがFacebookで過ごす時間が短くなり、エンゲージメントも下がるかもしれない。だが、ユーザーがFacebookで過ごす時間は今より価値のあるものになり、もしこのやり方が正しければ、長い目で見ればコミュニティだけでなく、われわれの事業にとってもメリットになると信じている」と述べています。

最初の質問に戻ると、機械学習エンジニア（・データサイエンティスト）のもとには、「〇〇のサービスがもっとXXとなるように改善したいんですが」というような相談が多くやってきます。そして、僕たちが取り組む最初の、そしてもっとも大切だとも言える仕事は、まだこのように抽象的なサービスの目指していく目的地を、機械（コンピュータ）でもわかる数値目標にブレークダウンすることです。コンペティション形式のデータ分析は、既にこの問題設計が完了したところからのスタートですが、現実にはそのスタート以前のところにも大きな仕事が存在しています。

目的を数値化する難しさの根源は、**普段人間が無意識にしか考えていない常識を再認識しなければならない**ところにあります。

人間の思考は様々な前提条件に縛られています。例えば、我々が「お金持ちになりたい」と言ったとき、それは通常、銀行からめいいっぱい借金をして一時的にお金を持っている状態は指していません。

機械にはこうした常識は通用せず、もし検索ページにおいて「クリックを最大化すること」を目標にアルゴリズムを改良していったとすれば、「ユーザーの検索意図ではないが、つい興味を持ってしまいそうなもの」が検索結果のページに紛れ込んできてしまうでしょう。宿題をしようとしていたのに視界に漫画がちらちら入ってきたら勉強がぜんぜん進まなさそうです。ユーザーは、最初はそうした検索サービスを面白がって利用していたとしても、次第に時間を無駄にしていることに気付いて離れていってしまうかもしれません。現実の検索エンジンがそうなっていないのはシステム設計者のおかげですが、深層学習（ディープラーニング）などの発展によりアルゴリズムのブラックボックス化が進むと、思いがけずこうした状態に嵌ってしまうサービスが増えてきても不思議ではありません。

# データやアルゴリズムを扱う人に求められること

ビッグデータに機械学習を用いると非常に強力なアルゴリズムを作れますが、その目的変数（文字通りの意味での）を適切に定めないと思いもよらない挙動を示してしまうこともあります。Facebookの事例は、ユーザーのエンゲージメントを目的変数としていたところ、アルゴリズムがサービスのありたい姿を超えて最適化された（それにザッカーバーグが気付いて軌道修正した）という見方ができると思います。サービス開発者は「XXのようになってほしい」といった目指す場所を描いていますが、データとアルゴリズムについてもっとも触れている機械学習エンジニア（・データサイエンティスト）にはその目標を正しく翻訳することが期待されているでしょう。

冒頭の学生さんに限らず、機械学習アルゴリズムやデータに興味を持っている方は、その延長線上にある実際の世界との繋がり（コンペティションの外側）にも目を向けていると思います。その二つを擦り合わせるため、またデータサイエンスに対する理解を少しでも深めるために、このエントリーが少しでも役立てば幸いです。
招待先環境でPower BI To Azure Data Lake Storage Gen 2 の接続がうまくいかなかったので対処法をメモ

#はじめに
Azure Data Lake Storage Gen2(以下、ADLS G2)
のコネクタがGAしました。
https://powerbi.microsoft.com/en-us/blog/power-bi-desktop-december-2019-feature-summary/

接続方法
https://docs.microsoft.com/ja-jp/azure/storage/blobs/data-lake-storage-use-power-bi

早速試したところ、環境によっては特殊な対処が必要となることがわかったので記載します。

*2019/12月時点

#事象
AのActive DirectoryのユーザがBのActive Directoryに招待され、BのテナントのADLS G2にPower BIからAD認証で接続できないという事象が起きました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/281819/dae7bb93-fa98-e696-2d4f-8a453ae56124.png)

#原因
AのユーザがUserA@A.onmicrosoft.com、BのADのドメインが@B.onmicrosoft.comだとすると、招待先のBのAD上では以下のようなUserとして登録されます。

UserA_A.onmicrosoft.com#EXT#@B.onmicrosoft.com
（Portal上では普通にUserA@A.onmicrosoft.comとして表示されます。）

BのテナントでUserA@A.onmicrosoft.comに対してADLS G2へのアクセス権限を付与し、Power BIからいつものUserA@A.onmicrosoft.comでADLS G2に対して認証をするとUserA_A.onmicrosoft.com#EXT#@B.onmicrosoft.comと異なるIDとして認識され、うまく認可ができないようでした。
*動作感に対する私の主観です

#対処法
2つの手順が必要です

- 外部ユーザのパスワードリセット
- 外部ユーザのACL登録

##外部ユーザのパスワードリセット
では、UserA_A.onmicrosoft.com#EXT#@B.onmicrosoft.comというIDでサインインしてみることが必要なのですが、既定ではサインインエラーとなるかと思います。

UserA_A.onmicrosoft.com#EXT#@B.onmicrosoft.comのパスワードは非公開の状態で、UserA@A.onmicrosoft.comとは別のパスワードとなっているようです。

したがって、@B.onmicrosoft.comのユーザ管理者にパスワードをリセットしてもらう必要があります。
コード例は下記

```powershell:pss
$secure = read-host -assecurestring
一時パスワード入力
Set-AzureADUserPassword -ObjectId "UserA_A.onmicrosoft.com#EXT#@B.onmicrosoft.com" -Password $secure -ForceChangePasswordNextLogin $true

```

$secureには一時パスワードを設定してもらい、次回ログイン時にはパスワード変更が走るようなスクリプトです。

これでUserA_A.onmicrosoft.com#EXT#@B.onmicrosoft.comでサインインすると認証が成功します。
しかしもう一つ設定が必要です。

##外部ユーザのACL登録
Azure Storage Explorerからアクセス管理を設定します。
BのAD上のユーザであればRBACでBLOBデータ共同作成者などをStorage Accoutのスコープでつければよいようですが、今回のケースでのUserA_A.onmicrosoft.com#EXT#@B.onmicrosoft.comとはうまく連携できないようでした。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/281819/f1bd65ab-f8b1-32e0-5360-8ba346308f83.png)

ユーザを検索すると、#EXT#がついたユーザとして表示されると思います。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/281819/83dc8ef8-40ed-c094-6a9e-74438deff15a.png)

設定の詳細はこちら
https://docs.microsoft.com/ja-jp/azure/storage/blobs/data-lake-storage-how-to-set-permissions-storage-explorer

設定が完了するとPower BIから接続が可能になります。

以上
My Seeed's Gadgets

# いつの間にか、なんとなく集まってしまったSeeed製品です
## はじめに
この記事は 「[Seeed UG Advent Calendar 2019 - Qiita](https://qiita.com/advent-calendar/2019/seeed_ug) 」の 19日目 の記事です。
また、私がQiitaに載せる初の記事です。

IoTで使えるGadgetを集めている内に、いろいろお世話になっている Seeed さんの製品がてんこ盛りになっていました。未使用・未開封のものもある中、改めてチェックして「なんだこれ！」と気づいたことを記事にしてみようと思います。

## いつの間にか私の手元に集まってきたSeeed製品の面々

自分で購入したモノあり、もらいモノあり、借りモノあり、有償・無償・非売品の有象無象です。
![IMG_0511.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/553549/acff5423-056a-3d88-a7de-aaf8d6ddf1f8.jpeg)

## ReButton
この青い**ReButton**は、箱のオビにあるMicrosoftさんの**IoT in Action**向けのモノで非売品のもらいモノです。
この**ReButton**は、今年一番たくさん使ったGadgetです。
![IMG_0513.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/553549/d8bafa56-5187-6806-545a-b9f7ea933efc.jpeg)
もうひとつの緑の**ReButton**は、随分待たされた上、国内販売が開始された時に購入したモノです。
![IMG_0514.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/553549/bcc97526-0305-9172-4acc-8d2188f43e66.jpeg)

## Azure Sphere(MT3620)
これは、いつの間にか2つになってしまった**Azure Sphere(MT3620)**です。
片方は開封したものの、動かすにはAzureADテナントを作って、デバイスの登録をしないといけないし、1度デバイス登録すると他のテナントで使えなくなってしまうという**ちょっとお試しで使うのに気が引けるデバイス**なので、一度も動かしていません。
![IMG_0516.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/553549/381ecb90-7e16-a861-856e-af21c49a2a2b.jpeg)

## Seeedさんのステッカー＆ノベルティ
これは、「[Seeed UGのAdvent Calendarで12月2日の記事](https://lab.seeed.co.jp/entry/2019/12/03/150000)」に上がったステッカーとノベルティですね。
なんと、モノホンが全部手元にありました！
![IMG_0515.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/553549/69747952-2388-7d4e-8810-6249c384aaeb.jpeg)

## Seeeduino
これは、今年のMFT2019で購入したモノです。
今日まで、箱を開けてなかったのですが、開けてみたら**Seeed Fusion**のクーポンコードのついたカードが入っていました。
でも、よく見ると・・・・
![IMG_0512.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/553549/fd10d41a-0c15-9d11-8777-239fcb0024e3.jpeg)

なんと、クーポンコードの期限が「**Dec. 31, 2017**」って、最初っから終わってるカード？
まぁ、**Seeed Fusion**の割引額($6.90)よりお安いデバイスなので、全然気になりませんけどね。
![IMG_0507.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/553549/35dd4154-9d59-634f-e295-6744e7f143b4.jpeg)

## ヘラカード？
もう一つのカードが、これまた今年のMFT2019で購入した**Grove - Wrapper**のおまけ(？)についてきたモノです。
何かの間違いで、おまけについてきたみたいなんですが、今となってはよく分かりません。
![IMG_0508.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/553549/933cb587-233b-b9d8-29a2-2a4cb9d2adfe.jpeg)
![IMG_0509.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/553549/8589e0cf-846a-9dd9-abd7-d0dabf713f0e.jpeg)


## おわりに
私が持っているSeeed製品を全部紹介しませんでしたが、なんとなく集まってきたこれらのSeeed製品などは、まだまだSeeedさんの全製品と比べると極一部だけなので、この先もどんどん増えて行くんだと思います。

これからもお世話になります！Seeedさん
VueComponentの切り方

この記事は[Aizu Advent Calendar 2019](https://adventar.org/calendars/3938) の16日目の記事です。

Vue.jsでWebアプリを作ってる際、どう設計していいか迷うことがあるので、その際参考にした記事を自分なりに備忘録としてまとめようと思います。

# コンポーネントってどう分ければいいんだよ！！

Vue.jsを使ってSPAを作ろうと早くも何ヶ月も経ってしまった...

***だってどこでコンポーネント分けていいかわかんないんだもん！***

そんなこんなで開発が止まってしまうことがよくあります。ありますよね？！ね？？

# なぜVueComponentの設計が難しいか
#### 従来のMVVMと違う

- VueComponentは**View+ViewModel**を持っている

本来ViewはViewModelからデータを受け取るため、View同士(もしくはViewModel同士)でデータを受け渡すことを想定していない。そのためつなぎ目を意識しなくてよいが、VueComponentの設計を考えないとデータの受け渡しなどに苦労する。

- Modelについての仕組みやルールがない

そのためVuex等の状態管理ライブラリを使う。
しかし理解してやらないと状態管理がめちゃくちゃになる。

今回はModelやVuexの取り扱いには触れず、どのようにコンポーネントを分ければいいかにだけ触れます。

# VueComponentの切り方
## 責務によって切る!!
*参考記事にはContainerの責務と5つのComponentの責務がありますが、今回は自分に必要そうなContainerの責務と3つのComponentの責務を書きます。

- 「Container」の責務

- 「Component」の責務
    - 「ViewModel」の責務
    - Templateが肥大化したときに分割されつくられる「View」の責務
    - 「汎用UIパーツ」としての責務
    
### 「Container」の責務
*Containerは１画面につき１つ
#####1. ページの構成を表す
 - 画面内に配置するComponentを定義する
 - 画面全体で必要なModelやStateを管理する
 - 画面内で共通の処理を定義する
 - Component間のイベントバスになる

#####2. 他ページとの関係を表す
 - 画面同士でデータや状態のやりとりを行う
 - ルーティング処理を定義する
 - vue-routerがurlと紐付けるコンポーネントとなる

### 「Component」の責務
#### 「ViewModel」の責務

VueComponentはView(\<template>部分)+ViewModel(\<Script>部分)を持つ。
なので、**ViewModelの役割を過不足なく実装されているとViewModelの責務を持っている**。
######ViewModelの役割とは
>https://aloerina01.github.io/blog/2018-05-01-1
>>・methodsにコンポーネントを操作するロジックを持つ
・data, computedにコンポーネントのStateを定義する
・data, computedにコンポーネントに必要なModelを定義し、リアクティブに更新する
・Templateにdataやcomputedで定義した値を反映する、またv-model等でTemplateの変更を検知する

ViewModelComponentはそれ単体で1つの機能を担っている。
Component名がその機能を表しているか確認する。

#### 「View」の責務

View ComponentはReactのようにステートレスなコンポーネントで、親コンポーネントから受け取るpropsのみで動作させる。

そのため独自のViewのみを持ちViewModelを持たないComponentである。

ロジックを実装したり過剰に機能を持たせたりしないように注意する必要がある。

#### 「Design」の責務
実装の仕方は「View」の責務と同じである。
違う点はUIパーツのデザイン共通化を目的に作られること。

#最後に
わかりづらい部分があると思いますがお許しください。アウトプットってむずかしい...

まだまだVueだけでなくエンジニアとしても🔰なのでこれからも学び続けたいです。

ご指摘大歓迎です。

#参考

[メンテナンスしやすいVueComponentを設計するために気をつけていること](https://aloerina01.github.io/blog/2018-05-01-1)
[Vue+VuexでMVVMなWebApplicationを設計するときに考えたいこと](https://aloerina01.github.io/blog/2017-08-29-1)
php7.2をインストールした後、phpコマンドが効かない件

# php7.2のインストール


以下のコマンドを打ちました。

```
# sudo wget https://dl.fedoraproject.org/pub/epel/epel-release-latest-7.noarch.rpm
# sudo rpm -ivh epel-release-latest-7.noarch.rpm
# sudo yum-config-manager --enable remi-php72
# sudo yum install -y php72 php72-php

```

さてさて、ちゃんとインストールできたか確認するか。

```
# php -v
```

phpのバージョンを確認

```
-bash: php: command not found
```

***ん？？***

phpのコマンドが見つからないだと。。。

```
# php72 -v
```

これならうまくいくのです。

ただ、コマンドがphp72ではなく、phpでないと結構不便が出てきたり。。。

```
scl enable php72 bash
```

このコマンドを打つことによって、一時的にだがphpコマンドが使えるようになる。
一度ログアウトすると設定は消える。
Raspberry Pi 4にUbuntu Serverをモニター無しでインストールする。

#導入
ダウンロード先に軽くインストールガイドが乗っています
[ubuntu.com/download/raspberry-pi](https://ubuntu.com/download/raspberry-pi)
ガイドには必要なものとして

- A microSD card
- An Ubuntu Server image
- A monitor with an HDMI interface
- An HDMI cable
- A USB keyboard

とありますが、

- SDカード
- Lanケーブル
- 電源用のUSBケーブル

だけでインストール可能です。
操作はSSHクライアントを使って行います。
Raspberry Pi 4(以下ラズパイ)は15Wの電源を推奨しています。
ラズパイ4に接続しているUSB機器の電流の大きさが500mA以下の場合は(高品質の)2.5Aの電源で大丈夫なようです。
~~自分の環境では5V 2.4Aの電源で使っています。~~

-Raspberry Pi 4 詳細スペック-
[www.raspberrypi.org/products/raspberry-pi-4-model-b/specifications/](https://www.raspberrypi.org/products/raspberry-pi-4-model-b/specifications/)

#UbuntuServerをダウンロードする
[ubuntu.com/download/raspberry-pi](https://ubuntu.com/download/raspberry-pi)からUbuntuServerをダウンロードします。
私は__64-bit for Raspberry Pi 3 and 4__をダウンロードしました。

#UbuntuServerのイメージファイルを焼く
ヒャッハー火事だぜぇ！！！！
###balenaEtcherをダウンロードする。
balenaEtcherはイメージファイルをUSBメモリやSDカードにブートできるように展開してくれるアプリです。
[www.balena.io/etcher/](https://www.balena.io/etcher/)  からダウンロードできます。
インストールが必要な通常バージョンとインストール不要で実行可能なポータブル版があります。好きな方をダウンロードしてください。

###balenaEtcherを使ってSDカードにイメージファイルを展開する
ダウンロード(&インストール)したbalenaEtcherを実行します。
![screenshot.1142.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/402287/10d7da4d-a1df-f8ee-306d-8ab9eed475fd.jpeg)

 `Select image` を押してダウンロードしたUbuntuServerのイメージファイルを選択します。![screenshot.1143.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/402287/8dace26c-1909-3abe-f7aa-17677abf4425.jpeg)
イメージファイルを選択するとイメージファイルを展開するSDカードやUSBメモリが自動的に選択されます。
変更したい場合は`Change`を押して変更します。

![screenshot.1144.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/402287/6454e286-1c4f-2409-0468-58ad16a4da26.jpeg)
`Flash!`を押すと展開が始まるのでしばし待ちます。
![screenshot.1145.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/402287/da892417-be3a-3263-43fe-e486f365c879.jpeg)

この画面が表示されれば完了です。
お好きな方法でSDカードを取り出しましょう。
~~やっぱぶっち抜きだよね~~

#Raspberry Pi 4を起動させる
ラズパイ4に先程のSDカードとLANケーブル、そして電源のUSBケーブルを指します
USBケーブルを指した瞬間に電源が入るので、電源は一番最後。

電源が入ってから起動するまでしばらく時間がかかります。
ARPコマンドやnbtstatコマンドなのでラズパイ4のipアドレスを検索します。
(自分はMACアドレスのベンダーIDから検索しました。効率のいい方法があれば教えて下さい。)

起動が完了すればSSHクライアントで接続可能になります。
初期ユーザー名とパスワードはどちらとも`ubuntu`になっています。
初回ログイン時にパスワードの変更が求められるので新しいパスワードを設定します。
新しいパスワードが設定されると自動でログアウトさせられるのでユーザー名:`ubuntu` パスワード`新しいパスワード`
ログインします。

###これにて完了です。
あとは煮るなり焼くなり好きにしろ。
コードを生成するコードを作ると人生が楽になる 【Unity】

シーン・サウンド・エフェクト等が追加された事で変数も新しく追加で用意する必要が出てきて
何回も決まりきった流れのコードを追記していく経験はありませんか

これはコードの自動生成で対策することが出来ます。

なにか難しそうに感じると思うのですが、とても単純でコード文を書いてファイル出力するだけで作れます

作り方
------------------


       private static string ASSETS_PATH = Application.dataPath + "/";
       private static string SOURCE_TEMPLATE =
        @"public class #SCRIPTNAME#
        {
        }";
        
        /// <summary>
        /// ソース出力
        /// </summary>
        /// <param name="fileName"></param>
        private static void CreateSource(string fileName)
        {
            // インポート開始
            AssetDatabase.StartAssetEditing();

            StreamWriter cs = new StreamWriter(ASSETS_PATH + fileName + ".cs", false, Encoding.UTF8);

            // 書き出すコードを組み立てる
            StringBuilder stringBuilder = new StringBuilder(SOURCE_TEMPLATE);
            
            // ※ここで用途に合わせ追記

            // ファイルにコードを書き込む
            cs.Write(stringBuilder);

            // ファイルを閉じる
            cs.Close();

            // インポート終了
            AssetDatabase.StopAssetEditing();

            // アセットインポートする
            AssetDatabase.Refresh(ImportAssetOptions.ImportRecursive);
        }




次回はこの仕組みを使って何か便利な仕組みを紹介できればと考えています。
DockerのMaxscaleでホストにマウントしたログをログローテーション (2)

cronのDockerコンテナからcronを動かして別のDockerコンテナのlogroate実行

## 動作確認環境

AWS Workspaces
Amazon Linux2 (Time zone: Asia/Tokyo (JST, +0900))
Maxscale 2.4.4

##ディレクトリ

```
home/username/logrotate
|--log
|  |--maxscale
|  |  |--maxscale.log
|--maxscale
|  |--maxscale_logrotate
|--maxscale-dockerfiles
|  |--Dockerfile
|--cron-logrotate-docker-dockerfiles
|  |--Dockerfile
|  |--maxscale-cron
```

```maxscale-dockerfiles/Dockerfile:
FROM mariadb/maxscale:2.4.4

RUN apt-get update && apt-get -y install logrotate

#RUN mv /etc/cron.daily/logrotate /etc/cron.hourly/logrotate
#ADD maxscale-cron /etc/cron.d/maxscale-cron
#RUN chmod 0644 /etc/cron.d/maxscale-cron
```
```:maxscale/maxscale_logrotate
/var/log/maxscale/maxscale.log {
  su maxscale maxscale
  create 644 maxscale maxscale
  rotate 3
  missingok
  compress
  delaycompress
  sharedscripts
  size 1K
  dateext
  dateformat %Y%m%d%H%M%S
  postrotate
    kill -USR1 `cat /var/run/maxscale/maxscale.pid`
  endscript
}
```

```:cron-logrotate-docker-dockerfiles/Dockerfile
FROM alpine:3.10.3

RUN apk --update add docker && rm -rf /var/cache/apk/*

COPY maxscale-cron /etc/crontabs/root

# cronのdaemonを起動(log level=1, foreground)
CMD crond -l 1 -f
```

```:cron-logrotate-docker-dockerfiles/maxscale-cron
*/1 * * * * docker exec maxscale /usr/sbin/logrotate -f /etc/logrotate.d/maxscale_logrotate >> /var/log/cron.log 2>&1
```
## Dockerイメージ作成

```
$ mkdir -p log/maxscale
$ chmod 777 log/maxscale
$ mkdir maxscale
$ mkdir maxscale-dockerfiles
$ mkdir cron-logrotate-docker-dockerfiles

$ cd maxscale-dockerfiles
$ docker build -t maxscale-log:2.4.4 .
$ cd ..
$ cd cron-logrotate-docker-dockerfiles
$ docker build -t base:1.0 .
```

## 動作確認

```
$ cd ..
$ sudo chown root:root maxscale/maxscale_logrotate

$ docker run -d \
--name base \
-v /var/run/docker.sock:/var/run/docker.sock \
base:1.0

# MaxscaleのDockerコンテナ起動
$ docker run \
-d \
--name maxscale \
-v $(pwd)/log/maxscale:/var/log/maxscale \
-v $(pwd)/maxscale/maxscale_logrotate:/etc/logrotate.d/maxscale_logrotate \
maxscale-log:2.4.4 \
maxscale -d -U maxscale -l file

# ログ確認
$ ls -l log/maxscale/

合計 8
-rw-r--r-- 1 chrony ssh_keys   0 12月 19 01:40 maxscale.log
-rw-r--r-- 1 chrony ssh_keys 707 12月 19 01:39 maxscale.log20191218163900.gz
-rw-r--r-- 1 chrony ssh_keys 187 12月 19 01:40 maxscale.log20191218164000
```

## Docker 公式コンテナを使って別のコンテナにdocker execする方法 (2019/12/20追記)

コンテナ内でコンテナを操作する主立ったやり方には

DinD(Docker in Docker)
DooD(Docker outside of Docker)
の二つがある。
[コンテナからコンテナを操作する](https://blog.nijohando.jp/post/docker-in-docker-docker-outside-of-docker/)

DooDを使ってみる

```
$ docker run -ti --rm -v /var/run/docker.sock:/var/run/docker.sock docker /bin/ash
/ # docker exec maxscale /usr/sbin/logrotate -f /etc/logrotate.d/maxscale_logrotate
/ # exit
$ ls log/maxscale/ -l

合計 8
-rw-r--r-- 1 chrony ssh_keys  187 12月 20 23:29 maxscale.log
-rw-r--r-- 1 chrony ssh_keys 1831 12月 20 23:29 maxscale.log20191220142926
```
ざっくりスクラム開発とスクラムチームの役割

## アジャイルソフトウェア開発という考え方
以下は[アジャイルソフトウェア開発宣言](https://agilemanifesto.org/iso/ja/manifesto.html)の抜粋である。

> プロセスやツールよりも**個人と対話**を
包括的なドキュメントよりも**動くソフトウェア**を
契約交渉よりも**顧客との協調**を
計画に従うことよりも**変化への対応**を

これに加え、[アジャイル宣言の背後にある原則](https://agilemanifesto.org/iso/ja/principles.html)というものがあり、
これらは、いわばアジャイルソフトウェア開発が目指しているビジョンだと思っていいかもしれない。

つまり、余計なしがらみを排除し、顧客に最大限歩み寄って、
速やかに顧客に価値を提供するという考え方に思える。

## 主要なアジャイルソフトウェア開発の手法
これらのビジョンを体現するには、具体的な手段が必要となる。

代表的なアジャイルソフトウェア開発の手法としては以下のようなものがあるが、今回はそのうちのスクラム開発に焦点をあてる。

<img width="624" alt="スクリーンショット 2019-12-18 23.54.41.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32691/2cd141bf-b67a-3633-f9f6-fab89a02245c.png">


## スクラム開発の概要をざっくり

### スクラム開発と、従来のウォーターフォール開発との違い

<img width="502" alt="スクリーンショット 2019-12-19 0.15.37.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32691/c245ed75-9f5b-3243-b0cf-f2763f9ddc54.png">

ウォーターフォールと違い、スクラム開発では、実際に動く成果物(インクリメント)をスプリントという単位で作っていき、そのフィードバックを次のスプリントで活かすという形をとる。
つまり、毎スプリントの最後には、顧客が動作確認できる成果物が存在していることとなる。
これを繰り返すことで、プロダクトをより顧客の要望に沿った形にするのだ。

### スクラムにおける３つの役割

<img width="438" alt="スクリーンショット 2019-12-19 0.21.24.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32691/35f8a7d9-1c6e-84cf-c895-8ada8d350c7b.png">

スクラムにおいての役割は、基本的に以下の３つしか存在しない。

#### プロダクトオーナー
プロダクトに責任をもち、プロダクトバックログを充実させる。

#### スクラムマスター
組織、開発チーム、プロダクトオーナーに対してのサポートやスクラム支援を行う。
チームマネジメントは行わない。

#### 開発チーム
開発チームは以下にあるようなフィーチャーチームを形成し、各スプリントの終わりに成果物(インクリメント)を作成できるよう集中する。

### 開発チームのあり方

データベース専門のチームを作ったり、特定の領域の専門家で集めたコンポーネントチームではなく、スキルセットが横断型で、そのチーム単体で顧客に価値を提供できるフィーチャーチームを作る。

<img width="492" alt="スクリーンショット 2019-12-19 1.08.12.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32691/8eec46f6-52e3-0064-d5cd-602501b8c01b.png">


### スクラムミーティング
スクラム開発では、スプリントという単位で開発を進めていく。
各スプリントの最後には、開発チームの成果物(インクリメント)からフィードバックを受けるフェーズがある。それを元にまた次のスプリントの計画を練る。
スプリントは決められた時間がすぎれば終わる。だいたい２周間とかで組むところが多い。

<img width="429" alt="スクリーンショット 2019-12-19 1.29.16.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32691/bfcd9e82-6029-0c8b-ba56-0c742395f3bb.png">


#### スプリント計画
プロダクトオーナーがプロダクトバックログ(顧客の要求が一個一個のアイテムとなって乗っかってるボード的なもの)にあるアイテムのビジネス的な優先順位を決め、開発チームと技術的な部分を踏まえて、スプリントでやることを決める。

スプリントバックログにプロダクトバックログからPBIsをもってくる。
スプリントバックログに乗ったPBIsを分割し、タスクにする。
つまり、何(PBIs)をどうするか(タスクに落とし込む)決めるのがこのフェーズ。

#### デイリースクラム
毎日やるやつ。次の２４時間にやることを決める。

#### スプリントレビュー
開発チームの成果物(インクリメント)に対してのフィードバックをうける。

#### スプリントの振り返り
KPTなどを用いて、次スプリントの改善を目的として、
近スプリントを振り返る。

#### バックログリファインメント
大きなプロダクトバックログアイテムを、より小さいストーリーに分割して明確にする。
プロダクトバックログを最新の状態に更新する。


## ソフトウェア開発における依存関係は空想の産物

例えば家の建造などは「土台を作り、骨組みを組み立て、その後に屋根を作る・・・」などと順序だてて作る必要がある。
従来のこういった分野では、土木や、建築など専門色が強く、横断的なスキルを持つフィーチャーチームが組みにくいのと、むしろそれをやってしまうと効率が圧倒的に下がるのではないかと思える。
設計が決まってからの変更要求などはソフトウェアと違って生じにくいからだ。変更がほとんど生じないなら、ウォーターフォールが効率的だ。

たしかに、こういった物理的なものを使ったものづくりは、手順に依存関係があったり、ウォーターフォールが効率的な場合があるだろうが、ソフトウェアにまで同じ法則を適用する必要はない。
インターフェースで切ってモックを作っておいたり、一見依存関係に見えてる部分があっても、やりようはある。 だって**ソフト**ウェアだもの。


## 参考
詳細は、[スクラムリファレンスカード](http://scrumreferencecard.com/ScrumReferenceCard_v1_3_jp.pdf)や[スクラムガイド](https://www.scrumguides.org/docs/scrumguide/v2017/2017-Scrum-Guide-Japanese.pdf)などによくまとめられている。
HashiCorp Speaker Slides and Social Templates

この記事は[terraform Advent Calendar 2019](https://qiita.com/advent-calendar/2019/terraform)の17日目の穴埋め記事です。
アドカレに穴が開いて、カレンダーランキングに乗らないのは悲しいので頑張って埋めています。

とはいえそんなにネタがあるわけじゃないので、困っていたところ、[ちょうどいいネタ](https://twitter.com/HashiCorp/status/1207329871296417794)が流れてきたので共有だけしてお茶を濁そうかなって。


めちゃくちゃかっこいい、[HashiCorpのユーザグループ向けプレゼンテーションテンプレート](https://docs.google.com/presentation/d/1TX8UTl1GtH5vOR54Tl60_Z_wBBOtoa9w1RoaaDolmsk/edit?usp=sharing)です。

ディスカッションの日付的には９月にはあったっぽい？けど、知ったのは今なんで！ｗ


![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/44420/0c7fae44-ac4c-5d24-9c88-14665c6212f1.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/44420/45ec56fc-5f77-fc66-8bd5-4107c07bd1c4.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/44420/099f62c3-4559-6985-e4dc-5d0406f7fc3f.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/44420/67c670e3-81d9-c1e8-690d-179a300412c0.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/44420/195076dd-a345-08d4-4b58-3b0205a9c96f.png)

残念ながらスライドマスターとして作られているわけじゃないので、スライドコピーして使うしかない（スライドマスタ使いこなしてる人のほうが少ないかｗ）けど、見やすいと思うし、それっぽくなるので、次回からはこのスライドテンプレートを使ってプレゼンしようと思います。
Xamarin C# 非同期関数内で起きたExceptionをthrowする

WindowsBaseパッケージに入ってる
System.Windows.ThreadingのDispatcherを使えば、
別のスレッド上でからメインスレッドでExceptionを起こすことができる。

```C#
非同期関数～～～
System.Windows.Threading.Dispatcher.CurrentDispatcher.Invoke(() =>
{
   throw new Exception("メインスレッドでExceptionが起こる");
});
～～～
```

キャッチするにはApplication.TheradExceptionにイベントを設定しておくと、
ハンドリングされなかったExceptionが飛んでくる

```C#
System.Windows.Forms.Application.ThreadException += new System.Threading.ThreadExceptionEventHandler(this.OnThreadException);

private void OnThreadException(object sender, ThreadExceptionEventArgs e) {
}
```

Xamarin.Androidは以下でできる
Exception発生

```C#
非同期関数～～～～
Xamarin.Forms.Device.BeginInvokeOnMainThread(() =>
{
     throw new Exception("メインスレッドでExceptionが起こる");
});
～～～
```
キャッチ

```C#
AppDomain.CurrentDomain.UnhandledException += new UnhandledExceptionEventHandler(OnThreadException);
```
androidはunhandledExceptionイベントが走った時点でアプリが強制終了前提なので、拾ってもログ仕込むくらいのことしかできない
AndroidEnvironment.UnhandledExceptionRaiserを使えばアプリが落ちないとの情報もありましたが、だめでした。
https://qiita.com/ta-yamaoka/items/e374921d642e9ac84b3b
http://atamo-dev.hatenablog.com/entry/2016/10/30/174556

公式に回答ありました。
https://docs.microsoft.com/en-us/dotnet/api/system.appdomain.unhandledexception?redirectedfrom=MSDN&view=netframework-4.8
～～～～～～～～～～～～～～～～～～～～～～～～～
NET Frameworkバージョン1.0および1.1では、メインアプリケーションスレッド以外のスレッドで発生する未処理の例外はランタイムによってキャッチされるため、アプリケーションは終了しません。したがって、アプリケーションを終了せずにUnhandledExceptionイベントが発生する可能性があります。.NET Frameworkバージョン2.0から、子スレッドの未処理の例外のこのバックストップは削除されました。そのようなサイレント障害の累積的な影響には、パフォーマンスの低下、破損したデータ、ロックアップが含まれていたためです。ランタイムが終了しないケースのリストなど、詳細については、「マネージスレッドの例外」を参照してください。
～～～～～～～～～～～～～～～～～～～～～～～～～～～

.Net Framework2.0から強制終了するようにしたみたいですね。
Multiview stereo(MVS) 実装, ライブラリのメモ

## 背景

多視点画像から 3D 復元とかやりたい.

この分野, OpenCV, OpenMVS, PCL あたりが有名どころでしょうか?
(商用だと agisoft metasphere https://www.agisoft.com/)

## github topics

https://github.com/topics/multi-view-stereo

## MVStudio

お手軽 MVS 処理

https://3d.bk.tudelft.nl/liangliang/software.html

## MVS

open Multi-View Stereo reconstruction library
https://github.com/cdcseacave/openMVS

Shading-aware Multi-view Stereo
https://github.com/flanggut/smvs

Point-based Multi-view Stereo Network
https://github.com/callmeray/PointMVSNet


## PCL

RGB-D 画像や点群から 3D 復元

http://pointclouds.org/

http://pointclouds.org/documentation/overview/visualization.php

## その他

NRMVS: Non-Rigid Multi-View Stereo
https://arxiv.org/abs/1901.03910

polyfit
https://3d.bk.tudelft.nl/liangliang/publications/2017/polyfit/polyfit.html
stylusのsin,cos関数を使ってうんちたちをウェーブさせてみた

# sinとcos
stylusでは[ビルドイン関数](http://stylus-lang.com/docs/bifs.html)が用意されている。
そのなかで、これ使い所ある？みたいなものもありますね💩
その代表が`sin()`,`cos()`じゃないでしょうか。
`sin()`,`cos()`って聞くと波が思いつくので、波の形を作りたい時に使えそうです。
というわけでやってみます！

# Let's Try!
今回はちょっとコードが長くなるのでhtmlはpugを使います。
上のボタンを押してもらうとうんちたちが波の形に動きます💩
ボタンを押した時クラスを付けたかったので、そこはjsも書きました。
普通に書くとめんどくさいのでvueでサクッと書いてます。

<p class="codepen" data-height="265" data-theme-id="default" data-default-tab="result" data-user="petapetapeta" data-slug-hash="oNgYQjd" style="height: 265px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;" data-pen-title="sin">
  <span>See the Pen <a href="https://codepen.io/petapetapeta/pen/oNgYQjd">
  sin</a> by petapetapeta (<a href="https://codepen.io/petapetapeta">@petapetapeta</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://static.codepen.io/assets/embed/ei.js"></script>

## ポイント
### pug
pug(html)ではいっぱい同じような要素を作り、連番のクラスを振ります。
ここはvueでループさせてクラス振るように組んでも良かったですが、今回はpugのループで組みました。

### stylus
こちらもループを使い、連番のクラスのpositionを計算して波の形にします。
横軸（left）は単純にループの数値にXpx掛ける。
縦軸（top）はループの数値とsinやcos使って-1~1の数値を計算しそこにオフセットを掛けたり足したりするとOKです。

### vue
ulについたクラスによって、波の形を変えたいので、ここをバインドにして
buttonに@clickを入れてクラスを変更するようにします。
めちゃ簡単ですね💩
プログラミングを初めて１年たったのでちょっとこれまでのことを書いてみる

プログラミングを初めて約１年たったので、今までのことをとりあえず書いてみる。
これからへの自戒の念も込めて。

##プログラミングを始めたきっかけ
プログラミングを始めたのは２０１８年１１月1日。大学三年の冬。
それまでの僕は、大学が商学部でパソコンは大の苦手だった。
そんな僕がなんでプログラミングを始めたのかというと、就活が一番の理由だった。
就活を本格的に始めたのは大学三年の六月でそのころは全くエンジニアになるなんて思ってなかった。
むしろ自分は人と話すの大好きだし、ノルマとかに終われるのも大好きだし、やっぱりスーツ男子かっこいいし、大手内定もらってちょっと自慢もしたいし、ってことで大手日経企業の営業で就職を考えてた。
だからインターンも証券会社だったり不動産ばっか見てたんだけど、大学のインターンガイダンス見たいなやつで、登壇者がこんなことを言ってた。

「知らないことをやりたいと思うことはない。幼稚園生が将来は投資会社に就職して大きなお金を動かしたい！なんて言わないよね？」

この言葉がすごい心の中にささって、いろんな業界のインターンに行くようになった。
でも僕はかなり好奇心旺盛みたいで、やりたい仕事が見つからないんじゃなくてやりたい仕事がありすぎるっていう問題に直面した。

はあ、もう業界絞れねえ、、、、

そんな時にネットサーフィンしてたら、文系でもエンジニアになれる！みたいな記事を見つけた。そっからプログラミングってなんか面白そーだなーって軽く思いながら過ごしてたんだけど、
日々過ごすうちに、プログラミングやりたい！！！って気持ちが増してった。でも、今からプログラミング初めてエンジニアなんてなれるのかなあ、、、、ってずっと葛藤してた。
そんなある日、ちょっと酔っぱらて就活のこと考えてたら、素の声が出てきた、、、

「今までの俺って周りの目とか気にして、周りと同じように生きて、リスクを取らずに生きてばっかじゃねえか！もし今プログラミングやらなかったら一生プログラミングやらずに過ごして、あの時プログラミングやってたらどうなるんだろうなあ、、ってずっと後悔すんだろうなーーーー、、、なんかエンジニアってかっこいいし、やりたいことやっちゃえ！！！」

って思って、次の日二日酔いになりながらプログラミングの学習方法について調べまくった。これが大学３年１０月の話。
就活に備えてある程度のプログラミング経験を最短で積むためには？って考えた時に、パソコン苦手な僕には独学なんて絶対できないと思った。
ってことで、テックエキスパートっていうプログラミングスクールに通うことにした。これが大学３年の１１月。

##プログラミングスクールに通い初めてから
そっからは周りの友達が就活してる中で自分は就活一切せずに、バイトも一旦休んで毎日プログラミングの日々。
html、css、ruby、rails。
プログラミングスクールに通ったおかげでrailsを使ってブログサイトぐらいは作れるようになり、エラーも調べれば解決できるんだなあぐらいの感じになった。

そして大学3年の2月にエンジニア就活して自分の納得いく企業に内定を三月のもらって就活終了。

##就活を終えて大学４年４月
ちょっと明日朝早いのでこっからはめっちゃ簡単に書きます。

よっしゃとりあえず基本情報とるぞ！！！
まあ10月からだしjavaをとりあえずマスターするぞ！！！
まあ、大学４年、、、遊ぶよね、、、
4月,5月,6月,7月,8月、、、本当に何をやってたのかわからない。。。javaの技術書を2冊ほどしかできなかった。。。
9月、基本情報の午前試験の勉強開始
10、１１月、家庭の事情で毎日バイト生活になり結局基本情報の対策できず断念。
12月　会社でPHPめっちゃ使うみたいだからPHPの勉強開始
とりあえず、気持ち改めてこっからPHPめっちゃやるぞ。
Terraform + GKE + Kubernetes providerでCycle Error

# 問題
- 作成と更新はPlanもApplyも通るけどDestroyのApplyだけ通らない
- `terraform graph --draw-cycle`しても赤くならない

# 解決方法
- [これ](https://github.com/gruntwork-io/terraform-google-gke/blob/master/main.tf#L403..L413)を~~丸パクｹﾞﾌﾝｹﾞﾌﾝ~~...参考にしてdataブロックを使った
- 自分もよくわかってないのだけど、一度dataブロックを通すとエラー吐かなくなる

相当端折ってるけどこんな感じになった

```main.tf
provider "kubernetes" {
  version          = "~> 1.9"
  load_config_file = false

  host                   = data.template_file.gke_host_endpoint.rendered
  cluster_ca_certificate = base64decode(data.template_file.cluster_ca_certificate.rendered)
  token                  = data.template_file.access_token.rendered
}

data "google_client_config" "current" {}

data "template_file" "gke_host_endpoint" {
  template = module.gke.cluster.endpoint
}

data "template_file" "access_token" {
  template = data.google_client_config.current.access_token
}

data "template_file" "cluster_ca_certificate" {
  template = module.gke.cluster.master_auth.0.cluster_ca_certificate
}
```
  
  
  
たぶん、一度dataブロックで値を展開して保持しておくからapply時に参照関係を持たないとかそんな感じな気がするけど、ソース読んだわけでもないし確証は持てない。

詳しい人居たら教えてほしい
VBAでセルの値に文字列を追加しつつクリップボードに放り込むツールを作ってみた

# まえがき
前回記事のあとがきで書いた通りクリップボード扱いたいということでクリップボードを扱えるdataObjectをほんの少し触りました。前回記事は下記リンクをご参照下さい。
[前回記事（VBAで文字列、数値をSQLのIN句に入れる形にする）](https://qiita.com/hoshizima/items/888dc926abdd72ca05d1)

# コード

文字列型変数に選択範囲の値を突っ込みクリップボードに放り込む！以上！

```vb:Copy.bas

Sub String_Copy()

    Dim strHolder As String
    Dim intNum As Integer
    Dim dataObject As New dataObject
    
    strHolder = "'" & Selection(1).Value & "'"
    For intNum = 2 To Selection.Count Step 1
        strHolder = strHolder & vbCrLf & ",'" & Selection(intNum).Value & "'"
    Next
    
    'データオブジェクトに文字列をセット
    dataObject.SetText strHolder
　　'データオブジェクトにセットされた値をクリップボードへ格納
    dataObject.PutInClipboard
    
End Sub
```
#### dataObjectを扱うためには参照設定が必要
エディタの上部から、ツール＞参照設定から「Microsoft Forms 2.0 Object Library」を選択します。見つからなければ参照設定＞参照から「C:\Windows\System32\FM20.DLL」を選択します。

### クリップボード周りを触れるdataObject
今回はSetText,PutInClipboardを利用しましたが、他にも

- GetFormat（クリップボード内のデータ形式を判別する時に）
- GetText,GetFromClipboard（今回とは逆にクリップボード内からデータを取得する時に）
- StartDrag（マウスのドラッグ操作を行いたい時に）
- Clear（クリップボードを空にしたい時に）

というメソッドがあります。
ただ、調査時にちらと見かけたのはSetTextすると文字化けするというものです…
[リンク(外部サイト)](https://teratail.com/questions/190985)
私は遭遇したことはありませんが、注意は必要かもしれません。

#あとがき
簡単に実装できるにしては結構役立ってます。業務作業によって形は変わると思いますが、Excelのデータを定型的に成形する場合に活用できると思います。
周りにもシェアして割と使ってもらえているようなので作った甲斐はあったのかなと思っています。
上記リンクを参考にもう少し知識深めながら弄っていこうかなと思っています。
もっと便利で合理的でシンプルなプロセスがあればご教示いただきたく存じます。
以上、宜しくお願い致します。
HoudiniでPointCacheを作成・エクスポートしてUnityのVFXgraphに読み込んで使うフローの基礎解説

# HoudiniでPointCacheを作成・エクスポートしてUnityのVFXgraphに読み込んで使うフローの基礎解説

この記事はHoudiniアドベントカレンダー2019　19日目の記事です。

よろしくお願いします。
表題の通りHoudiniでPointCacheを作成・エクスポートしてUnityのVFXgraphに読み込んで使うフローの基礎解説を行いたいと思います。

VFXgraphとはなんぞや？という方はまずはこちらをご覧下さい↓
[Unity公式サイトのVFXgraph紹介ページ](https://unity.com/ja/visual-effect-graph)
![vfxgraph_01.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/539096/19508f13-be73-fb40-e412-2acdb97f163c.png)
※上記の画像はUnity公式サイトのVFXgraphの紹介ページの画像です。


端的に申し上げますとVFXgraph(正式名称VisualEffectGraph)とはリアルタイムで使えるGPUパーティクルです。Houdiniと色々と連携すると簡単に面白いことがアレコレできたりするのですが、VFXgraph自体が新しいツールで如何せん資料がまだまだ少ない分野ですので、今回はHoudiniでポイントキャッシュを作成してVFXgraphで利用する方法を動画チュートリアルとして紹介したいと思います。

---
##解説動画

Qiitaではyoutubeのインライン再生ができず、リンクを張るだけでは動画内容を確認し辛いと思いますので記事上にも動画内の画像を何点か添付致します。また、記事上でも捕捉解説として動画内容の補完を行っていきたいと思います。
https://www.youtube.com/watch?v=TNmJYMDM_yE&feature=youtu.be
![vfx04_02_cc_rend.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/539096/dc1825ed-b7aa-afe9-b142-cc6861ae2fdc.png)

![HoudiniAdvent_still_02 (0-00-00-00).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/539096/a588793b-dc52-beb0-92ee-e3368757ff22.png)

![HoudiniAdvent_works_01_rend (0-00-31-25).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/539096/2afb22cc-8ff1-d897-a6f3-bc19f56e21dd.png)

![HoudiniAdvent_still_01 (0-00-00-00).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/539096/487320f9-a0fa-762c-3244-a1e93ee0d211.png)

---

###補足解説

####・Install HDA
使用しているHDAのリンクはこちらです。
https://github.com/Unity-Technologies/VFXToolbox

Houdini17.5及びHoudini18で動作確認済です。

####・Create Pointcache・Create Vectorfield
今回使用しているHDAでポイントキャッシュとベクターフィールドを作る分にはHoudiniCoreライセンスでも大丈夫です。ですのでHoudini導入を考えている企業様or導入を促進させたい立場にいる方の交渉材料としても「Coreで使える」というのは良い点だと思います。

ほぼどんな形状からでもポイントキャッシュやベクターフィールドを生成できて、更にその中のPointやNormal、Velocityを自由に調整して書き出せるというのは他のツールと比較してもHoudiniにアドバンテージのある部分かと存じます。

####・Basic Settings for Unity
この項目は省略しても良かったのですが、UnityHDRPでのLookDevの動画資料はVFXgraph同様に現状ほぼ存在しないので、後学のために一応参考までに入れてあります。

使用しているHDRIはHDRIhavenというサイトのものを使用しています。
https://hdrihaven.com/
####・Explanation of VFXgraph
体感ですが、VFXgraphの横長のコンテキストとブロック、その左右にノードやイベントを繋いでいくビジュアルはHoudiniやthinkingParticlesというよりは3dsmaxのParticleFlowに近いように感じます。「ParticleFlowを使うような感覚」という考え方は、個人的にはVFXgrpahを扱う上で結構腹落ちする考え方でした。
####・Use Pointcache
動画内にも記載していますが、NormalやVelocityは共にvector3として認識されるようで相互に利用可能で便利です。VFXgraphネイティブで初期位置や初期方向・初期速度をプロダクションワーククオリティのエフェクトにしようとすると現状結構大変なのですが、必要な情報をポイントキャッシュに格納しておくことで簡単にそれらの情報を扱え、ノード数も抑えられて取り回し易さも向上します。VFXgraphでのポイントキャッシュ利用はPointの情報を自在に操るというHoudiniの得意とする分野を活かしたフローだと思います。
####・Application of VFXgraph
使用しているポイントキャッシュとベクターフィールドは今回の動画で作成したものと同じものを使用しています。これ位のクオリティで自在に形状を調整できるものがリアルタイムの60fpsで容易に動いている（画像として書き出す場合も１コマが一瞬で終わる）のは中々魅力的なのではないかと思います。

作例では3Dノイズと他の値を組み合わせるという手法を使っていますが、この手法もHoudiniや他のツールでもよく使う手法です。複数のツールでよく使う同じ手法と言うのは汎用性や信頼性がそこそこあるものだと個人的には考えています。

###おわりに

HoudiniとVFXgraphの親和性は高く、双方の連携は使っていて楽しいですし技術的な可能性も感じるのですが、如何せん資料が少なく入門のハードルが少し高めなのが現状だと思います。
ですので今回は双方を使用した簡単なtipsをご紹介させて頂きました。
如何だったでしょうか？　少しでも皆様のHoudiniの勉強のお役に立てたのなら幸いです。

最後までお目通し頂きありがとうございました。
Jatpack Composeについて

元々はネイティブアプリのエンジニアでiOS/Androidアプリを作ってたんですが、今は本業ではサーバーサイドエンジニアをしていてGo言語とかでAPI作ってます。

ただ、個人でアプリを作ったりはしてるので最近流行りのJetpack Compseをまとめてみようと思います。

## Jetpack Composeとは？
Jetpack Composeは2019年のGoogle I/OのDeveloper Keynoteで発表された技術で、FlutterやiOSのSwift UIのように宣言的にアプリのUIを構築できるツールキットです。

最近、FluterとかSwiftUIとかもそうですがViewをコード化するのが流行っているらしい。

## サンプルを動かしてみる
### Android Studio 4.0 Previewをダウンロードする。
まずはAndroidStudioのPreview版である4.0をインストールしてください。
本家のサイトから簡単にダウンロードできます。ここで余談ですが、AS4.0の起動画面カッコイイですね。

<img width="686" alt="スクリーンショット 2019-12-18 16.40.01.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/126555/d5910eac-15eb-c382-ce0f-35dbc3dde423.png">


### Jetpack Composeのサンプルを選択
何やら見慣れないEmpty Compose Activityをサンプルから選べるので選択してプロジェクトを起動する。

![スクリーンショット 2019-12-19 0.03.45.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/126555/114da1da-25f7-5def-b1d0-120e4bab2f71.png)


### ざっとコードを見てみる
今回のサンプルコードはただのHello Androidと画面に表示するだけのサンプルアプリです。
これまでのAndroid開発だとlayoutをxmlで作成しておりますが、Jetpack ComposeだとActivityにレイアウトの構成をコードで持っており一つのファイルで管理できるのは良いと思うしViewの共通化も楽そう。

```MainActivity.kt
package com.example.myapplication

import android.os.Bundle
import androidx.appcompat.app.AppCompatActivity
import androidx.compose.Composable
import androidx.ui.core.Text
import androidx.ui.core.setContent
import androidx.ui.material.MaterialTheme
import androidx.ui.tooling.preview.Preview

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            MaterialTheme {
                Greeting("Android")
            }
        }
    }
}

@Composable
fun Greeting(name: String) {
    Text(text = "Hello $name!")
}

@Preview
@Composable
fun DefaultPreview() {
    MaterialTheme {
        Greeting("Android")
    }
}
```

## ちょっとだけ使ってみたまとめ
Androidのオーソドックスなアーキテクチャの構成だとMVVMが主流だと思いますが、layoutファイルとViewModelのデータバインディングあたりが大きく影響を受けそう。
同一IPだけど中身が変わっちゃった相手にVSCodeからSSHを飛ばす

# はじめに
この記事の内容は，

+ **Raspberry Pi** に **VSCode** から **SSH** でつないで作業してた．
+ 何らかの事情によりRaspbian等 **OSをインストールし直した**．

という環境下で起こると考えられます(というか，私はこれやったときにこうなって辛かった)．
では，どうぞ．

# え，SSH 飛ばないんだけど....
はじめに の通り，諸事情でRaspbian を再インストールしました．
で，再インストール前はVSCode(Remote-SSH)を使って作業してたので，同様にして "pi@192.168.xx.x"とかを打って接続させようとしたんですよ．
そしたらVSCodeくんが言うわけです．
*「VSCode ssh The process tried to write to a nonexistene pipe」* って

# 原因は何？
エラー文を読む限り，「なんかしらんけど使えん設定でsshしようとしてるで」って言わてるっぽい気がする．
ということで，VSCodeくんがsshのログ(というか過去の接続履歴的な？)を残す場所があるんじゃないかと予想して探索．

するとあるではありませんか．
*"C:\\Users\\username\\.ssh"* とかいうフォルダが！

で，この中にある *known_hosts* の記述から "192.168.xx.x" の
行を探してその行を削除するだけ．
これで次回接続時にちゃんと接続情報(？)を取得し直してくれます．

# まとめ
つまるところsshの接続履歴を消せば良かったってことです．
私の例ではこれでうまく行ったので，他の人の参考になれば幸いです．

p.s. エラー文で探しても全然ページに当たらなくて悲しかったので記事にしました．初歩的なことかもしれないけどね！
アセンブリで挿入ソート

# はじめに
本当は文字列の復元に関する記事を書こうと思ったのだが、精度が9割をどうしても超えないので、今回は11月ちょっと勉強していたアセンブリ言語の備忘録を書くことにする。

# アセンブリ言語とは
低水準言語の一つ。コンピュータを動作させるための機械語を人間にもわかりやすくした言語のこと。高水準言語と比べると読みづらい上に、高水準言語だと一行でおわるものがアセンブリ言語だと何行も書かないといけなかったりする。

# プログラムを作ってみよう
### 動作環境
今回書いたプログラムは「KUE-CHIP2」と呼ばれる教育用マイクロコンピュータ上で動作するように作ったものから余計な部分を抜いたものとなっている。しかし、KUE-CHIP2を持っている人も少ないと思うので、公開されているWeb上で動作するアセンブラを載せておく。

[KEMU_Emulator]
(http://kemuide.openwaseda.net)

### プログラムの概要
KUE-CHIP2では000番地〜0FF番地がプログラム領域に、100番地〜1FF番地がデータ領域となっている。今回は100番地〜109番地のメモリに格納されている数値を昇順に挿入ソートするプログラムを作る。

### 実際のプログラム

#### 超簡単な用語解説
**ACC**:アキュムレータ。演算に利用され、演算対象のデータや演算結果を保持する。

**IX**:インデックスレジスタ。レジスタを利用したアドレス指定を行う際に、アドレス修飾に用いられる。また、演算対象のデータや演算結果も保持できる。個人的にはfor文に用いられるiやjのようなイメージ。

**LD**:番地が指定されている場合は番地に格納されている値を、即値の場合はその値を読み込む。

**ST**:指定した番地に値を格納する。

**CMP**:比較の命令。実際にやる処理は現在読み込んでいる値から指定した値を引くこと。結果を保持せずフラグを立てることでその後の条件分岐を行えるようにする。

**BLE・BZP・BLT**:条件分岐の命令。左から以下、以上、未満の意味。

**ADD・SUB**:英語のまま、加算減算。

**HLT**:割り込み待ち。つまり停止命令。

**END**:文字通り終わり。

数字単体は即値を、数字に()がついているものはデータ領域の絶対アドレスを示している。
ループ命令は条件分岐命令の結果がtrueなら書かれている場所に飛ぶ。

#### プログラム
            LD         IX,00H			
    LP1:    ST         IX,(90H)			
    LP2:    LD         ACC,(IX + 00H)		
            CMP        ACC,(IX + 01H)		
            BLE        SKIP			
            ST         ACC,(91H)			
            LD         ACC,(IX + 01H)		
            ST         ACC,(IX + 00H)		
            LD         ACC,(91H)			
            ST         ACC,(IX + 01H)		
            SUB        IX,01H			
            BZP        LP2			
            LD         IX,(90H)			
    SKIP:   ADD        IX,01H			
            CMP        IX,09H			
            BLT        LP1		
            HLT
            END
二重ループさせるために一度IXの値を別の場所に保管しなければいけないのが面倒。

#### 実行結果
以下のようにデータ領域に適当に値を放り込んでみる。
<img width="811" alt="スクリーンショット 2019-12-19 0.05.40.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/546781/5ffab7de-1c3a-99c3-ea3b-cdedba91e63a.png">
プログラムを実行。
<img width="907" alt="スクリーンショット 2019-12-19 0.06.45.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/546781/815e0c41-eb34-035f-3305-91a35340c8d6.png">
ユーザーメモリやプログラムメモリの場所を見ているとどのようにソートされているか自分の目で確かめられてとても楽しい。
ソートの結果がこちら。
<img width="887" alt="スクリーンショット 2019-12-19 0.16.18.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/546781/e74092fb-afb6-2fc7-c130-1e1228a900e2.png">
うまくいって何より。

---
アセンブリ言語を使って言語を書くのは面倒ではあるけれど、機械がどのように普段プログラムを読んでいるのかを知れて実際にプログラムを書くときの無駄が省けたりする。
なんとなく機械のことが知れて仲良くなった気分になれるので是非アセンブリ言語を触ってみて欲しい。