リスキリング（プログラミング）

独学プログラミング演習

View My GitHub Profile

Rust

独学書

テキスト 日付 進捗状況
パーフェクトRust 2024/01/05 finished ->コード

コンテンツ

コンテンツ 日付 進捗状況
Webアプリ実装で学ぶ、現場で役立つRust入門 2024/05/17 第8回 RRustとDioxusでSPAを新バージョンに対応させようustとDioxusで投稿アプリのSPAを作ってみよう

環境

  1. Windows 11

    端末 環境／FW 最終更新
    Windows Rust 1.82 2024/10/19
    RustRover 2024.3 2024/11/23
    Tauri 2.1.1 2024/11/17
    Svelte 5.2.2 2024/11/17
    Vite 5.4.11 2024/11/17
    Bun 1.1.34 2024/11/17
    Slint 1.8.0 2024/10/26
    Dioxus 0.5.1 2024/04/30
    Bevy 0.14 2024/07/27

  2. Ubuntu 24.04.1 on Windows 11

    端末 環境／FW 最終更新
    Windows Rust 1.82 2024/10/19
    Tauri 2.1.1 2024/11/17
    React 18.3.1 2024/05/04
    Vite 5.4.11 2024/11/17
    Bun 1.1.35-canary.66 2024/11/17
    Bevy 0.10.1 2023/04/30
    wasmtime 20.0.1 2024/05/06

  3. Chrome OS Flex 130.0.6723.84(Official Build)

    端末 環境／FW 最終更新
    Chrome OS Rust 1.82 2024/11/09
    Tauri 1.8.1 2024/11/09
    Node.js 20.12.0 2024/03/30
    Bun 1.1.34 2024/11/09
    React 18.3.1 2024/05/11
    Vite 5.4.10 2024/11/09
    Bevy 0.10.1 2023/04/01

  4. Mac OS Sonoma 15.1

    端末 環境／FW 最終更新
    Mac OS Rust 1.82 2024/10/19
    Tauri 2.1.1 2024/11/12
    Bun 1.1.34 2024/11/12
    Vite 5.4.11 2024/11/12
    Node 22.6.0 2024/08/17
    CocoaPods 1.16.1 2024/10/31

ノウハウ

Rust

WASM

RustRover

Visual Studio Code

クレート

セッション管理

SSL

Tauri(Desktop Framework)

  1. windows 11 / Chrome OS Flex
    % cargo update
% npm update
  2. Ubuntu 20.04.5 on Windows 11
    % yarn upgrade
  1. Windows 11
    Default host: x86_64-pc-windows-msvc
rustup home:  C:\Users\taish\.rustup

stable-x86_64-pc-windows-msvc (default)
rustc 1.71.0 (8ede3aae2 2023-07-12)
    Tauri-app
    • Mcafeeにウイルスとしてブロックされる Mcafee抑止
  2. ubuntu 22.04.2 on Windows 11
    Default host: x86_64-unknown-linux-gnu
rustup home:  /home/taishow/.rustup

stable-x86_64-unknown-linux-gnu (default)
rustc 1.71.0 (8ede3aae2 2023-07-12)
    Tauri-app
  3. Chrome OS Flex
    • Tauri環境確認
      bun tauri info

      [✔] Environment
    - OS: Debian 12.0.0 X64
    ✔ webkit2gtk-4.0: 2.44.2
    ✔ rsvg2: 2.54.7
    ✔ rustc: 1.79.0 (129f3b996 2024-06-10)
    ✔ cargo: 1.79.0 (ffa9cf99a 2024-06-03)
    ✔ rustup: 1.27.1 (54dd3d00f 2024-04-24)
    ✔ Rust toolchain: stable-x86_64-unknown-linux-gnu (default)
    - node: 16.19.0
    - npm: 8.19.3
    - bun: 1.1.20

[-] Packages
    - tauri [RUST]: 1.7.1
    - tauri-build [RUST]: 1.5.3
    - wry [RUST]: 0.24.10
    - tao [RUST]: 0.16.8
    - @tauri-apps/api [NPM]: 1.6.0
    - @tauri-apps/cli [NPM]: 1.6.0

[-] App
    - build-type: bundle
    - CSP: unset
    - distDir: ../dist
    - devPath: http://localhost:1420/
    - framework: React
    - bundler: Vite
      Tauri-app

Slint

Dioxus(Cross Platform Library)

Game Engine

Tauri Documents

Splashscreen

Webページが読み込みに時間がかかったり、メインウィンドウを表示する前に初期処理を実行する必要がある場合、スプラッシュスクリーンによって、ユーザの起動体験を改善できる。

Setup

まず、実行環境のディレクトリにsplashscreen.html（スプラッシュスクリーンのためのHTMLコード）を作る。

"windows": [
    {
        "title": "Tauri App",
        "width": 800,
        "height": 600,
        "resizable": true,
        "fullscreen": false,
    +   "visible": false // Hide the main window by default
    },
    // Add the splashscreen window
    + {
    +   "width": 400,
    +   "height": 200,
    +   "decorations": false,
    +   "url": "splashscreen.html",
    +   "label": "splashscreen"
    + }
]

さて、アプリケーション起動時には、メインウィンドウを非表示にして、スプラッシュスクリーンを表示するようにします。続けて、メインウィンドウが準備できたら、スプラッシュスクリーンを閉じる手段を準備する必要があります。何を待っているかによって、スプラッシュスクリーンを閉じる手段は決まる。

Waiting for Webpage

Webコンテンツを待っているのであれば、フロントエンドからスプラッシュスクリーンを閉じるコマンドを準備したいでしょう。

use tauri::Manager;
// Create the command:
// This command must be async so that it doesn't run on the main thread.
#[tauri::command]
async fn close_splashscreen(window: tauri::Window) {
  // Close splashscreen
  if let Some(splashscreen) = window.get_window("splashscreen") {
    splashscreen.close().unwrap();
  }
  // Show main window
  window.get_window("main").unwrap().show().unwrap();
}

// Register the command:
fn main() {
  tauri::Builder::default()
    // Add this line
    .invoke_handler(tauri::generate_handler![close_splashscreen])
    .run(tauri::generate_context!())
    .expect("failed to run app");
}

２つの方法のうち、いずれかでプロジェクトへインポートできる。

// With the Tauri API npm package:
import { invoke } from '@tauri-apps/api/tauri'

または

// With the Tauri global script:
const invoke = window.__TAURI__.invoke

最後にイベントリスナに追加する。（または閉じたいときにinvokeを使って呼び出すだけです）:)

document.addEventListener('DOMContentLoaded', () => {
  // This will wait for the window to load, but you could
  // run this function on whatever trigger you want
  invoke('close_splashscreen')
})

Waiting for Rust

サーバサイドでのRustコードの実行を待っているのであれば、setup関数ハンドラに置いて、Appインスタンスからアクセスできるようにする。

use tauri::Manager;
fn main() {
  tauri::Builder::default()
    .setup(|app| {
      let splashscreen_window = app.get_window("splashscreen").unwrap();
      let main_window = app.get_window("main").unwrap();
      // we perform the initialization code on a new task so the app doesn't freeze
      tauri::async_runtime::spawn(async move {
        // initialize your app here instead of sleeping :)
        println!("Initializing...");
        std::thread::sleep(std::time::Duration::from_secs(2));
        println!("Done initializing.");

        // After it's done, close the splashscreen and display the main window
        splashscreen_window.close().unwrap();
        main_window.show().unwrap();
      });
      Ok(())
    })
    .run(tauri::generate_context!())
    .expect("failed to run app");
}