技術ブログ

プログラミング、IT関連の記事中心

MacでWebページをクライアントアプリのように利用する方法【nativefier】

■はじめに

普段、ChromeなどのWebブラウザで検索を行ったりしますが、Webアプリケーションをクライアントアプリのように利用したいと思う時があります。

私は、Backlogなどで感じました。

(Slackのようにアプリが配布されていればありがたいのですが。。。)

ここでは、「nativefier」を使用してWebサイトをクライアントアプリ化する方法を記載します。

■手順

Homebrew、Node.jsの環境構築を行っておいてください。

まだの方は「こちら」からインストールをお願い致します。

以下のコマンド(ターミナルで実行)で「nativefier」をインストールします。

npm install -g nativefier

Googleなどでクライアントアプリのアイコンをダウンロードしてください。(ローカルで使用するだけです。)

上記のアイコンのディレクトリに「cd」コマンドで移動します。

以下のコマンドでアプリを生成します。(各パラメータは以下に従って修正してください。)

  • 「Backlog」にはアプリ名
  • 「backlog.com」には該当のサイトのURL
  • 「backlog_icon.png」には上記でダウンロードした画像ファイル名
nativefier --name "Backlog" "backlog.com" --icon "backlog_icon.png"

生成された「[アプリ名]-darwin-x64」のディレクトリ内部の「[アプリ名]」ファイルがクライアントアプリです。