Tauri 2.0 실전 가이드 — Electron 대안, Rust 기반 크로스플랫폼 데스크톱 앱 개발

사전 요구사항 설치
# 1) Rust 설치 (rustup 사용)
curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh
source ~/.cargo/env

# macOS 추가 의존성
xcode-select --install

# Ubuntu/Debian 추가 의존성
sudo apt update
sudo apt install libwebkit2gtk-4.1-dev \
  build-essential curl wget file libxdo-dev \
  libssl-dev libayatana-appindicator3-dev librsvg2-dev

Tauri 2.0 프로젝트 생성
# create-tauri-app 사용 (React + TypeScript 예시)
npm create tauri-app@latest my-tauri-app
# 선택지: Framework = React, Language = TypeScript

cd my-tauri-app
npm install

# 개발 모드 실행 (첫 실행 시 Rust 컴파일로 2~3분 소요)
npm run tauri dev

# 빌드 (배포용)
npm run tauri build

Rust 커맨드 작성 (src-tauri/src/lib.rs)
use tauri::command;

#[command]
fn greet(name: &str) -> String {
    format!("Hello, {}!", name)
}

#[command]
async fn read_file(path: String) -> Result<String, String> {
    std::fs::read_to_string(&path)
        .map_err(|e| e.to_string())
}

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

프론트엔드에서 Rust 커맨드 호출 (React/TypeScript)
import { invoke } from '@tauri-apps/api/core';

// 동기 커맨드 호출
async function greetUser() {
  const message = await invoke<string>('greet', { name: 'Developer' });
  console.log(message); // "Hello, Developer!"
}

// 비동기 파일 읽기
async function loadConfig() {
  try {
    const content = await invoke<string>('read_file', {
      path: '/path/to/config.json'
    });
    return JSON.parse(content);
  } catch (err) {
    console.error('파일 읽기 실패:', err);
  }
}

// React 컴포넌트에서 사용
function App() {
  const [greeting, setGreeting] = useState('');

  return (
    <button onClick={async () => {
      const msg = await invoke<string>('greet', { name: 'World' });
      setGreeting(msg);
    }}>
      {greeting || '클릭하세요'}
    </button>
  );
}

src-tauri/capabilities/default.json
{
  "$schema": "../gen/schemas/desktop-schema.json",
  "identifier": "default",
  "description": "기본 앱 권한 설정",
  "windows": ["main"],
  "permissions": [
    "core:default",
    "shell:allow-open",
    "dialog:allow-open",
    "dialog:allow-save",
    "fs:allow-read-text-file",
    "fs:allow-write-text-file",
    "notification:default"
  ]
}

Android/iOS 빌드 (사전에 Android Studio / Xcode 필요)
# Android 개발 환경 초기화
npm run tauri android init

# Android 개발 모드
npm run tauri android dev

# iOS 개발 모드 (macOS만 가능)
npm run tauri ios dev

# Android 릴리즈 빌드
npm run tauri android build