Atom + GulpでElectron LiveReload環境構築

Yosemite入りしてようやくElectronが動くようになりました． ということで開発環境構築ですが，先ずはLiveReloadするようにしました． gulpなのは，流行り物というところ以前に，写経先がgulpだったから． gruntもあまり詳しくはないのでどちらでもいいというのが正直なところです．

導入したプラグイン

  • gulp-control ** このプラグインを入れた状態でctrl + alt + oとすると，プロジェクト内のgulpfile.jsに含まれるタスクが一覧されるので，それをクリックすることで実行できるようになります．

Gulpfile.js

qiita.com

こちらを丸パクリしました．

それで

Electronプロジェクトを作る際には，上を参考にgulpfile.jsを作成しておくと，ctrl + alt + oでgulpタスクが一覧されるので，そこからLiveReload起動できるようになるのでそのまま作業が行えます． もちろんgulp-controlからは全てのgulpタスクが実行できるため，LiveReloadタスク以外についても同様に利用できます．

MacでのElectron環境構築…できませんでした

前回の記事作成後に環境構築したWindowsがお亡くなりになってしまったため，緊急でMacBookAir上に環境構築をやり直した．結論としてYosemiteへの変更必須のようなのでElectron環境構築は一時中断．

まずは

Windowsと同じくnpmでの環境構築を行おうとした． しかし，何度実行しても実行されず，node_package以下のElectron.appの中に含まれる実行ファイルを直接起動しても「Illegal instruction: 4」と言われてしまう始末．

次に

過去にraspberryでにたような状況に陥ってしまったため，npmを経由せずに公式サイトのバイナリを直接使ってみる．

github.com

このURLから「electron-v0.30.4-darwin-x64.zip」をダウンロードして解凍すると，「Electron.app」が含まれているため，これをアプリケーションフォルダに移動しておく． こちらを使ってターミナルからアプリケーションを起動しようとするが，同様のエラーメッセージが表示されてしまう…

結局

試しにアプリケーションフォルダに配置された「Electron.app」をクリックしてみると「osx 10.7」には対応していないとのこと… Swift使おうとした時も同じアラートが出てめんどくさくて後回しにしたが，やはりmac上で開発する気ならバージョンアップ必須か． electronのバージョンを買えて試してみることも考えたが，恐らくやる意味がほとんどないのでそれはやめておく．

node.jsでsqlite3を使う

普段仕事ではpythonを使っているが、golangに領分を食われている感を感じており、もっとコミュニケーションツールとして使いやすそうな言語に進出したい…ということで情報の多いJavaScriptの味見をしてみることに。

前々からWindows用デスクトップアプリとして使えるqを作ってみたかったので、 それを題材としてみる。 harelba.github.io

開発はnode.js(electron) + node-sqlite3で行う。 ベーシックなJavaScriptで開発し、今回はaltjsには手を出さない。

まずは最初の一歩としてnpmレポジトリのnode-sqlite3のサンプルを一部修正して写経する。(PowerShell上で適当に書いたのでインデントがひどいのはお察し)

www.npmjs.com

var sqlite = require('sqlite3').verbose();
var db = new sqlite.Database('sample.db');

db.serialize(function() {
        db.run('create table if not exists sample (info text);');
        var stmt = db.prepare('insert into sample values(?)');
        for (var i = 0; i < 10; i++){
                stmt.run('i=' + i);
        }
        stmt.finalize();
        db.each(
                'select rowid as id, info from sample',
                function(err, row) {
                        console.log(row.id + ': ' + row.info);
                }
                );
});
db.close();

DBベースの開発をする場合、もっと高級なORMを使った方が効率が良いことが多いが、今回作ろうとしているアプリはDB、テーブルを使い捨てる感じになるのでローレベルAPIを使えるこのライブラリがちょうどよさそう。 たぶんORMがほしかったらこちらのライブラリ。

Sequelize | The Node.js / io.js ORM for PostgreSQL, MySQL, SQLite and MSSQL

ひとまず動くところまで確認できたので、次の記事では開発環境を整える。