heimdalの技術ノート

IT全般、Linux、Windows、プログラミング開発など、何でもござれ

トップ > Electron

electronを使ってmithril.js 超入門 m.route編

mithril.js Electron javascript
  • はじめに
  • 準備
  • 環境
  • m.route
  • パターン1
  • パターン2
  • パターン3
  • 最後に

はじめに

m.routeについて、何パターンか紹介する。

準備


以前の記事からサンプルを持ってきてもいいが、
場所を用意したので、ここからダウンロードした方が早い。
https://github.com/xheimdal/mithriljs-sample-code
hello-mithrilを使用すれば良い。

続きを読む

electronを使ってmithril.js 超入門 m.prop m.withAttr編

Electron mithril.js javascript
  • はじめに
  • m.propとは
  • m.withAttrとは
  • 準備
  • パターン1
  • パターン2
  • パターン3
  • パターン4
  • 最後に

はじめに

mithril.jsのAPIの中にm.propがあるが、それを使うパターンを紹介する。

m.propとは

mithril.js版のgetter/setter関数のAPIである。
変数に代入することで、getter/setter関数用のプロパティを作成する。

続きを読む

WindowsへのElectron導入する前後でハマったところを解決してみた その2 Sqlite3を動かす

Electron nodejs python sqlite javascript
  • 前回の続きから
  • はじめに
  • 準備物
    • python
      • 1. 以下のサイトより、python2系をダウンロードする。
      • 2. インストールは特に変更せずに「次へ」を連打する。
      • 3. 環境変数を設定する。
        • 3.1. コマンドプロンプトを開き、以下のコマンドを実行する。
        • 3.2. 「詳細設定」タブ→「環境変数」をクリック
        • 3.3. 「Path」を編集し、Cドライブ直下のpythonのフォルダをセットする
      • 4. 新しいコマンドプロンプトを起動し、以下のコマンドを実行して、何か表示されればOK。
  • visualstudio2013
    • 1. 以下のサイトより、「Visual Studio Community 2013 with Update 5」をダウンロードし、インストールする。
  • node-gyp
  • ソースコード
    • 1.electronのサンプルソースを以下のページを参考に用意する。
    • 2.コマンドプロンプトでソースのフォルダまでいき、以下のコマンドを実行する。
    • 3.フォルダ構成が以下になっていることを確認する。
    • 4.main.jsのファイルを以下に編集する。
    • 5.動かしてみる
    • 6.以下のエラーが表示される
    • 7.一旦起動したElectronを閉じ、コマンドプロンプトで以下の場所へ移動する。
    • 8.ビルドする前に環境を確認する
    • 9.ビルドする
    • 10.ビルド結果を確認する
    • 11.ビルドしたファイルを移動する
    • 12.Electronを起動して、sqlite3の動作を確認し、ホッとする。
  • おまけ
  • まとめ

前回の続きから

heimdal.hatenablog.com

はじめに

2016年9月始め時点では、sqlite3をwindowsで使用するにはかなりハードルが高いです。
が、一度構築してしまえば、その後は簡単です。
今後は、改善されると思っていますので、対処されるまでの方法と思ってくれればと思います。

続きを読む

Electron初心者のためのHelloWorld（解説あり)

Electron nodejs javascript

はじめに

Electronの紹介をしたので、Hello Worldを動かすサンプルを作成してみます。
HTMLもJavascriptも始めたばかりの人が少しでもソースコードが読めるなど、役に立てれば幸いと思ってます。

環境

node.js v6.4.0
electron v1.3.4

ソースコード作成

今回はここを参考にしてみました。＆補足情報もあわせて書きました。
http://electron.atom.io/docs/tutorial/quick-start/

続きを読む