nativefierを使ってTweetDeck Web版のアプリ化をやってみた

TweetDeckのMacアプリ版がcloseするとの告知が出ていたので、nativefierを使ってWeb版をアプリ化してみました。

haoyayoi

2022.06.02

この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。

Twitterのタイムラインを用途に分けて見る場合に便利なTweetDeck Mac版のクロージング告知が出ました。

MacでTwitterを見る場合はこれから何で見ればよいのだろうと思いましたが、どうやらブラウザ版もあるということ（知らなかった）。試しにアクセスしてみると、アプリ版とさほど変わらない仕組みです。ただ、他にタブで沢山ページを開いていくと重くなることは避けられません。

何か方法はないものかとチェックした末に、 nativefier　でのChrominumを利用した単体webアプリ版にしてみました。

セットアップ

npm でインストールします。

% npm install nativefier -g

added 249 packages, and audited 250 packages in 5s

43 packages are looking for funding
run `npm fund` for details

2 high severity vulnerabilities

Some issues need review, and may require choosing
a different dependency.

Run `npm audit` for details.
npm notice
npm notice New minor version of npm available! 8.3.0 -> 8.12.0
npm notice Changelog: [https://github.com/npm/cli/releases/tag/v8.12.0](https://github.com/npm/cli/releases/tag/v8.12.0)
npm notice Run npm install -g npm@8.12.0 to update!
npm notice

コマンドのオプションがわからない場合は nativefier --help にて確認します。

単体アプリ化

アイコンを指定する必要があります。今回はアプリ版と見た目を変えずにやりたかったため、アプリ版のリソースから取得します。

アプリのパッケージ内容を開きます。

Contents/Resources 内のAppIcon.icnsを開き、PNG形式で書き出します。

下記コマンドでapp形式のビルドを実施して完了です。

% nativefier --name=TweetDeck https://tweetdeck.twitter.com --icon="1200x630bb.png"
    Hi! Nativefier is minimally maintained these days, and needs more hands.
    If you have the time & motivation, help with bugfixes and maintenance is VERY welcome.
    Please go to <https://github.com/nativefier/nativefier> and help how you can. Thanks.


Processing options...

Preparing Electron app...

Converting icons...

Packaging... This will take a few seconds, maybe minutes if the requested Electron isn't cached yet...
Packaging app for platform darwin x64 using electron v18.3.1

Finalizing build...
App built to /path/to/TweetDeck-darwin-x64, move to wherever it makes sense for you and run the app bundle.

あとがき

デメリットとしては拡張機能が使えない点ですが、今回のTweetDeckの場合は元から使っていないため気にしていません。他にもWeb版を単体で動かしたいサービス等あれば、ビルドしてみると快適になるかもしれません。

customer-story-analytics