Upgrade to Pro — share decks privately, control downloads, hide ads and more …

ElixirDesktopを楽しむための前説

 ElixirDesktopを楽しむための前説

本スライドは、2023/3/8開催の「【人気増枠】ElixirMobile#1:Elixirでスマホネイティブアプリ作れるのご存知でした?」でLTした際のスライドです。

nako@9時間睡眠

March 12, 2023
Tweet

More Decks by nako@9時間睡眠

Other Decks in Programming

Transcript

  1. ElixirDesktopを
    楽しむための前説
    〜就業後の束の間の開放感を添えて〜
    2023/3/8 nako@9時間睡眠

    View full-size slide

  2. ElixirDesktopって?

    View full-size slide

  3. ElixirDesktopって何?
    https://hexdocs.pm/desktop/readme.html
    によると、
    Phoenix LiveViewを使って、Windows、MacOS、Linux、iOS、Android向
    けのネイティブライクなElixirアプリを構築できるそうです。

    View full-size slide

  4. マ??????
    Phoenixで???

    View full-size slide

  5. (心の声)
    PhoenixはMVCアーキテクチャのWebア
    プリケーションフレームワークで、
    サーバサイドプログラマや特に
    Rubyに
    馴染みがある人にはとっつきやすい!
    ただ、業務だと分担が分かれていること
    が多く、Webサービス開発者はなかなか
    手が出しにくいアプリ開発が
    Phoenix
    LiveViewで出来るということ?
    ということは…

    View full-size slide

  6. それって私でも
    アプリ開発ができる
    ってコト…!?

    View full-size slide

  7. さっそくElixirDesktopを始めてみよう

    View full-size slide

  8. さっそくサンプルを動かしてみるぞー①
    まず、
    https://github.com/elixir-desktop/desktop-example-app
    にあるサンプルをGit cloneなりzipでダウンロードなりします。

    View full-size slide

  9. さっそくサンプルを動かしてみるぞー②
    .tool-versionsのバージョンと、自分の環境のバージョンが合っているか確
    認。
    指定されているバージョンと違うとき、
    % elixir -v
    No elixir executable found for elixir 1.13.4-otp-25
    というメッセージが出ます。
    .tool-versionsファイルを書き換えましょう。

    View full-size slide

  10. さっそくサンプルを動かしてみるぞー③
    mix deps.getを実行。

    View full-size slide

  11. さっそくサンプルを動かしてみるぞー④
    リポジトリのApplication set-upのとおり、
    cd assets
    npm install
    cd ..
    mix assets.deploy
    を実行。

    View full-size slide

  12. さっそくサンプルを動かしてみるぞー⑤
    ./run でrunファイルを実行。
    起動できたらOK!

    View full-size slide

  13. ビューを書き換えてみよう

    View full-size slide

  14. ビューを書き換えてみよう
    VSCodeでプロジェクトを開いてビューを書き換えてみます。
    lib/todo_web/live/todo_live.html.heex
    書き換えたら、assets.deployをし、再度runを実行します。

    View full-size slide

  15. ElixirとPhoenixチョット分かれば入門できそう
    ● Phoenixのファイルやディレクトリ構造を知っていれば、デスクトップサン
    プルを動かすのは出来そう。
    ● Webサービスとアプリで同じ言語やフレームワークで実装できるのは、とっ
    つきやすくて助かる。

    View full-size slide

  16. ご清聴ありがとうご
    ざいました!

    View full-size slide