📰 Topics

TypeScript x Nuxt x Vuetifyで作成されたTogowlの依存関係を一斉アップデートしました。

Table of Contents

インプット

Python3.9

まだベータですが新機能の説明がされていました。

気になる新機能は以下3つです。

Dictionary Unions

| でdictionaryのマージができます。
|=で上書きです。

>>> { "a": 1 } | {"a": 10, "b": 2 }
{ "a": 10, "b": 2 }

同じキーが存在する場合はMergeではなく、後の値で上書きされます。

Type Hints

従来 ジェネリクスが必要な型 List[T] Dict[K, V] などは typing で提供されていましたが、built-inで提供されるようになりました。
list[T] や dict[K, V] といった書き方ができます。詳しくはPEP585にて。

String Methods

Stringにprefix/suffixを削除するメソッドが追加されました。

  • removeprefix
  • removesuffix

Pythonを使って関数型プログラミング Part.1 - ログミーTech

かなり本格的な内容です。
Pythonでパターンマッチやモナドまで実現されているのがアツイですね😁

Goのジェネリクスを試せるPlayground

ジェネリクスが使えるならGoに戻ってみようかなという気になってきます。

権限設計

流し読みですが、権限の世界は深いということを改めて実感。

私が好きなのはRBAC(Role-Based Access Control)ですね。

ffmpegでmp4をgifに変換

拡張子をgifにするだけでOKです。

ffmpeg -i input.mp4 output.gif

画質の低下が気になる場合はパレットの設定をしましょう。
ファイルサイズは2倍ほどになりますが、見た目がかなり改善します。

ffmpeg -i input.mp4 -filter_complex "[0:v] split [a][b];[a] palettegen [p];[b][p] paletteuse" output.gif

VueUse

Vue Composition APIを使った便利Utilityです。

Composition APIを使った実装のサンプルコードとしても興味深いです。

Vuetify v2.3 へバージョンアップ

Vuetifyのv2.3系へバージョンアップしました。

v-virtual-scrollが気になるので今度試してみたいです。

v-calendarの変更点

stackとcolumnが適応される条件が変わった気がします..。

  • 変更前
    • event領域の重なり具合を閾値にして適応する
  • 変更後
    • event期間の重なり具合を閾値にして適応する

今まで重なった部分はスライドしてくれたのに、見にくくなってしまった..

カレンダーをそういう用途で使うな..ということかもしれません。

event-overlap-modeにfunctionを指定すれば、可能ではあります。
以下のように (day, dayEvents, timed, reset) => CalendarEventOverlapMode なるfunctionを実装すれば..。

vue-awesome-swiperのメジャーバージョンアップ

Togowlで使っているvue-awesome-swiperをv4にアップグレードしました。

リリースノートのBreaking changeに対する内容は英語、他は日本語のセクションにしています。

Move Swiper dependencie to peerDependencies

SwiperがpeerDependenciesになったので別途インストールが必要になりました。

npm i swiper

Replace Swiper instance name to $swiper

Swiperインスタンスの名前が変わりました。
使用している箇所を以下のように修正する必要があります。

- mySwiper.value.swiper.slideTo(1)
+ mySwiper.value.$swiper.slideTo(1)

Update the component name

コンポーネントの名前が一部変わりました。
ケバブケースを使っている場合は影響ないと思います。

  • swiper => Swiper
  • swiperSlide => SwiperSlide

CSSのimport方法変更

nuxt.config.jsで読み込んでいたCSSをtsファイルでimportするようにしました。
今回のバージョンアップとは関係ないかもしれません..。

uuidのメジャーバージョンアップ

なんでこんなに古かったの!?と思えるくらい上がりました😅

uuid ^3.4.0   →           ^8.1.0

requireの部分が変わるだけなので修正は容易です。

- const uuidv4 = requrie("uuid");
+ const { v4: uuidv4 } = require("uuid");

core-jsバージョンのコンフリクト解消

依存関係をすべて最新化した影響で、nuxtとfirebaseが利用するcore-jsのバージョンがconflictしました。
firebaseは3系、nuxtは2系を使っていることが問題のようです。

以下のページに助けられました🙇‍♂️

nuxtにcore-jsの3系を使わせるという解決方法ですね😄
Issueは上がっているので、そのうち対応される気はしてます。

アウトプット(ドキュメント)

TypeScriptリリースノートおさらい

v2.7のリリースノートが終わりました。

v2.8に着手を始めました。
以前挫折したConditional Typesと正面から向き合います。

アウトプット(OSS)

Togowl v1.11.0~v1.13.0リリース

タスクの外部編集ボタン

スワイプで表示されるメニューに、タスクの外部編集ボタンを追加しました。
タスク管理サービスのタスク編集ページをブラウザで開きます。

カレンダーのマルチレンジ対応

カレンダーのズームを2段階から8段階に増やしました。
ズームレベルによって、レンジが月・週・4日・日と切り替わります。

Todoistのリンク形式に対応

MarkdownだけでなくURL (タイトル)というリンク形式に対応しました。
Todoistではタスク名をURLにすると、タスク名が自動的に上記名称へ変換されます。

この形式で登録されたタスクの見た目は以下のようになります。

Togowlでもこの形式に対応しました。

変化

DailyふりかえりでThinkSpaceを使わない

Dailyふりかえりの内容をThinkSpaceではなくブログに下書きするようにしました。
Weekly Reportの執筆コストを下げるためです。

仕事の成果はThinkSpaceは引き続きThinkSpaceに登録していきます。
1on1で話を広げるときに便利なので😊

その他

最近の出勤時間は12時~21時にしています。
しかし、先週は忙しくて家に帰るのが毎日翌日になっていました..。

その疲れで土曜日の活動開始が午後からになり、日曜日の今日も引きずっています。
朝のルーチンが壊れるだけで、1日の生産性が大きく下がることを痛感しました。

今週は遅くても23時前には家へ帰りたいと思います。目標は22時前です。