「デスクトップアプリを作りたいけど、Electronは重すぎる……」。そう感じたことはありませんか？実際、Electronで作られたアプリはメモリを500MB以上消費することも珍しくなく、「ただのメモ帳アプリなのにChromeが丸ごと動いている」ような状態になりがちです。

そんな課題を解決するのがTauri（タウリ）です。TauriはRust製のデスクトップアプリケーションフレームワークで、2024年末にv2が正式リリースされました。2026年現在、多くの個人開発者やスタートアップが「軽量デスクトップアプリを作るならTauri一択」と言うほど、エコシステムが成熟しています。

この記事では、Tauri v2の基礎から実践的なアプリ開発、配布までを完全解説します。「Rustなんて書いたことない」という方でも大丈夫。フロントエンド（HTML/CSS/JS/React/Vue/Svelte）の知識さえあれば、今日から始められます。

XServer VPS

広告

XServer VPS

開発環境構築に最適なVPS。月額1,046円〜

最大1,046円相当

詳しく見る →

Tauriとは？　なぜ今注目されているのか

Electronとの決定的な違い

TauriとElectronの最大の違いはアプリのバックエンドです。ElectronはNode.js + Chromiumを丸ごとバンドルするのに対し、TauriはOSが持つWebView（macOSのWKWebView、WindowsのWebView2、LinuxのWebKitGTK）を利用し、バックエンドはRustで書かれています。

この設計により、Tauriアプリのサイズはなんと数MB〜10MB程度（Electronは100MB〜300MB）。メモリ使用量も同じUIならElectronの半分以下になることが多いです。

項目 Tauri v2 Electron
アプリサイズ 3〜10MB 100〜300MB
メモリ使用量 50〜200MB 300〜800MB
バックエンド言語 Rust Node.js
WebView OS標準 Chromium同梱
クロスプラットフォーム macOS / Windows / Linux macOS / Windows / Linux
iOS / Android対応 ✅ v2で正式対応 ❌（別途Capacitorなど）
セキュリティ CSP + 許可リストで強制 Node.jsフルアクセス

2026年のTauriエコシステム

Tauri v2がリリースされてから1年半以上が経過し、プラグインエコシステムも大きく成長しました。以下のような公式プラグインが充実しています：

  • @tauri-apps/plugin-shell — シェルコマンド実行
  • @tauri-apps/plugin-fs — ファイルシステム操作
  • @tauri-apps/plugin-dialog — ファイル選択ダイアログ
  • @tauri-apps/plugin-sql — SQLite / MySQL / PostgreSQL接続
  • @tauri-apps/plugin-store — キーバリューストア（設定保存）
  • @tauri-apps/plugin-notification — OSネイティブ通知
  • @tauri-apps/plugin-clipboard-manager — クリップボード操作

さらに、コミュニティプラグインも数百種類あり、ほぼどんな機能でもプラグインでカバーできる状態です。自分でRustコードを書かなくても、プラグインの組み合わせだけで実用的なアプリが作れるようになりました。

Tauri v2のセットアップ

必要なもの

  • Node.js 18以上（推奨: v22 LTS）
  • Rust（rustupでインストール推奨）
  • システム依存パッケージ（各OSごとに異なります）

Rustのインストール

TauriのバックエンドはRustで書かれていますが、自分でRustコードを書かなくてもアプリは作れます。とはいえビルドのためにRustは必要なので、まずはインストールしましょう：

curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh
source ~/.cargo/env
rustc --version  # 確認

macOSならbrew install rustupでもOKです。Windowsの場合はrustup.rsからインストーラをダウンロードして実行します。

Tauri CLIのインストール

プロジェクトのルートで以下のコマンドを実行します：

# グローバルにインストール（おすすめ）
npm install -g @tauri-apps/cli@latest

# またはプロジェクトローカル
npm install --save-dev @tauri-apps/cli@latest

バージョン確認：

tauri --version
# 例: tauri-cli 2.5.0
ConoHa VPS

広告

ConoHa VPS

月額880円から使える国産VPS。開発環境やCIにも

最大880円相当

詳しく見る →

最初のTauriアプリを作る

プロジェクト作成

Tauriにはおなじみのcreate-tauri-appスキャフォールディングツールがあります。フロントエンドのフレームワークも一緒に選べます：

npm create tauri-app@latest

# プロジェクト名を入力: my-desktop-app
# フロントエンド選択:
#   - Vanilla（素のHTML/CSS/JS）
#   - React + Vite
#   - Vue + Vite
#   - Svelte + Vite
#   - Next.js
#  → 今回は React + Vite / TypeScript を選択

これだけで、フロントエンド（React）+ バックエンド（Rust）のTauriプロジェクトが生成されます。出来上がったディレクトリ構成はこんな感じ：

my-desktop-app/
├── src/                 # フロントエンド（React）
│   ├── App.tsx
│   ├── App.css
│   ├── main.tsx
│   └── assets/
├── src-tauri/           # バックエンド（Rust）
│   ├── src/
│   │   └── lib.rs       # Rustエントリポイント
│   ├── Cargo.toml       # Rust依存関係
│   ├── tauri.conf.json  # Tauri設定
│   ├── capabilities/    # 権限設定
│   ├── icons/           # アプリアイコン
│   └── build.rs
├── package.json
├── tsconfig.json
├── vite.config.ts
└── index.html

開発サーバーを起動

cd my-desktop-app
npm run tauri dev

これでデスクトップアプリのウィンドウが開き、Reactの開発サーバーがバックエンドと連携します。コードを変更すると、ホットリロードで即座に反映されるので快適です。

React / Vue / Svelteのどれを使っても開発体験は同じ。フロントエンドはViteで動いているので、普段のWeb開発とまったく同じ感覚でUIを作れます。

Rustのコマンドをフロントエンドから呼び出す

Tauriの真価は、フロントエンド（JavaScript）からRustの関数を呼び出せる点です。以下の流れで実装します。

1. Rust側でコマンドを定義（src-tauri/src/lib.rs）：

use tauri::Manager;

#[tauri::command]
fn greet(name: &str) -> String {
    format!("こんにちは、{}さん！Tauriへようこそ", name)
}

#[tauri::command]
fn get_system_info() -> serde_json::Value {
    let os = std::env::consts::OS;
    let arch = std::env::consts::ARCH;
    serde_json::json!({
        "os": os,
        "arch": arch,
        "hostname": hostname::get().unwrap().to_string_lossy(),
    })
}

pub fn run() {
    tauri::Builder::default()
        .invoke_handler(tauri::generate_handler![greet, get_system_info])
        .run(tauri::generate_context!())
        .expect("error while running tauri application");
}

2. フロントエンドから呼び出す（src/App.tsx）：

import { invoke } from '@tauri-apps/api/core';
import { useState } from 'react';

function App() {
  const [greeting, setGreeting] = useState('');
  const [sysInfo, setSysInfo] = useState(null);

  const handleGreet = async () => {
    const result = await invoke('greet', { name: 'Taro' });
    setGreeting(result);
  };

  const handleSysInfo = async () => {
    const info = await invoke('get_system_info');
    setSysInfo(info);
  };

  return (
    <div>
      <h1>Tauri + React</h1>
      <button onClick={handleGreet}>挨拶</button>
      <p>{greeting}</p>
      <button onClick={handleSysInfo}>システム情報</button>
      {sysInfo && <pre>{JSON.stringify(sysInfo, null, 2)}</pre>}
    </div>
  );
}

ポイントはinvoke('コマンド名', { 引数 })というシンプルな呼び出し方です。RustとJavaScriptの間の型変換はTauriが自動で行ってくれます。@tauri-apps/apiパッケージがこの橋渡しを担当します。

実用的なTauriアプリを作る

プラグインを使ってみよう

Tauri v2のプラグインシステムは非常に充実しています。ここでは代表的なプラグインを使った実装例を紹介します。

ファイル保存機能（dialog + fs プラグイン）

まずプラグインをインストール：

# npm（フロントエンド用のAPI）
npm install @tauri-apps/plugin-dialog @tauri-apps/plugin-fs

# Cargo（Rust側のプラグイン）
cd src-tauri
cargo add tauri-plugin-dialog tauri-plugin-fs
cd ..

Rust側でプラグインを登録（lib.rs）：

pub fn run() {
    tauri::Builder::default()
        .plugin(tauri_plugin_dialog::init())
        .plugin(tauri_plugin_fs::init())
        .invoke_handler(tauri::generate_handler![greet, get_system_info])
        .run(tauri::generate_context!())
        .expect("error while running tauri application");
}

フロントエンドでファイルを保存する例：

import { save } from '@tauri-apps/plugin-dialog';
import { writeTextFile } from '@tauri-apps/plugin-fs';

async function saveMarkdown(content: string) {
  const filePath = await save({
    filters: [{ name: 'Markdown', extensions: ['md'] }],
    defaultPath: 'note.md',
  });

  if (filePath) {
    await writeTextFile(filePath, content);
  }
}

たったこれだけで、OSネイティブの「名前を付けて保存」ダイアログを表示し、ファイルに書き込めます。Electronのように大量のNode.jsコードを書く必要はありません。

システムトレイに常駐するアプリ

Tauri v2ではシステムトレイ（メニューバー）機能も標準サポートされています。常駐型のツールアプリに最適です：

pub fn run() {
    tauri::Builder::default()
        .plugin(tauri_plugin_dialog::init())
        .setup(|app| {
            // システムトレイアイコンを設定
            let tray = app.tray_by_id("main").unwrap();
            tray.set_menu(
                tauri::menu::MenuBuilder::new(app)
                    .item(&tauri::menu::MenuItemBuilder::with_id("show", "表示").build(app)?)
                    .item(&tauri::menu::MenuItemBuilder::with_id("quit", "終了").build(app)?)
                    .build()?
            )?;
            Ok(())
        })
        .on_menu_event(|app, event| {
            match event.id().as_ref() {
                "quit" => app.exit(0),
                "show" => {
                    if let Some(window) = app.get_webview_window("main") {
                        window.show().unwrap();
                    }
                }
                _ => {}
            }
        })
        .run(tauri::generate_context!())
        .expect("error running app");
}

これでアプリを閉じてもトレイに常駐し、「表示」でウィンドウを再度開けるようになります。バックグラウンドで情報を監視するツールや、クイックメモアプリなどを作るのに便利です。

Tauriアプリのビルドと配布

アプリのビルド

npm run tauri build

これだけで、以下のような成果物が src-tauri/target/release/bundle/ に生成されます：

  • macOS: .dmg + .app
  • Windows: .msi または .exe
  • Linux: .deb / .AppImage / .rpm

コード署名（macOSのNotarization、WindowsのAuthenticode）もtauri.conf.jsonに設定を書けば自動化できます。

アプリのアイコン設定

アイコンはsrc-tauri/icons/配下に配置します。CLIコマンドで一括生成可能：

npm run tauri icon path/to/icon.png

1024x1024のPNGを用意すれば、各OS向けのアイコンフォーマット（.icns / .ico / .png各種サイズ）を自動生成してくれます。

実践的なユースケース：個人開発でTauriを使う場面

① 開発用のちょっとしたツール

たとえば、以下のような用途にTauriが最適です：

  • ログビューア — リアルタイムにログファイルを監視し、色分けして表示
  • APIテストクライアント — curlのGUI版のようなもの
  • パスワード管理ツール — ローカルファイルに暗号化保存
  • 画像リサイズ・一括変換ツール — ファイルシステムと画像処理ライブラリの組み合わせ

これらはWebアプリでも作れますが、ローカルファイルにアクセスする必要がある場合はTauriの方が圧倒的に便利です。ワンクリックで起動し、ブラウザの制約（CORS、ファイルAPIの制限など）を気にしなくて済みます。

② 個人開発SaaSのデスクトップクライアント

自分が作ったWebサービス（SaaS）のデスクトップクライアントをTauriで作るのも良いアイデアです。フロントエンドはWeb版と共通にできるので、工数は最小限。OSネイティブの通知やシステムトレイ常駐といった機能を追加して、ユーザー体験を向上させられます。

③ オープンソースツールの配布

CLIツールにGUIをかぶせたい場合もTauriは便利です。バックエンドのRustでロジックを書き、フロントエンドで設定画面を提供する——いわゆる「薄いラッパー」を数時間で作れます。

🦀 Tauriでデスクトップアプリ開発を始めよう

Tauri v2は、個人開発者にとって非常に扱いやすいデスクトップアプリフレームワークです。Webの知識を活かしながら、軽量で高速なネイティブアプリを提供できます。

開発環境を整えるならVPSの活用も検討してみてください。またAIコード生成と組み合わせたい方は、Vibe Codingガイドも併せてどうぞ。

よくあるハマりポイントと解決策

「ビルド時にエラーが多発する」

Rustのビルドは初回が最も時間がかかります（依存関係のダウンロードとコンパイル）。時間にして5〜15分程度かかることも。慌てずに待ちましょう。2回目以降は差分だけのビルドなので高速です。

また、macOSでHomebrew経由でインストールしたライブラリが競合することがあります。brew install tauriではなく、npmのCLIを使う方がトラブルが少ないです。

「フロントエンドからinvokeが動かない」

よくある原因は権限設定の不足です。Tauri v2ではセキュリティ強化のため、capabilitiesディレクトリで明示的に許可する必要があります。src-tauri/capabilities/default.jsonを確認してください：

{
  "identifier": "default",
  "description": "デフォルトの権限設定",
  "windows": ["main"],
  "permissions": [
    "core:default",
    "dialog:default",
    "fs:default",
    "shell:default"
  ]
}

カスタムコマンド（#[tauri::command]）はデフォルトで許可されていますが、プラグインを使う場合は上記のように明示的にpermissionを追加する必要があります。

「LinuxでWebViewが開かない」

Ubuntu/Debian系のディストリビューションでは、WebKit2GTKのインストールが必要です：

sudo apt install libwebkit2gtk-4.1-dev libgtk-3-dev libayatana-appindicator3-dev

まとめ：Tauri v2は個人開発者の新たな武器になる

Tauri v2は、Electronの「重い」「大きい」という課題を解決するだけでなく、セキュリティの高さやモバイル対応、そしてプラグインエコシステムの充実により、2026年現在、デスクトップアプリ開発の第一選択肢と言えます。

個人開発者にとって最大の魅力は、次の3点です：

  • Webのスキルがそのまま使える — React、Vue、Svelteの知識が活きる
  • 配布が軽量 — 数MBのインストーラでユーザーに届けられる
  • オープンソース — ライセンス料ゼロで商用利用も可能

まずはnpm create tauri-app@latestを叩いて、今日からデスクトップアプリ開発を始めてみませんか？Rustの知識はあとからついてきます。最初の一歩は思っているよりずっと簡単です。