A story about making a calendar application for practicing the best work technique "time box"
Tags: javascript, mac, vue, electron
Published: 2019-02-24 02:47:43

---
title: A story about making a calendar application for practicing the best work technique "time box"
published: true
description: It was the life I wanted to display "Google Calendar" only current presentation - on the front desktop "
tags: JavaScript,Mac,vue.js,Electron
---

## For those who would like to try

▼ Download here (for mac / dmg format) ▼
<https://s3-ap-northeast-1.amazonaws.com/watari/downloads/darwin/Watari-0.0.7.dmg>

## It was the life I wanted to display "Google Calendar" current presentation only  desktop top

[Make Your Days More Productive By Timeboxing] (https://lifehacker.com/make-your-days-more-productive-by-timeboxing-1832508849) has been published recently.

It is a story that the one who puts the schedule directly in the calendar surely will do it better than the enlarged Todo list which can not be digested, you can choose it well.

I was doing such a time box like management, but I faced the problem of **"I can not check the current schedule unless I open a toy calendar"**.

there
- **If you schedule Google Calendar's current schedule on the desktop the best, are not you?**
- **It would be nice if you could also write a countdown of the remaining time and a memo of the calendar?**
- **Would it be nice if you could recommend the URL for each event?**

Watari is an app for mac made with the thought circuit called.

## Demo
<blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr">[To the buddies of the &quot;time box&quot; chosen as the best work skill]<br>~ Managing Todo with Google Calendar, For those who are concerned about productivity ~<br><br>▼ Download here (Mac / dmg file) ▼<a href="https://t.co/XL5hnpd0uj">https://t.co/XL5hnpd0uj</a> <a href="https://t.co/QkVgobQdkK">pic.twitter.com/QkVgobQdkK</a></p>&mdash; Tsuyoshi.Nagamine (@nagaminenot_eng) <a href="https://twitter.com/nagaminenot_eng/status/1099508587104108544?ref_src=twsrc%5Etfw">February 24, 2019</a></blockquote>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

## Technical story
- Use [electron-vue] (https://github.com/SimulatedGREG/electron-vue) as the base
- Search the Google Calendar API using the current appointment name, look for URLs you saw in the same time in the past time,
- Search the URL by looking up Chrome's history (which can be read with sqlite 3) by putting sqlite 3 in the application (Do not worry because Chrome history is not collected by the server, of course.) Between the user's PC and the Google Calendar API It is a recommendation completed with.

### Technically tedious
- Building sqlite 3 makes it hard to build. And I can not build on Windows. Resolved by referring to <https://stackoverflow.com/questions/32504307/how-to-use-sqlite3-module-with-electron>.
- The implementation of the autostart function was a bit tough. If you do not have permission, you have to `catch`` error` instead of `false` with` AutoLaunch.isEnabled () `. It is much better than sqlite 3.

Personally it is handy and I use it every day at work but I'm worried whether it will be used by people who are planning to manage the schedule at other time boxes, so I'd like to try it and give my impression.

▼ Download here (for mac / dmg format) ▼
<https://s3-ap-northeast-1.amazonaws.com/watari/downloads/darwin/Watari-0.0.4.dmg>

▼ Impression · Report a bug here ▼
<https://twitter.com/nagaminenot>

※ This article has been translated by Google translation. Original text is as follows.

---

## とりあえず試してみたい方向け

▼ダウンロードはこちら(mac向け/dmg形式)▼
<https://s3-ap-northeast-1.amazonaws.com/watari/downloads/darwin/Watari-0.0.4.dmg>

## Googleカレンダーの"現在の予定だけ・デスクトップ最前面に"表示したい人生だった

[もっとも生産性を高める仕事術はタイムボックス。 そのやり方とメリットとは？ | ライフハッカー［日本版］](https://www.lifehacker.jp/2019/02/make-your-days-more-productive-by-timeboxing.html) という記事が最近公開されました。

消化できもしない肥大化したTodoリストなんかより、カレンダーに直接予定をぶち込んだ方が確実にこなすよね、うまく取捨選択できるよね、という話です。

私もそんなタイムボックス的な管理をしてましたが**「いちいちカレンダーを開かないと現在の予定が確認できない」**という問題に直面しました。

そこで
- **デスクトップで一番手前にGoogleカレンダーの現在の予定出したらよくね？**
- **残り時間のカウントダウンとカレンダーのメモも出せたらよくね？**
- **ついでに予定ごとにURLのレコメンドしてもらえたら嬉しくね？**

という思考回路で作ったmac向けアプリがWatariです。

## デモ
<https://twitter.com/nagaminenot/status/1099265041809825792>

## 技術的なおはなし
- ベースには[electron-vue](https://github.com/SimulatedGREG/electron-vue)を使用
- 現在の予定名を使ってGoogleカレンダーAPIを検索、同じ予定の過去の時間に見ていたURLを探し、レコメンド
- URLの探し方はアプリにsqlite３を内蔵させて、Chromeの履歴（sqlite3で読める）を検索（もちろんChromeの履歴をサーバーで収集はしてないのでご安心ください。ユーザーのPCとGoogleカレンダーAPI間で完結したレコメンドです。）

### 技術的にしんどかったこと
- sqlite3を内蔵しようとすると、ビルドで一苦労する。そしてWindowsでビルドできない。[このへん](https://stackoverflow.com/questions/32504307/how-to-use-sqlite3-module-with-electron)を参考に解決した。
- 自動起動機能の実装が少し大変だった。権限もらえないと `AutoLaunch.isEnabled()` で `false` ではなく `error` を `catch` しないといけなかったり。sqlite3よりはだいぶマシ。

個人的には重宝していて、毎日仕事で使っているのですが他のタイムボックスで予定管理している人に使ってもらえるか気になるので、ぜひ試してみて、感想をいただきたいです。

▼ダウンロードはこちら(mac向け/dmg形式)▼
<https://s3-ap-northeast-1.amazonaws.com/watari/downloads/darwin/Watari-0.0.7.dmg>

▼感想・バグ報告はこちら▼
<https://twitter.com/nagaminenot>

※会社制作ではなく個人制作のアプリです