eelはelectronのサーバサイドの処理をpythonで書けるようにしたものです。
前からpythonのguiアプリは何がいいかと思っていましたがこれはかなりいいです。

html + css + jsで書けるのでwebの人も簡単に使えるし、パッケージ化もすごく簡単でした。
ちょっとしたpythonの処理をgui化して人に配布したい場合はこれ一択な気がします。
とりあえず、以前気になっていた「画像をミニチュアっぽくする処理」をguiアプリ化したいと思います。

やりたいこと

・eelみたいなものを待ち望んでいた。
・仮想DOM的なJSフレームワークを触ってみたい。(vueがgoogleトレンドで強かったのでこれにした)。
・bootstrap4リリースされたから触ってみる。
・配布できる形までもっていく。

eelの使い方(サンプル)

ファルダ構成は以下のように配置します。
以下のサンプルはjs-python間でデータの受け渡しの例です。

web-hello.html
hello.py

hello.py

# pip install ellでインストールしたellをインポート
import eel

# フォルダ構成で作ったwebファイルを読み込みます
eel.init('web')

# @eel.exposeを関数の前につけるとこの関数がjsでも呼べるようになります。
@eel.expose
def say_hello_py(x):
    print('Hello from %s' % x)

# 上で宣言した関数はpythonでも呼べます
say_hello_py('Python World!')

# eel.xxxでjsで宣言した関数も呼び出すことができます。
eel.say_hello_js('Python World!')

# hello.htmlを読み込んでellをスタートします
eel.start('hello.html', size=(300, 200))

hello.html

<!DOCTYPE html>
<html>
    <head>
        <title>Hello, World!</title>
        
        <!-- ell.jsインクルード -->
        <script type="text/javascript" src="/eel.js"></script>
        <script type="text/javascript">
        
        // eel.expose(XXX)でこの関数をpythonから呼べるようにします。
        eel.expose(say_hello_js);
        function say_hello_js(x) {
            console.log("Hello from " + x);
        }
        
        // pythonで宣言した関数をjsで呼びます。
        eel.say_hello_py("Javascript World!");
        
        </script>
    </head>
    
    <body>
        Hello, World!
    </body>
</html>

作ったもの

github.com

pythonがインストールされている環境なら

python run.py

で実行できます。
画像を選択して、convertで変換する簡単なアプリですがとても簡単にできました。
以下のコマンドでパッケージ化もできます。

python -m eel run.py web -noconsole

感想

web言語を使ってpythonでguiアプリを作れるのは素晴らしい。
以前はelectron&flask等でもできたけどこっちのほうが圧倒的に簡単。

in my 雑記

プログラミング bump 日々のことなど

pythonで簡単にguiアプリが作れるeelを試してみた

やりたいこと

eelの使い方(サンプル)

作ったもの

感想