travisCIでdockerを使ってsshクライアントのテストをする

node.js用のsshライブラリ(のラッパーライブラリ)を開発していて、こちらの方と全く同じ問題にぶつかりました。

kohkimakimoto.hatenablog.com

こちらの記事では、travisCIのテストが動いている環境でsshdを立ててアクセスしていますが、ローカルのテストで使いまわす時のことを考えて、dockerでsshdを立ち上げてそちらへアクセスするようにしてみました。

travisCIのテスト中にdockerを使う方法についてはこちら

docs.travis-ci.com

このドキュメントでは、dockerhubに公開されたイメージをbuildする前提で書かれていますが、Dockerfileをテスト対象コードのリポジトリに含めてそれを使う方針でやります。

まず、次のようなDockerfileを用意します。ここではcentOSのオフィシャルイメージを使っていますが、その辺はお好みで。

FROM centos:centos7
EXPOSE 22

# install sshd package
RUN yum -y install openssh-server initscripts

# generate hostkey
RUN /usr/sbin/sshd-keygen

# add non-root user and set password
RUN adduser testuser && echo "passw0rd" | passwd --stdin testuser
RUN mkdir -p /home/testuser/.ssh && chown testuser:testuser  /home/testuser/.ssh

CMD ["/usr/sbin/sshd", "-D"]

これをリポジトリ内の、testディレクトリに保存します。

続いて、.travis.ymlに次の記述を追加します。

services:
- docker
before_script:
- docker  build -t sshd ./test
- docker run -p 4567:22 -d sshd

docker buildの行で./testと書いているところは、実際にはDockerfileを配置したディレクトリを指定します。あと最後のdocker runの時に-dをつけてバックグラウンドに回すのをお忘れなく。

Amazonタイムセール&専門書フェア

先月からやってたIT語学専門書フェアが、アマゾンタイムセールの期間に食いこんだおかげで、50%off & 最大7.5%ポイント還元とお得になってますね。 まー、もともと50%オフなんてセールなんで、7.5%還元されてもおまけみたいなもんですが。

とはいえ、並み居る語学書の山をかきわけて、この一月ほどサンプルを読み漁ってタイムセールに備えてきたので、せっかくだから私がリストアップした本を並べておこうと思います。

まずは、機械学習関連

やさしく学ぶ 機械学習を理解するための数学のきほん ~アヤノ&ミオと一緒に学ぶ 機械学習の理論と数学、実装まで~

Pythonで動かして学ぶ！ あたらしい機械学習の教科書

Pythonで学ぶあたらしい統計学の教科書 (AI & TECHNOLOGY)

機械学習については、ずいぶん前にこの本を買ってたんですが、気付いたら第2版が出てたので、心を入れ変えて機械学習のお勉強をしようかと思っている私(要はど素人)が、このへんなら読めそうと思って選んだ3冊です。大外れだったらごめんなさいorz

Python機械学習プログラミング 達人データサイエンティストによる理論と実践 (impress top gear)

アルゴリズム関連では、こちらの2冊を買いました。

アルゴリズムの基礎とデータ構造: 数理とCプログラム

グラフ・ネットワークアルゴリズムの基礎: 数理とCプログラム

これまたずいぶん前に買った、こちらの本(kindle版は無し)を2分冊にしたような構成で、これだけ分量も増えてりゃ分かり易いだろうし、最近計算幾何学関連のプログラムを書いてないんで、これでも読んでちょっと復習しようかくらいのノリで買ったものです。

計算幾何学入門―幾何アルゴリズムとその応用

ちなみにこちらのだと本、第一章で計算量理論とリスト、スタック、キュー、ヒープ、二分木、平衡二分探索木(赤黒木とか?)あたりまで扱ってるんですが、情報系の学生さんってこんなペースで授業受けてるんでしょうか・・・ あと、この本の著者が翻訳に参加されている、こちらの本も良さそうですね。網羅的すぎてたぶん読んでて迷子になるだろうと思ってパスしましたが。

アルゴリズムイントロダクション 第3版 総合版：世界標準MIT教科書

アーキテクチャ関連では、定番のパタヘネ本と安藤先生のマイナビの連載をまとめた本がセール対象(ヘネパタ本は今回は入ってないっぽい)のようです。

コンピュータの構成と設計 第5版 上・下電子合本版

コンピュータ設計の基礎

高性能コンピュータ技術の基礎

私はこの辺は一通り読んでるのでスルーして、Amazonさんからお勧めされた、こちらの本を買ってみました。

低レベルプログラミング

低レベルというタイトルですが、system programming寄りの話のようなのでHPC屋的には物足りなさそうですが、Intelアーキテクチャで解説してる上に日本語訳されているというのも珍しいのでちょっと読んでみようかと思ってます。

モバイルモニタ導入

最近、モバイル環境を強化中なんですが、まずは手軽にできるところからということで、サブディスプレイを導入しました。

この手の用途では定番のGeChic on-Lapシリーズだと13インチモデルは約4万円。

Gechic モバイルモニター On-Lap 1303I 13.3インチ/10点マルチタッチ対応/IPSパネル/1,920×1,080/保護カバー&スタンド付

ところが、こちらのcocoparなる会社(?)の製品だと約半額の2万円程度。しかも、HDMI2系統な上にVESAマウント対応の穴があるということで、こっちを買ってみました。

cocopar® モバイルモニタ 13.3インチフルHDIPS HDR機能を支持IPSゲーミングモニター ゲーム/HDMI/PS3/XBOX/PS4モニター1080PダブルHDMI　超薄8mm Raspberry Pi用対応できる スピーカ内蔵 PCモニター

以前のモデルでは、amazonのレビューに「穴は空いてるけどネジが切られていない」とか書かれてましたが、改善されていたようです。*1 とりあえず、こんな感じでM4の長ネジを差し込んで超簡易スタンドのできあがり。

肝心のディスプレイの性能ですが、とりあえず仕事中にサブモニタとして使ったり、Fire stick TVを挿してPrimeビデオで動画を見る程度なら特に問題は無さそうです。 背面の操作ボタンのところの加工精度が甘いのか、ちょっと振るとボタンが筐体と当たって音がしたり、ボタンによって出っ張り具合が違っていたりと、かなりチープな感じはしますが、そんなことより値段が安い方が良いという方には、お勧めできる製品です。

あ、あと筐体の塗装がヤワなので、付属のスタンドと一緒に持ち運んでたら、背面にざっくりと傷がつきました・・・orz 多少傷がついたところで、動作に支障は無いので私は気にしませんが、気になる方はケースも付属しているGeChicの方が良いかもしれません。

*1:しかし旧モデルも併売してるっぽいので要注意

vue-cliでwebアプリ作成

ちょっとしたwebアプリをスクラッチで作る機会があって、vue-cliを使ってみようと思ったんですが、先人の解説記事どおりにやっていると

vue init webpack new-project

  Unknown command init.


   vue-cli · Failed to download repo vuejs-templates/[object Object]: Response code 404 (Not Found)

といった感じで怒られます。

公式webページを見ると

npm install -g @vue/cli
# or
yarn global add @vue/cli

vue create my-project

と書かれてて、そもそもパッケージ名からして違う・・・

とりあえず、initが無いって言ってるから、公式推奨のcreateをしてみると

vue create new-project

  Unknown command create.
  vue create is a Vue CLI 3 only command and you are using Vue CLI 2.x.

どうやら、メジャーバージョンが上がって色々変わってるようです。

というわけで、長い前置きでしたがvue-cli 3系列をちょろっと触ってみたメモです。

インストール

ドキュメントにある、

Zero config rapid prototyping via @vue/cli + @vue/cli-service-global.

というのを試してみたいので、このふたつをインストールします。

> npm install -g @vue/cli @vue/cli-service-global

新規プロジェクト作成

vue create new-projectとするとcursesっぽいテキストベースのメニューが現れて色々選択できます。

が、今回はこちらは使わずに、vue serveコマンドの方を使っていきます。 ドキュメントにあるように、とりあえず適当なvueファイルをApp.vueという名前で作成してコマンドをたたくとビルドしてからサーバを起動してくれます。

> echo '<template><h1>Hello!</h1></template>' > App.vue
> vue serve -o
 DONE  Compiled successfully in 1164ms                                                                                                                                                            21:56:50

 
  App running at:
  - Local:   http://localhost:8080/ 
  - Network: http://192.168.0.31:8080/

  Note that the development build is not optimized.
  To create a production build, run npm run build.

vueファイルの名前をApp.vue(またはapp.vue)以外にする場合は、この後に続けてファイル名を指定します。 また、-oオプションは、ビルド後にブラウザを開いて表示するという指定なので、不要であれば外してください。

あとは、ゴリゴリとApp.vueファイルを更新すればとりあえず動くものはできるはずです。

this is only recommended for rapid prototyping.

とのことなので、ある程度のものができたら createでプロジェクトを作ってそっちに移行する方が良さそうですが。

docker環境構築 on Mac

travisCIでdockerを使えばubuntu以外の色々なOSでテストができるらしいということを知って、試行錯誤していたんですが try and errorで.travis.ymlを書き変えてはgithubにpushしてtraviCIに「ちゃうでー」と怒られるのを繰り返すのが辛くなってきたので 手元のmacにdockerの環境を作ってみました。

必要なのはこれだけ

> brew cask install docker
> open /Applications/Docker.app

アプリが立ち上がって、パスワードを聞かれるので正直に答えるとdockerが使えます。

> docker --version
Docker version 18.03.1-ce, build 9ee9f40
> docker run hello-world

Hello from Docker!
This message shows that your installation appears to be working correctly.

To generate this message, Docker took the following steps:
 1. The Docker client contacted the Docker daemon.
 2. The Docker daemon pulled the "hello-world" image from the Docker Hub.
    (amd64)
 3. The Docker daemon created a new container from that image which runs the
    executable that produces the output you are currently reading.
 4. The Docker daemon streamed that output to the Docker client, which sent it
    to your terminal.

To try something more ambitious, you can run an Ubuntu container with:
 $ docker run -it ubuntu bash

Share images, automate workflows, and more with a free Docker ID:
 https://hub.docker.com/

For more examples and ideas, visit:
 https://docs.docker.com/engine/userguide/

> docker run -it ubuntu bash
# uname -a
Linux 562794c23cf8 4.9.87-linuxkit-aufs #1 SMP Wed Mar 14 15:12:16 UTC 2018 x86_64 x86_64 x86_64 GNU/Linux
>docker rm `docker ps -a -q`
562794c23cf8
df64e1d5290b
9da30ff61d16
384cdda9dd3a

vagrantでvirtual boxを立ち上げるのに比べると、格段に早いですねー

まーchroot環境(微妙に違うか)だから、障害対応とかはvagrant + virtual boxで再現環境を作らんとだめだろうけど、普段の開発はこっちでも良いような気がしてきた。

あとはdocker環境でテストが動くように書き換えてから、.travis.ymlに再挑戦か・・・

git stash popで発生したコンフリクトを解消する。

さきに参考URL

dackdive.hateblo.jp d.hatena.ne.jp

こんな流れで作業していてはまりました。

あるファイルを編集中に障害の調査をしなきゃならん事態が発生
↓
編集中のファイルをstashして同じブランチで障害の調査を開始*1
↓
デバッグコードを埋め込んだり、ついでに見つかったバグを修正したりでstashした時に修正中のファイル以外を修正
↓
さて、編集したファイルは被ってないからstash popするべー*2
↓
あら、コンフリクトしてますな・・・

という状況です。

"foo" "bar" "baz"の3ファイルがリポジトリにあったとすると fooとbarは手元のファイルを残して"baz"だけstashしてたものをとり込むという操作をやりたいのです。

こんな時はこんな感じで、必要なファイルだけをstashからcheckoutして上書きできます。

> git checkout --theirs stash@{0} baz

この後、bazはgit stashした時のファイルに戻って、さらにgit addされた状態になってます。 stashの方も残ったままなので、不要であれば

> git stash drop

して消しておきましょう。

stashしたものだからpop時のオプションでなんとかなるだろうと思って調べてたんですが、どうやらそういうわけではないようです。 しかし、スタックに積んでおいて全部出さずにちょっとだけ持っていくとかお行儀悪いなwww*3

*1:これがそもそもの間違い。一旦ブランチを切って保存した上で元のブランチから調査用のブランチを切るべき・・・なんだけど作業を始める時の精神状態だと全部破棄してstash popで戻ってくりゃおっけーって思うんですよねorz

*2:一時的に修正中のファイルをリネームしてgit checkoutしたような感覚でいたけど、stashはあくまでworking directory全体を保存してるので別のファイルを弄ったらそりゃーコンフリクトしますね・・・

*3:いや、最終的にはdropしてるけど・・・

mermeidのサポート状況

今までgitlabのこと微妙なやつだと思ってたんですが、markdownでmermaidをサポートしてたんですね!!

docs.gitlab.com

普段使っているbitbucket & githubでどうなるかというと、こんな感じでただのコードブロックとして表示されます。*1

bitbucketの場合

githubの場合

ところがgit labだとこんな感じでグラフとして表示されます。

ちなみに、はてなだと

graph

graph TD
    A-->B;
    A-->C;
    B-->D;
    C-->D;

sequence diagram

sequenceDiagram
    participant Alice
    participant Bob
    Alice->John: Hello John, how are you?
    loop Healthcheck
        John->John: Fight against hypochondria
    end
    Note right of John: Rational thoughts <br/>prevail...
    John-->Alice: Great!
    John->Bob: How about you?
    Bob-->John: Jolly good!

gantt chart

gantt
        dateFormat  YYYY-MM-DD
        title Adding GANTT diagram functionality to mermaid
        section A section
        Completed task            :done,    des1, 2014-01-06,2014-01-08
        Active task               :active,  des2, 2014-01-09, 3d
        Future task               :         des3, after des2, 5d
        Future task2               :         des4, after des3, 5d
        section Critical tasks
        Completed task in the critical line :crit, done, 2014-01-06,24h
        Implement parser and jison          :crit, done, after des1, 2d
        Create tests for parser             :crit, active, 3d
        Future task in critical line        :crit, 5d
        Create tests for renderer           :2d
        Add to mermaid                      :1d

やっぱ駄目かー

今だと簡単な図を作るのにも、画像として挿入する必要があるので、本文は更新されてるのに図だけ古いままなんて状況になることが多くて困ってるので、ぜひgithubやbitbucketにも追従してもらいたいところです。 ついでに、はてなの脚注機能(はてな記法と同じく二重括弧でくくると中の分が脚注として表示される機能)も便利なので、他のサイトでもサポートしてくれると有り難いなー*2

*1:各グラフはmermaidの公式ページにあるサンプルです

*2:Quiitaの脚注が使い難いのでアカウントは作ったけど、ついついはてなに書いちゃうんですよね・・・