e-tipsmemo

ごった煮

Tauriを使ってみる(だけ)

GUI開発をしたいので、面倒なものをいれるよりは、Windows上でやったほうがいい気がしたのでWindowsで行う。
WSL2上では、fish-shellを使っているのでnodejsを入れるのがめんどくさい

準備

Rustを入れる。
Rust をインストール - Rustプログラミング言語

nodeを入れる。
ダウンロード | Node.js

Visual StudioC++開発環境とかをいれる(msvcコンパイラとかのリンカーを使ので)
全部じゃなくてもMicrosoft Visual Studio C++ Build Toolsを入れておけばOK

Power Shellで

> npm -v
9.5.0
> npm create tauri-app
Need to install the following packages:
  create-tauri-app@3.2.1
Ok to proceed? (y) y
✔ Project name · tauri-app
✔ Choose which language to use for your frontend · Rust - (cargo)
✔ Choose your UI template · Vanilla

Template created! To get started run:
  cd tauri-app
  cargo tauri dev

npm notice
npm notice New minor version of npm available! 9.5.0 -> 9.6.2
npm notice Changelog: https://github.com/npm/cli/releases/tag/v9.6.2
npm notice Run npm install -g npm@9.6.2 to update!
npm notice
> cd .\tauri-app\
> cargo tauri dev


なんか出た。

Rust(wasm)+typescriptでやろうとしていたことが一瞬でできちゃう気がする?
ブラウザ上でも動くのだろうか?

これは生のHTMLとCSSを書くタイプのプロジェクト構成を出力する選択肢で、
ほかのを選ぶと、Reactなどをフロントエンドにフレームワークに指定できる。

\tauri> cargo create-tauri-app
✔ Project name · yfin_test
✔ Choose which language to use for your frontend · TypeScript / JavaScript - (pnpm, yarn, npm)
✔ Choose your package manager · yarn
✔ Choose your UI template · React - (https://reactjs.org/)
✔ Choose your UI flavor · TypeScript

Template created! To get started run:
  cd yfin_test
  yarn
  yarn tauri dev

Front end languageにTS/JSを選択すると後々Reactへルート分岐がある。
(別の選択肢だとReact は出てこない)
こちらの場合はcargoではなく、yarnが必要。


感想

適当にライフゲームなどを書いてみた感じ
Reactはすでに様々なプロジェクトで使われており、
情報やテンプレートが多いので、簡単にそれらしいUI構築することができた。
(結局CSSを少しいじったりもしたが、ChatGPTに聞けば案外行ける気がした)