Remixをローカルのファイルと同期させる方法


みなさんDaaps開発楽しんでますか?
Daaps開発で使うプログラミング言語Solidityのエディタとして、ブラウザ上で書けるRemixが便利です。
しかし、ブラウザ上でサクサク書いていると、「あれ?このファイルブラウザ上にしかないのか、ちょっと怖くね?」と気づきます。
その後、ローカルのファイル読み込めないのかな?と探すと、左上にフォルダマークを発見します。無事読み込めて、納得納得・・した後に、「ブラウザ上で編集した内容がローカルに反映されていない」ことに気づいて絶望します。

Remixをローカルのファイルと同期させるためには、上記の方法では不十分で、下記の作業をする必要があります。

remixdのインストール

Remixと連携させたいフォルダ内に、remixdをインストールします。
remixd
(https://github.com/ethereum/remixd)

今回は、公開されているチュートリアルを私が作成したものと、remixを連携させていきます。

$ git clone https://github.com/3tomcha/pet-shop-tutorial.git
$ cd pet-shop-tutorial
$ npm install -g remixd

最後にlsコマンドで、remixdがあることを確認すれば、インストールは完了です。

「npm install -g remixd」は、バージョンによってはエラーになるようです。その場合は、下記のようにgit cloneを用いてインストールして見てください。

$ git clone https://github.com/ethereum/remixd.git

remixdの起動

インストールしたremixdを起動します。
下記のように連携したいフォルダを指定します。

remixd -s <連携したいフォルダのパス> --remix-ide https://remix.ethereum.org

私の場合は、下記の通りになります。実行するとsetupやlisteningなど動いていそうな単語が表示されると思います。これで、フォルダの方の準備はOKです。

$ remixd -s /Users/tomoya/pet-shop-tutorial --remix-ide https://remix.ethereum.org

[WARN] You may now only use IDE at https://remix.ethereum.org to connect to that instance
[WARN] Any application that runs on your computer can potentially read from and write to all files in the directory.
[WARN] Symbolinc links are not forwarded to Remix IDE

setup notifications for /Users/tomoya/pet-shop-tutorial
Sat May 18 2019 18:05:44 GMT+0900 (JST) Remixd is listening on 127.0.0.1:65520

ブラウザから連携する

リミックスから操作していきます。
https://remix.ethereum.org/)

まずは左上の鎖のマークをクリックします。

Connect to Localhostと出るので、Connectをクリックします。

鎖のマークが緑になったら成功です。左のフォルダの一覧にlocalhostが表示されます。

localhostのファイルを試しに編集し保存してみると、ローカルのファイルも変わっていることがわかると思います。これで完了です!お疲れ様でした!