create-tauri-app로 0에서 시작

"프레임워크를 제일 빨리 아는 법은, 돌아가는 앱을 만들어내게 시키고 걔가 뱉은 걸 읽는 거야."

명령 하나면 앱이 돌아

create-tauri-app이 공식 스캐폴더야. 몇 가지를 물어봐 — 앱 이름, 프론트엔드 프레임워크(vanilla, React, Vue, Svelte, Solid, Angular…), 패키지 매니저 — 그러고 나면 이미 빌드까지 되고 실행도 되는 프로젝트를 내놔. 잘 풀리면 손으로 엮을 게 하나도 없어. 프론트엔드랑 Rust 코어랑 설정이 나오고, 창까지 열려.

이미 프론트엔드가 있다고? 처음부터 다시 안 해도 돼. tauri init이 기존 웹 프로젝트에 src-tauri/ 반쪽을 얹어주니까, 지금 아끼는 React 앱에 Tauri를 붙일 수 있어. 어느 쪽이든 Foundations 트랙에서 잡은 멘탈 모델이 이제 직접 열어볼 수 있는 폴더가 됐어.

다들 건너뛰는 전제조건

Tauri는 진짜 네이티브 코드를 컴파일하니까 Rust 툴체인(rustup으로 설치)이랑 플랫폼별 빌드 의존성이 있어야 해. macOS는 Xcode Command Line Tools, Windows는 WebView2랑 MSVC 빌드 도구, Linux는 WebKitGTK랑 시스템 라이브러리 몇 개. 공식 Prerequisites 페이지가 OS별로 정확한 패키지를 적어놨어 — 한 번만 해두면 첫 빌드가 그냥 돼. 이걸 건너뛰는 게 첫 tauri dev가 에러 나는 1번 이유야.

첫 실행이 느린 건 정상이야

첫 npm run tauri dev는 Rust 의존성 트리를 통째로 컴파일하니까 몇 분 걸릴 수 있어. 그건 한 번만 내는 값이고, 다음부턴 바뀐 것만 다시 빌드해서 빨라. 첫 빌드가 CPU를 갈아넣어도 놀라지 마 — JavaScript 번들링이 아니라 진짜 네이티브 바이너리를 만드는 중이니까.

Code

스캐폴딩하고 돌리기·bash

# 새 Tauri 2 앱 스캐폴딩 — 쓰는 패키지 매니저로 골라.
npm create tauri-app@latest
# pnpm create tauri-app
# yarn create tauri-app
# bun create tauri-app
# Rust: cargo install create-tauri-app && cargo create-tauri-app

cd my-app
npm install
npm run tauri dev   # 첫 실행은 Rust 컴파일 — 커피 한 잔, 그 다음부턴 빨라

tauri init — 이미 있는 것 위에 얹기·bash

# 새로 시작하는 대신 '기존' 웹 앱에 Tauri 더하기:
npm install -D @tauri-apps/cli@latest
npx tauri init    # 대화형: 앱 이름, 창 제목, frontendDist, devUrl
# 이제 기존 프론트엔드 옆에 src-tauri/가 생겼어.

Exercise

직접 하나 스캐폴딩해. create-tauri-app 돌리고, React + TypeScript 템플릿 고르고, 설치하고, npm run tauri dev로 창을 열어. 열리면 프론트엔드를 한 줄 고쳐서 네이티브 창 안에서 핫리로드되는 걸 봐. 이제 이 퀘스트 내내 굴려볼 진짜 Tauri 앱이 생긴 거야.

Hint

첫 빌드가 에러 나면 십중팔구 전제조건이 빠진 거야 — 네 OS의 Prerequisites 페이지를 다시 봐(macOS는 Xcode CLT, Windows는 WebView2/MSVC, Linux는 webkit2gtk). 에러 메시지가 보통 뭐가 없는지 짚어줘.