Tauri + React + TypeScript Template

A production-ready template for building cross-platform desktop applications with Tauri 2, React 18, and TypeScript. Includes Tailwind CSS with light/dark theming, automated CI/CD releases, and macOS code signing out of the box.

Tech Stack

Layer	Technology
Frontend	React 18, TypeScript 5.6, Vite 6
Styling	Tailwind CSS 4
Backend	Rust, Tauri 2
Package	pnpm
CI/CD	GitHub Actions (multi-platform)

Prerequisites

• Node.js (LTS)
• pnpm v9+
• Rust (stable)
• Platform-specific Tauri dependencies — see the Tauri prerequisites guide

Getting Started

# Install dependencies
pnpm install

# Start the development app
pnpm tauri dev

# Build for production
pnpm tauri build

Project Structure

├── src/                  # React frontend
│   ├── App.tsx           # Root component
│   ├── App.css           # Tailwind entry
│   └── main.tsx          # React entry point
├── src-tauri/            # Rust backend
│   ├── src/
│   │   ├── lib.rs        # Tauri commands & plugin setup
│   │   └── main.rs       # Application entry point
│   ├── capabilities/     # Tauri permission capabilities
│   ├── icons/            # App icons (all platforms)
│   ├── Cargo.toml        # Rust dependencies
│   └── tauri.conf.json   # Tauri configuration
├── scripts/
│   └── bump-version.sh   # Version management utility
├── .github/workflows/
│   └── release.yml       # CI/CD release pipeline
├── index.html            # HTML entry point
├── vite.config.ts        # Vite configuration
└── package.json

Features

Light / Dark Theme

System theme preference is detected automatically and applied via Tailwind's class-based dark mode. Use dark: variants in your components:

<h1 className="text-zinc-600 dark:text-zinc-400">Hello</h1>

Tauri Commands

Call Rust functions from the frontend via Tauri's command system. A greet command is included as an example in src-tauri/src/lib.rs.

Version Management

The included bump-version.sh script updates the version across package.json, Cargo.toml, and tauri.conf.json in a single step:

./scripts/bump-version.sh patch          # 0.1.0 -> 0.1.1
./scripts/bump-version.sh minor          # 0.1.0 -> 0.2.0
./scripts/bump-version.sh major          # 0.1.0 -> 1.0.0
./scripts/bump-version.sh 2.0.0          # Set explicit version
./scripts/bump-version.sh patch --tag    # Bump, commit, and create git tag

CI/CD & Releases

The GitHub Actions workflow in .github/workflows/release.yml builds and publishes releases for macOS (universal binary), Linux, and Windows when a version tag is pushed:

./scripts/bump-version.sh patch --tag
git push && git push --tags

macOS Code Signing & Notarization

The release workflow handles code signing with a Developer ID certificate and notarization via the App Store Connect API. Configure these repository secrets:

Secret	Description
MACOS_CERT_P12	Base64-encoded .p12 signing certificate
MACOS_CERT_PASSWORD	Certificate password
MACOS_KEYCHAIN_PASSWORD	Temporary keychain password
APPLE_API_KEY_P8	Base64-encoded App Store Connect API key
APPLE_API_KEY	API key ID
APPLE_API_ISSUER	API issuer ID

Customizing the Template

When using this template for a new project, update the following:

1. App name & identifier — productName and identifier in src-tauri/tauri.conf.json
2. Package name — name in package.json and src-tauri/Cargo.toml
3. App icons — Replace icons in src-tauri/icons/ (use pnpm tauri icon <source.png>)
4. Signing identity — Update macOS.signingIdentity in src-tauri/tauri.conf.json
5. Window config — Adjust title, width, height in src-tauri/tauri.conf.json

License

MIT