tauri-development

Tauri development guidelines for building cross-platform desktop applications with TypeScript, Rust, and modern web technologies

16 stars

Best use case

tauri-development is best used when you need a repeatable AI agent workflow instead of a one-off prompt.

Tauri development guidelines for building cross-platform desktop applications with TypeScript, Rust, and modern web technologies

Teams using tauri-development should expect a more consistent output, faster repeated execution, less prompt rewriting.

When to use this skill

  • You want a reusable workflow that can be run more than once with consistent structure.

When not to use this skill

  • You only need a quick one-off answer and do not need a reusable workflow.
  • You cannot install or maintain the underlying files, dependencies, or repository context.

Installation

Claude Code / Cursor / Codex

$curl -o ~/.claude/skills/tauri-development/SKILL.md --create-dirs "https://raw.githubusercontent.com/diegosouzapw/awesome-omni-skill/main/skills/development/tauri-development/SKILL.md"

Manual Installation

  1. Download SKILL.md from GitHub
  2. Place it in .claude/skills/tauri-development/SKILL.md inside your project
  3. Restart your AI agent — it will auto-discover the skill

How tauri-development Compares

Feature / Agenttauri-developmentStandard Approach
Platform SupportNot specifiedLimited / Varies
Context Awareness High Baseline
Installation ComplexityUnknownN/A

Frequently Asked Questions

What does this skill do?

Tauri development guidelines for building cross-platform desktop applications with TypeScript, Rust, and modern web technologies

Where can I find the source code?

You can find the source code on GitHub using the link provided at the top of the page.

SKILL.md Source

# Tauri Development Guidelines

You are an expert in TypeScript and Rust development for cross-platform desktop applications using Tauri.

## Core Principles

- Write clean, maintainable TypeScript and Rust code
- Use TailwindCSS and ShadCN-UI for styling
- Follow step-by-step planning for complex features
- Prioritize code quality, security, and performance

## Technology Stack

- **Frontend**: TypeScript, React/Next.js, TailwindCSS, ShadCN-UI
- **Backend**: Rust, Tauri APIs
- **Build**: Tauri CLI, Vite/Webpack

## Project Structure

```
src/
├── app/                # Next.js app directory
├── components/         # React components
│   ├── ui/            # ShadCN-UI components
│   └── features/      # Feature-specific components
├── hooks/             # Custom React hooks
├── lib/               # Utility functions
├── styles/            # Global styles
src-tauri/
├── src/               # Rust source code
│   ├── main.rs       # Entry point
│   └── commands/     # Tauri commands
├── Cargo.toml        # Rust dependencies
└── tauri.conf.json   # Tauri configuration
```

## TypeScript Guidelines

### Code Style
- Use functional components with TypeScript
- Define proper interfaces for all data structures
- Use async/await for asynchronous operations
- Implement proper error handling

### Tauri Integration
```typescript
import { invoke } from '@tauri-apps/api/tauri';

// Call Rust commands from frontend
const result = await invoke<string>('my_command', { arg: 'value' });

// Listen to events from Rust
import { listen } from '@tauri-apps/api/event';
await listen('event-name', (event) => {
  console.log(event.payload);
});
```

## Rust Guidelines

### Command Definitions
```rust
#[tauri::command]
fn my_command(arg: String) -> Result<String, String> {
    // Implementation
    Ok(format!("Received: {}", arg))
}

fn main() {
    tauri::Builder::default()
        .invoke_handler(tauri::generate_handler![my_command])
        .run(tauri::generate_context!())
        .expect("error while running tauri application");
}
```

### Error Handling
- Use Result types for fallible operations
- Define custom error types when needed
- Propagate errors appropriately
- Log errors for debugging

### Security
- Validate all inputs from the frontend
- Use Tauri's security features (CSP, allowlist)
- Minimize permissions in tauri.conf.json
- Sanitize file paths and user inputs

## UI Development

### TailwindCSS
- Use utility-first approach
- Implement responsive design
- Use dark mode support
- Follow consistent spacing and sizing

### ShadCN-UI Components
- Use pre-built accessible components
- Customize with TailwindCSS
- Maintain consistent theming
- Follow accessibility best practices

## State Management

- Use React Context for global state
- Consider Zustand for complex state
- Keep state close to where it's used
- Implement proper state synchronization with Rust

## File System Operations

```rust
use std::fs;
use tauri::api::path::app_data_dir;

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

#[tauri::command]
fn write_file(path: String, content: String) -> Result<(), String> {
    fs::write(&path, content)
        .map_err(|e| e.to_string())
}
```

## Building and Distribution

- Configure proper app metadata
- Set up code signing for distribution
- Use Tauri's updater for auto-updates
- Test on all target platforms

## Performance

- Minimize IPC calls between frontend and Rust
- Use batch operations where possible
- Implement proper caching
- Profile and optimize hot paths

## Testing

- Write unit tests for Rust commands
- Test frontend components
- Implement integration tests
- Test on all target platforms

Related Skills

test-driven-development

16
from diegosouzapw/awesome-omni-skill

Use when implementing any feature or bugfix, before writing implementation code

tauri2-react-rust

16
from diegosouzapw/awesome-omni-skill

Guides development of cross-platform desktop apps with Tauri 2, TypeScript, React, and Rust. Use when building Tauri apps, implementing IPC, designing Rust backend or TypeScript/React frontend, when researching or cloning a website (open site, snapshot elements), when verifying local dev or built frontend in browser, or when the user mentions Tauri, Tauri 2, Rust backend, React frontend, desktop app architecture, invoke/commands, cross-platform, 调研网站, 验证效果, agent-browser.

tauri-svelte-typescript-general

16
from diegosouzapw/awesome-omni-skill

General rules for developing desktop applications using Tauri with Svelte and TypeScript for the frontend.

spec-driven-development

16
from diegosouzapw/awesome-omni-skill

Guide for implementing Specification-Driven Development in any project using GitHub's spec-kit. Use when users want to start spec-driven development, need to initialize spec-kit in a project, or want guidance on the spec-kit workflow (constitution, specify, clarify, plan, tasks, implement). Covers installation, initialization, and step-by-step prompts for each phase.

seeksaas-development

16
from diegosouzapw/awesome-omni-skill

Complete SeekSaaS development guide covering project setup, workflows, conventions, and best practices

salesforce-development

16
from diegosouzapw/awesome-omni-skill

Expert patterns for Salesforce platform development including Lightning Web Components (LWC), Apex triggers and classes, REST/Bulk APIs, Connected Apps, and Salesforce DX with scratch orgs and 2nd ...

Report Development

16
from diegosouzapw/awesome-omni-skill

Create QWeb PDF reports and report actions in Odoo.

react-nextjs-development

16
from diegosouzapw/awesome-omni-skill

React and Next.js 14+ application development with App Router, Server Components, TypeScript, Tailwind CSS, and modern frontend patterns.

python-workflow-development

16
from diegosouzapw/awesome-omni-skill

Develop Python scripts and modules for building AI workflows and integrations. Use when coding data ingestion, transformation, analysis, and automation pipelines in pilot projects requiring Python automation.

python-development

16
from diegosouzapw/awesome-omni-skill

Modern Python development with Python 3.12+, Django, FastAPI, async patterns, and production best practices. Use for Python projects, APIs, data processing, or automation scripts.

python-development-python-scaffold

16
from diegosouzapw/awesome-omni-skill

You are a Python project architecture expert specializing in scaffolding production-ready Python applications. Generate complete project structures with modern tooling (uv, FastAPI, Django), type hint

prpm-development

16
from diegosouzapw/awesome-omni-skill

Use when developing PRPM (Prompt Package Manager) - comprehensive knowledge base covering architecture, format conversion, package types, collections, quality standards, testing, and deployment