tshohe's memo

おぼえたことをかく

iPhoneのヘルスケアのデータをKibanaで見てみる

ウェアラブルバイスを使っているとiPhoneのヘルスケアにいろいろな情報が蓄積されていくので、それらのデータをエクスポートして可視化してみます。

勿論各デバイスごとの可視化ツールやヘルスケア自身のグラフがあるので、普通に波形が見たいだけであればそれで十分かと思いますが、Aggregationやらなんやらをやりたい場合はElasticsearchに投入してKibanaで見るほうがいろいろと便利かなーと思います。

続きを読む

GCP MarketplaceでGitLabをGKEにデプロイ

7/18のアップデートでMarketplaceから様々なコンテナアプリケーションをGKEにもデプロイできるようになったらしいので試してみます。
GKEの画面の左のパネルからMarketplaceを選択することでKubernetesアプリ選択画面を開くことができます。

f:id:tshohe:20180723234459p:plain

デプロイできるアプリケーションのラインナップはこんな感じ。

  • Aerospike Enterprise Edition
    • flash-optimized, in-memory KVS
  • Aqua Security
    • cloud native container platform
  • Cassandra
  • CloudBees Core
    • CI/CD Automation Engine
  • Couchbase Autonomous
    • Couchbase management
  • CyberArk Conjur Open Source
    • Enterprise class secrets management system
  • Datastax
    • Cassandra based database
  • DivvyCloud Enterprise
    • guard rails for cloud infrastructure
  • Elastic GKE Logging
  • Elasticsearch
  • Elastifile
    • k8s volume provider
  • GitLab
  • Grafana
  • InfluxDB
  • Jenkins
  • Kasten K10
    • Data management platform for stateful application on k8s
  • Memcached
  • neo4j
  • nginx
  • Prometheus & Grafana
  • RabbitMQ
  • Seldon Core
  • Spark Operator
  • Wordpress

ぱっと見興味を惹かれたのはKasten, Elastifile, Seldonとかですが、GitLab meetupが明日開催されるということもあり今回はGitLab環境を用意してみます。

続きを読む

自宅でKibanaを最大限に活用してみる #1

自宅でのElastic Stack活用事例その1

ルータのsyslog可視化

我が家のBaffalo製ルータ(WSR-2533DHP)にはsyslogを他ホストに転送する機能があります。

f:id:tshohe:20180719231933p:plain

syslogをLogstash/Fluentd/rsyslogd等で集約しElasticsearchに投入することで、様々な情報を可視化可能です。ログに知らないMacアドレスがあったらアラート上げるようにしてみても面白そう。(基本的にはMacアドレスフィルタリングしてると思うので意味は薄いですが)

f:id:tshohe:20180719232152p:plain

NetFlow/sFlowが出力できるルータ(Ciscoとか)だと下記でネットワークトラフィックも可視化できます。まあ管理画面にダッシュボードとかありそうですが。

Logstash (logstash-input-udp + logstash-codec-netflow) www.elastic.co

Fluentd github.com

TeamGantt + Trello 連携を試してみる

最近何かの記事で見たガントチャート作成ツール「TeamGantt」の使用感をチェック。

https://www.teamgantt.com/

1 Project 3人までであればFreeで利用できるみたいです。

今回試してみたかったのがTrelloとの連携機能。Trelloのカードをガントチャートに追加したり、日付や完了率等を同期してくれるみたいです。

http://info.trello.com/power-ups/teamgantt

連携手順

Trello側のボードメニューからPower-Upを選択します。

f:id:tshohe:20180703214056p:plain

TeamGanttを検索し選択

f:id:tshohe:20180703214149p:plain

歯車アイコン > 「Power-Upの設定を編集」から、TeamGanttの認証情報を入力しアカウントをリンクします。

f:id:tshohe:20180703214231p:plain

あとはプロジェクトを選択して紐づけ完了です。

f:id:tshohe:20180703214311p:plain

これでTrello側でカードを作成したタイミングで、TeamGanttにもタスクが作成されるようになりました。
あとはTrelloの右上の「View in TeamGantt」を押すとボード上にガントチャートを表示することができます。

f:id:tshohe:20180703214358p:plain

f:id:tshohe:20180703214446p:plain

まとめ

  • Pros
  • Cons
    • 人は紐付いていないので、アサインはどちらかで管理する必要がありそう。(タイマー機能やレポート機能を使うのであればTeamGanttが良さそう)

まだまだ色々機能がありそうなので、暇な時に試して遊ぼう...。

react-modalのスタイルで少し詰まった話

不慣れなフロントエンドについての勉強。(業務で使うこともない...)

今勉強用に作っているアプリのスマホ対応が適当だったのでちゃんとしてみることに。

このアプリではモーダルのコンポーネントとして react-modal を利用していて、 これまでは下記のようにjsxファイル側で定義していたんですが、これだとデバイスごとに設定変えたりとかがやりにくいので、CSSで定義するように。

これまでの定義

import Modal from 'react-modal';

const customStyles = {
  content: {
    top: '50%',
    left: '50%',
    right: 'auto',
    bottom: 'auto',
...

上記をコメントアウトしてReactModal__Contentクラスに対してスタイルを定義します。

.ReactModal__Content {
        width: 90%;
        top: 50%;
        left: 50%;
        right: auto;
        bottom: auto;
}

これでできるかと思ったら、customStylesをコメントアウトしたときにモーダルのstyle属性に各種ポジション情報が0pxで定義されていました。そのため、モーダルが画面の左上に寄ってしまっていました。 (defaultStyleがそうなっている模様)

https://github.com/reactjs/react-modal/blob/master/src/components/Modal.js#L84

style="position: fixed; top: 0px; left: 0px; right: 0px; bottom: 0px; background-color: rgba(255, 255, 255, 0.75);"

そこで、top, left, right, bottomは結局customStyles側で定義することに。
今回はデバイスごとに変更したいのがwidthだけだったので良かったけど、topとかいじりたくなったら面倒そうだな...。