9
18

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

WebサービスをMacのアプリ化してみる

Last updated at Posted at 2017-04-22

Macユーザーなので基本的にはブラウザはSafariを使っていました。Appleの開発者ページもSafariじゃないとおかしなことがあったり、iPhoneとの同期なんかもあって便利に使っていました。はい、過去形です。

なぜ過去形なのか、

TouchBarによるSafariのクラッシュが頻発して耐えられなくなってしまったのです。で、その苦しみから解放するべくChromeに切り替えたのですが、イマイチなところもあるので、どうせならとWebサービスをアプリ化してみることにしました。(ブックマークでいいじゃんというのは置いといて)

ググってみると、nativefierってのが良さそうだったのでそれをやってみる。まずは環境構築からやらねばいけずちょっと手間でしたが、一度作ればマシン変えるまではそのままでいいので気にせずやっておく。

アプリ化しておくと便利だなと思っているのが

  1. Backlog
  2. Redmine
  3. Qiita
  4. Facebook

などなど
さて始めて見ます。上から順番にやっていけば基本的には完了するはずです。

homebrewのインストール

https://brew.sh/index_ja.html
に書かれているスクリプトを実行します。

nodebrewのインストール

homebrewがインストールできたら次のコマンドを実行します。
brew install nodebrew

$ brew install nodebrew
==> Using the sandbox
==> Downloading https://github.com/hokaccha/nodebrew/archive/v0.9.7.tar.gz
==> Downloading from https://codeload.github.com/hokaccha/nodebrew/tar.gz/v0.9.7
######################################################################## 100.0%
==> /usr/local/Cellar/nodebrew/0.9.7/bin/nodebrew setup_dirs
==> Caveats
Add path:
  export PATH=$HOME/.nodebrew/current/bin:$PATH

To use Homebrew's directories rather than ~/.nodebrew add to your profile:
  export NODEBREW_ROOT=/usr/local/var/nodebrew

Bash completion has been installed to:
  /usr/local/etc/bash_completion.d

zsh completions have been installed to:
  /usr/local/share/zsh/site-functions
==> Summary
🍺  /usr/local/Cellar/nodebrew/0.9.7: 8 files, 38KB, built in 5 seconds

こんなふうに出れば成功です。

node.jsの最新版をインストール

以下のコマンドを実行します。

$ nodebrew install-binary latest

エラーが出る場合は

$ mkdir -p ~/.nodebrew/src

とやってから実行してみましょう。

nodeのバージョンを有効にする

$ nodebrew use v7.9.0

パスを通す

$ echo 'export PATH=$PATH:/Users/XXXXXX/.nodebrew/current/bin' >> ~/.bashrc

npmを確認

$ npm -v

Nativefierのインストール

npm install nativefier -g

よく使うWebサービスをアプリ化する

いくつかコマンドがあるので、詳しくはnativefierのページを参照ください。アプリアイコンもセットで指定してあげると素敵になるので、「PNG to ICNS」とかでググると簡単に作成できます。

Backlog

$ nativefier --name "Backlog" "apple.com" --icon "backlog.icns" --overwrite --badge

カレントディレクトリにフォルダができ、そのなかに.appができたかと思います。

9
18
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
9
18

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?