# ワラベンチャー

今さら、手作りのホームページ。（Created by むずでょ）
チームみらいボランティアのリンクはこちら。

## [2025-07-12_Sat]

csv-cleaning-2-on-tauriリポジトリーのパッケージ依存関係がおかしいらしい。
📄cargo.tomlファイルから、api-allフィーチャーを除去。
👇 次に、cargoを更新。 
cd src-tauri
cargo update
cargo clean
pnpm install
pnpm dev

cd ..
pnpm add @tauri-apps/cli@latest @tauri-apps/api@latest

pnpm tauri info

> notepad-on-tauri@0.1.0 tauri C:\Users\muzud\OneDrive\ドキュメント\GitHub\csv-cleaning-2-on-tauri
> tauri "info"


[✔] Environment
    - OS: Windows 10.0.26100 x86_64 (X64)
    ✔ WebView2: 138.0.3351.77
    ✔ MSVC:
        - Visual Studio Build Tools 2022
        - Visual Studio Community 2022
    ✔ rustc: 1.87.0 (17067e9ac 2025-05-09)
    ✔ cargo: 1.87.0 (99624be96 2025-05-06)
    ✔ rustup: 1.28.2 (e4f3ad6f8 2025-04-28)
    ✔ Rust toolchain: stable-x86_64-pc-windows-msvc (default)
    - node: 22.16.0
    - pnpm: 10.11.0
    - npm: 10.8.2

[-] Packages
    - tauri 🦀: 2.6.2
    - tauri-build 🦀: 2.3.0
    - wry 🦀: 0.52.1
    - tao 🦀: 0.34.0
    - @tauri-apps/api : 2.6.0
    - @tauri-apps/cli : 2.6.2

[-] Plugins
    - tauri-plugin-dialog 🦀: 2.3.0
    - @tauri-apps/plugin-dialog : 2.2.2 (outdated, latest: 2.3.0)
    - tauri-plugin-fs 🦀: 2.4.0
    - @tauri-apps/plugin-fs : 2.3.0 (outdated, latest: 2.4.0)
    - tauri-plugin-opener 🦀: 2.4.0
    - @tauri-apps/plugin-opener : 2.2.7 (outdated, latest: 2.4.0)

[-] App
    - build-type: bundle
    - CSP: unset
    - frontendDist: ../dist
    - devUrl: http://localhost:1420/
    - framework: Vue.js
    - bundler: Vite

rustup update

cd src-tauri
cargo add tauri-plugin-fs
pnpm add @tauri-apps/plugin-fs

cd ..
pnpm dev

直らん。 📁node_modules フォルダーを削除して、pnpm tauri devを打鍵。
コンパイル・エラーの数はだいぶ減った。 
pnpm install
pnpm tauri dev
コンパイル・エラーの数はさらに減った。 
cd src-tauri
cargo add csv

cd ..
pnpm tauri dev
コンパイル・エラーは取れて、ウィンドウも表示されたけど、ウィンドウの内側は真っ白だ……。

👆 シュリンクして、テキストだけ表示できるように直した。
逐次的に<main class="container">なんてコツコツ書かずに、
構造的に<v-app><v-main>を使うみたいだぜ？
そうか、自動的にレスポンシブ・デザインに対応してもらうには、Ｗｅｂサイトに特化したフレームワークに丸投げした方がいいのか……。

## [2025-06-19_Thu]

CSV ファイルを読み込んだら、表形式のコントロールで表示してくれだぜ。
データテーブルは HTML にないので、
データテーブルのあるVuetify 3をフロントエンドに使ってみるかな。
csv-cleaning-on-tauriリポジトリーから、自動生成したフォルダーを除いた部分をコピーして、
csv-cleaning-2-on-tauriリポジトリーを作成するぜ。 
pnpm install
👆いつも通りのコマンド。 
pnpm add vuetify
👆Grok に聞いた、Vuetify 3 をインストールするコマンドを打鍵。 
import { createApp } from 'vue';
import App from './App.vue';
import 'vuetify/styles'; // VuetifyのCSSをインポート
import { createVuetify } from 'vuetify';
import * as components from 'vuetify/components';
import * as directives from 'vuetify/directives';

// Vuetifyインスタンスを作成
const vuetify = createVuetify({
  components,
  directives,
  theme: { defaultTheme: 'light' }, // テーマ設定（任意）
});

// VueアプリにVuetifyを登録
createApp(App).use(vuetify).mount('#app');
これも👆Grok に聞いたやつで、📄src/main.tsを上記のように編集すればいいらしい。 
pnpm add @tauri-apps/api
👆さらにコマンド打鍵。 
cd src-tauri
cargo clean
※targetフォルダーがあれば削除。 rm -rf target
pnpm install
pnpm tauri dev
👆リポジトリーをコピーしたからか、わけわからんエラーが出たので、
キャッシュをクリアーしてやり直し。

## [2025-06-15_Sun]


👆前（2025-06-12_Thu）言ってたツールを作ったぜ。
おつ。
じゃあ次の課題だぜ。
埼玉県新座市内の丁目、番地の形を図形として切り出して表示するソフトを作ってくれだぜ。
Grok に尋ねてみると、日本の地図データを無料公開しているのは以下の２つで、
［国土地理院］の方は丁目の精度までだから、残るのは［G空間情報センター］の一択だぜ。
［G空間情報センター］の地図データは、精度や形式が揃ったものではなく、バラバラだそうだぜ。
この .geojson ってファイルは、どんなアプリで開けるの？
11230_新座市_公共座標9系_筆R_2022.geojson
Grok がいくつか知ってたが、とりあえず QGIS を使ってみるかだぜ。

👆あれっ、思ったような地図と違う……。
不動産屋が登記した土地しか入ってないんじゃないの？
使えねー。じゃあ［国土地理院］の方を見てみるか……。

👆この地図をどうやって .geojson 形式に変換するんだぜ？
とりあえず左のサイドメニューの保存ボタンを押してみろだぜ。
.json 形式では保存できるが、.geojson 形式ではなかったぜ。
じゃあ地図表示は諦めて、データ・クリーニングの方に重点的に取り掛かるかだぜ。

👆左の表は令和7年5月1日現在の［埼玉県］の市区町村別世帯数・人口だぜ。
右の表はお父んが［国勢調査］から持ってきて編集している表だぜ。

このように、カテゴリー分けや、個々の項目名が揃っていないが、同じものを表しているはずの２つの表を、
行を揃えてデータを見せてくれるツールを作ってくれだぜ。

👆じゃあとりあえず、左表から１列取って［名前2］、右表から１列取って［名前1］として、市区町村名を以下の３つのグループに分けるかだぜ。
  • 両表に含まれる市区町村名
  • 左表にだけ含まれる市区町村名
  • 右表にだけ含まれる市区町村名

👆２列を独立して昇順ソートするかだぜ。
浦和の浦がひらがなより文字コードが小さいのが意味わからんが……。

👆手で振り分けたぜ。

👆手で名前の表記揺れを修正して２行を１行にまとめたりして、
そして、［二表仮番］という名前で列を作って、連番を振るぜ。
変更前の列名は残しておかないと、あとでどの行だったのかわからなくなるんじゃないの？
そうか、古い列名は残しておいてくれだぜ。
じゃあ、今回手で行った操作を自動化するアプリを作ってくれだぜ。
アプリケーションの名前は column-names-sync-on-tauri とかでいいかな。
あれっ？ Cドライブの残り容量が 5 GB しかない！？
Tauri は debug フォルダーがバカでかいそうだぜ。
Grok に対策を聞いてみるか。
以下のコードをさくっと実行。 
cd src-tauri
cargo clean
リリースもデバッグもどちらも含めて 14.3 GiB もファイルが消えた……。
Tauri 恐ろしいな……。

## [2025-06-12_Thu]

データをクリーニングするツールが欲しいぜ。
全くだぜ。
文字列を入力し、［埼玉県新座市］という文字列があれば［埼玉県,新座市］と分割するような、
４７都道府県に対応した変換アプリを作ってくれだぜ。

👆 じゃあ 📄file-list-on-tauriリポジトリーから自動生成ファイルを削除して、それ以外をコピーした、
📄csv-cleaning-on-tauriリポジトリーを作るぜ。
git initコマンドを使った操作は、[2025-06-03_Tue] の日記を読んでくれだぜ。
今日は途中で終了。

## [2025-06-05_Thu]

今日は、家の掃除をしたいぜ。
じゃあ、風呂桶を掃除してくれだぜ。
✅ 風呂と洗面所、便器を拭き掃除したぜ。
じゃあ、お父んはその風呂に入れだぜ。
✅風呂に入ってサッパリしたぜ。
❌お湯を入れていたはずなのに、ぬるま湯になっていたが……
ガス代の支払いが滞っているのかしらねえ？
じゃあ次は、お父んは昼飯を食べろだぜ。
✅ 昼飯を食べたぜ。
１時間ぐらいかかった。わりと時間かかるな。
生命の維持に必要な活動ですからね。
じゃあ次は、コーヒーを飲んで、歯を磨けだぜ。歯間ブラシも使えよ。
✅ コーヒーを飲んで歯を磨いたぜ。歯間ブラシも使った。
じゃあ次は、フィットネスジムに行けだぜ。行きしなには漫画本をBook-Offに売ってきてくれだぜ。
帰りには明日の飯２食分を買ってこいだぜ。
余裕があればズボンの裾上げのための裁縫セットを買ってこいだぜ。
ズボンの裾上げのための裁縫セットってどこに売ってんの？
セブンイレブンや、ダイソーなどに売ってるだろ。
分かったぜ。行ってくるぜ。
帰宅なう。
✅フィットネスジムに行ってきたぜ。
✅行きしなに漫画本を売ってきたぜ。３０冊ぐらいで 2000 円ぐらいになったぜ。
🤔しかし、何巻まで買ったかのメモ書きをどこに保管しておくかが問題だぜ。
✅帰り際にはソーイングセットを買ってきたぜ。
ユザワヤでスヌーピーの絵柄が入ったやつだぜ、６，０００円。
６，０００円は高いなあ。元を取るために何本のズボンの裾を上げるつもりだぜ？
３本ぐらい……。
１本２，０００円の裾上げねえ。
夜は集中力が落ちているんで、ズボンの裾上げは明日の朝にしろだぜ。
ひとまず、カフェインレス・ブラックコーヒーでも飲んで休めだぜ。

## [2025-06-04_Wed]

👇 今日は Grok に聞いて、コードのワーニングを掃除しただけだぜ。


👆 変数名、関数名をsnake_caseからcamelCaseに変えたぜ。
👆 Rust で作った関数の戻り値を、TypeScript 側できっちり受け取れるように修正したぜ。

## [2025-06-03_Tue]

昨日と話しは変わって、課題No.2だぜ。
ディレクトリーを指定したら、その直下のファイル名を一覧してくれるアプリを作ってくれだぜ。
じゃあ、ファイルパスを入れるテキストボックスと、ファイル選択ダイアログボックスを開くボタン、
［ファイルの一覧］と、その表示を更新する［表示］ボタンがあればいいかだぜ。
今日のキャパシティ（作業に使える時間）は 6 とするぜ。
昨日作ったアプリから［Save］機能を削除して、テキストボックスをリストボックスへ付け替え、
あとは、ファイル名を一覧する機能が作れるかどうかの調査と実装だから、
調査を重めに見て、エフォート（作業にかかる時間見積）は 2 ってところねえ。

👆 昨日作ったプログラムから、.gitとnode_modules以外のフォルダーとファイルをコピーするぜ。

👆 📁file-list-on-tauriを作って、中身を貼り付け。

👆 そのフォルダーを VSCode で開くぜ。

git init

👆 （パワーシェルではなくて）コマンドプロンプトを開いて、上記のコマンドを打鍵するぜ。
これにより、カレントディレクトリーに 📁.gitっていう隠しフォルダーが作成されるぜ。
これでローカルＰＣに［ローカル・リポジトリー］を作った。
git add .

👆 続いて、上記のコマンドを打鍵するぜ。
LF を CRLF に変更するぞ、とか改行の変更の警告も出ているがまあいいだろう。
これで、全てのファイルを［ステージ］に上げた。
git commit -m "Initial commit"

👆 続いて、上記のコマンドを打鍵するぜ。
［ステージ］にあったファイルを［ローカル・リポジトリー］へコミットした。
コミットってのはファイルを置いたぐらいの感覚を持っていればいい。

👆 続いて、Git Hub で、初期ファイルは何もなしでfile-list-on-tauriリモート・リポジトリーを新規作成、
［ローカル・リポジトリー］との紐付け方法の説明が書いてあるぜ。

git remote add origin https://github.com/muzudho/file-list-on-tauri.git
git branch -M main
git push -u origin main

👆 上記のコマンドを打鍵するぜ。［ローカル・リポジトリー］に［リモート・リポジトリー］の場所を教えて、
［ブランチ］を選び、そこへ［ローカル・リポジトリー］のファイルをプッシュしたぜ。

👆 これで、［リモート・リポジトリー］にソースコードを置けたぜ。
pnpm install

👆 続いて、上記のコマンドを打鍵。
📁node_modules が自動生成されるぜ。

👆 続いて、📄src-tauri/tauri.conf.jsonファイルの内容を編集するぜ。
また、 📄src/App.vueファイルから［Save］機能を削除し、
［Load］ボタンは［Refresh］とラベルを変えておくぜ。
pnpm tauri dev

👆 続いて、上記のコマンドを打鍵。
数分待てだぜ。
開発モードでデスクトップアプリが起動するぜ。

👆 こんな感じで、デスクトップアプリのベースをコピーする方法は確立できたな。
じゃあ、とりあえず、そのテキストボックスに
指定のディレクトリーの直下にあるファイル名を一覧してくれだぜ。
ファイル名を調べるのとか、フロントの機能じゃないだろうから、
バックエンドの Tauri フレームワークを使うんだろな、なら言語は Rust か？

👆 とりあえず、テンプレートを上記のように変更。
Rust で定義している、ファイル一覧を読取るget_file_names関数を TpyeScript 側から呼び出しているぜ。

👆 Rust 言語の方に、ファイル名一覧を読取る関数を追加。
invoke_handlerってあたりに関数の名前を追加するのを忘れてはいけないぜ。

👆 ファイル名の一覧をカンマ区切りで取れたぜ。
リストボックスに入れてくれだぜ。
キャパシティ（作業に使える時間）をもう 4 は消費してるわよ。
残りは 2 よ。
なんでそんなに速く消費してしまったんだぜ？
まあ、コード書いたが動かないとか、動かない理由の調査とか、思ったよりしてるしな。
<script setup lang="ts">
    const itemsVM = ref(["apple", "banana", "cherry"]);
</script>

<template>
    <select size="5">
        <option v-for="item in itemsVM" :key="item" :value="item">{{ item }}</option>
    </select>
</template>

👆 リストボックスに項目を並べる考え方は、上記のコードで示したぜ。

👆 じゃあ、ソースコードは上記な感じで更新。

👆 よし、リストボックスにファイル名が入ったぜ。
やったな！　これで課題No.2 もクリアーだぜ！
かかった時間は 5 ってところねえ。
見積りでは 2 ぐらいだったから、調査に 1.5 倍は取られるってとこねえ。

## [2025-06-02_Mon]

フロントエンドに Vue、バックエンドに Tauri を使って、デスクトップアプリ制作を練習してみようぜ？
さっそく、このブログを有効的に使い始めたか。
これはブログじゃないのよ。
タグの直打ちで、文章載せるだけにしてはすごい労力……。
プログラミング練習の最初の課題でよくあるのはメモ帳だな。
テキストボックスに文章を入力して、［保存］ボタンを押したらファイルに保存できて、
［読込］ボタンを押したらテキストファイルを読込むんだぜ。
Tauri の公式ホームページはここにあるぜ。
📖 Tauri 2.0
Tauri の Get Started を読んでいけだぜ。
インストールの説明は省くからな。

pnpm create tauri-app
👆 こんな感じでコマンドを打鍵すればいいはず。

👆 色々尋ねられるので、こんな感じで進めたぜ。

👆 Git Hub と連携しておいた。フォルダーの中身はこうなった。

👆 VSCode で開く。 下側のステータスバーを見ると cargo がディレクトリーをチェックしてるので
わたしの PC はCPU処理がビジーだとフリーズすることがあるので、終わるまで待って……。

pnpm install
👆 （パワーシェルではなく）コマンドプロンプトで開いて、
上記のコマンドを打鍵。

👆 📁［node_modules］というバカでかいフォルダーが自動生成される。
pnpm tauri dev
上記のコマンドを打鍵。
わたしのケースでは、 379 個の大量のプログラムのコンパイルが走るので数分かかる。

👆 途中で［http://localhost:1420/］という URL が出てくるが、気にしないでほしい。
ウェブブラウザーでは、フロントエンドの画面表示のテストはできるが、バックエンドのテストはできない。
動作確認に使うには不完全。

👆 コンパイルが終わると、デスクトップアプリが出てくる。
動作確認はこれに対して行う。
じゃあ、テキストボックスと、［保存］ボタン、［開く］ボタンを置いてくれだぜ。

👆 📄 src/App.vueファイルの <template>タグの中に、いわゆる HTMLタグを打ち込んでいけばいいはずだぜ。

👆 ひとまず、こんな感じか。

👆 スタイルを除くと、ソースはたったの 24 行だぜ。
ファイルパスを入れるテキストボックスと、ファイルを選択するダイアログボックスが出てくるボタンが欲しいぜ。

👆 テキストボックスと、ボタンの見た目に違いが小さいのイケてないが、
スタイルの修正は後回しにしよう。
ダイアログボックスを出すには、何か設定が要るんだよな。
調べるか。
📖 TAURI　＞　Dialog
pnpm tauri add dialog

👆 なんか知らんけどエラー出た。

👆 えーと、つまり、"permissions": []に"dialog:default"を追加しようとしたら、
もう追加されてたからエラーってことかだぜ？
じゃあ"dialog:default"を消しといたれ。

👆 多分、通ったか？

👆 こんな感じで改造して……。

👆 ファイル選択ダイアログボックスが出たぜ、オッケー。
アンドロイドやアイフォンでは、ファイル選択ダイアログボックスは出せないそうだぜ。
ファイル選択ダイアログボックスで最初に開いているフォルダーは、
テキストボックスに書いてあったパスにしてくれだぜ。
👇 API は以下のページに書いてあるから……。
📖 OpenDialogOptions
これ読んで直しておくかだぜ。

👆 １行追加するだけでいけた。
あとは、ファイルの書込みと読込みねぇ。
👇 ファイルの読み書きの API は以下のページに書いてあるから……。
📖 File System
ページの上から順番に読んで実装しようぜ。
pnpm tauri add fs


👆 テキストを読み込む方は上記の通りでいけた。

👆 テキストを書き込む方はイケてない。何かパーミッション設定でも足りてないのか？
👇 説明書はあるけど。
📖 Examples

👆 なんか分かってないけど、このように書いたらファイルへのテキスト書き込みはでけた。
やったな！　微速微進、遅々前進だぜ！
Git Hub のリポジトリーへのリンクも貼っておきましょう。
📖 muzudho / notepad-on-tauri

## [2025-06-01_Sun]

文字は出せるかだぜ？
出せてるぜ。
なんか画像がボヤけてない？
サイズもマチマチだし。
グレードダウンしてない？
まあ、そこはゆくゆくは修正だな。
さっそくイラストを新調したか、
グレードダウンしてないかだぜ？
Grok に描かせようと、Super Grok にプラン変更しようとしたら、
クレジットカードを拒否されたので、あんたのお父んの手描きになったのよ。
何でクレジットカードが拒否されたのか知らんけど。
このトップページは近況を書く日記かだぜ？
メインのコンテンツは何かないのかだぜ？

## [2025-05-24_Sat]

Grok の助けを得て、ホームページ作成中（＾ｑ＾）