最近何かと話題の Electron と、頻繁に使っている Facebook Messenger の www.messenger.com が 2016/2/1 頃の Chrome のアップデートで異常に重くなったので、知人の Matsuda さんにに紹介してもらった「nativefier」という、ウェブサイトをネイティブアプリ化できるツールを使って劇的に解消することができました。
ついでに ChatWork もアプリ化しました。
この記事の最新版
最新版はブログに掲載しています。
http://ja.katzueno.com/2016/02/3566/
インストール
npm install -g nativefier
お使いの Mac などに Node.js が入っていることが必要です。
Facebook Messenger をネイティブアプリにする
cd /Applications/
nativefier --honest --badge --app-name "Facebook Messenger" "www.messenger.com"
ChatWork をネイティブアプリにする
cd /Applications/
nativefier --honest --badge --app-name "ChatWork" "www.chatwork.com"
おまけ：アイコンを登録してみる
Messenger と ChatWork 2つつくると、アイコンがわかりづらいので、アイコンを登録してみます。
アイコンをゲットする
より.icnsなアイコンファイルをゲットできます。
アイコンを作る
iPhone アプリから引っ張ってくるという手もあります。
- Messenger と ChatWork アプリが入った iPhone を iTunes にバックアップ。
- Home - Music - iTune Library - Mobile Application フォルダに行き、Messenger と ChatWork の ipa ファイルを見つけて適当な場所にコピーする
- .ipa ファイルを .zip 拡張子に書き換える
- ZIP を解凍する
- フォルダを追うと、Mac OS では実行できない .app フォルダが現れるので、右クリック (Ctlr + クリック) でパッケージの中身を見る
- PNG ファイルを取得する
- 「Macアプリの.icnsを作るときのメモ」を参考にアイコンファイル作成
アイコン付きのネイティブアプリを作る
これで「messenger.icns」「chatwork.icns」というファイル名のアイコンを作り
cd /Applications/
nativefier --honest --badge --app-name "Facebook Messenger" --icon /【アイコンの保存先】/messenger.icns "www.messenger.com"
nativefier --honest --badge --app-name "ChatWork" --icon /【アイコンの保存先】/chatwork.icns "www.chatwork.com"
でアイコン付きのネイティブアプリを作成しました。
参考記事
nativefier の詳細ははこちらの記事を参考に
参考：Webページをデスクトップアプリ化 - nativefierを使ってみる
以上