みなさん日報書いてますか。
私が所属する Misoca でも、全員が毎日日報を書いています。ただ、メンバーが増えてくると、全員の日報を読むことが地味に大変だったりします。
日報を「聴く」
しかし読みたい。
もし、音楽のように日報を聴くことができたら、聴きながら作業もできるし読む辛さもなくなるかも。というわけで、勉強がてらアプリを作ってみたので紹介します。
Nippou Player for esa.io
特徴
GitHub - hidakatsuya/nippou-player: A client for playing NIPPOU in esa.io.
- esa.io の日報を音声として再生することができるデスクトップアプリ
- Mac, Windows, Linux をサポート（ただし、Mac 以外は動作確認してない）
- Electron, Vue.js 2.x, Photon, Webpack, axios, karma, mocha などでできている
- 音声の再生は Web Speech API を使っている
必要なもの
Nippou Player は esa.io 上の日報を再生するアプリなので esa.io のアカウントが必要です。
使い方
Releases at Github より、パッケージをダウンロードできます。起動すると、
こんな感じの設定画面が表示されるので、それぞれ以下のように設定します。
Access token for esa API
Nippou Player は esa API を使って日報を取得するので、そのアクセストークンの設定が必要です。アクセストークンの発行方法は以下を参考にしてください。
https://docs.esa.io/posts/102#3-0-0
日報一覧のパス
esa 上の一日分の日報一覧のパスを設定します。
日報/2017/03/03/
├ hidakatsuya の日報
├ hoge の日報
:
例えば、日報をこのようなカテゴリで管理している場合は esa の 検索クエリの書式 を使って以下のように設定します。
in:日報/YYYY/MM/DD
YYYY や MM は日付書式キーワードで、日報一覧を取得する際に日付に展開されます。「2017/3/3」の日報を取得するときは、
in:日報/2017/03/03
となる具合です。
この展開は Moment.js の moment#format() によって行なっています。使えるキーワードは以下を参考にしてください。
以上で設定は完了です。メイン画面に戻ると日報一覧が表示されるはずなので、再生ボタンを押せばしゃべり出すはずです。
バグを踏んだりわからないことがあったら
ソースコードは GitHub に公開しています。Pull request お待ちしております。または @hidakatsuya に質問してもらっても構いません。
作ってみて
感想
- 今回初めて Electron アプリを作ったけど、別の OSS (thinreports-editor) でも Chrome Apps から Electron へ移行しようとしているので良い練習になった
- 日報の内容をほぼそのまま Web Speech API に食わせているので、スピーチがわりと微妙
- Vue.js の Single File Component が非常にわかりやすくて良い。次は Vuex を使って書き換えていきたいと思ってる
- vue-cli で electron-vue というテンプレートを使うと、babel とか webpack 周りが設定済みで、すぐにアプリ本体の開発に集中できて良い。ちょっと設定いじろうとすると何やってるかわかんなくて辛い部分もあるけど
- UI は Photon が便利だった。が、微妙に足りてないところがある。メンテされていないのも気になるけど簡単で素晴らしい