skills.rest
hi-yuki-922
hi-yuki-922COMMUNITY
Explore all skills by this author →
WebsiteGitHub

frontend-dev-guide

Guide frontend development for Tauri and React 19 desktop applications.

1|Updated Jan 15, 2026
Search Tags:#typescript#best practices#frontend#react#guidelines#tauri
One-click install
npx skills add https://github.com/hi-yuki-922/accounting-assistant --skill frontend-dev-guide
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: frontend-dev-guide
Source: https://github.com/hi-yuki-922/accounting-assistant/tree/main/.claude/skills/frontend-dev-guide
Command: npx skills add https://github.com/hi-yuki-922/accounting-assistant --skill frontend-dev-guide

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill provides comprehensive guidance and best practices for developing the frontend of Tauri + React 19 desktop applications, ensuring code quality, maintainability, and adherence to project standards.

Core Features & Use Cases

  • Error Handling: Implements Rust Result-style error handling using neverthrow.
  • Component Development: Standardizes component structure, props interfaces, and styling.
  • Styling: Guides the use of Tailwind CSS, shadcn/ui, and CSS variables for consistent theming.
  • Routing & State Management: Details file-based routing with @tanstack/react-router and React Hooks for state.
  • Data Visualization: Recommends @unovis/react for charting.
  • Use Case: When creating a new feature, consult this guide for the correct way to structure components, handle API errors, and apply styles.

Quick Start

Refer to this guide for instructions on creating a new React component for your Tauri application.

Frequently Asked Questions about frontend-dev-guide

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I handle API errors in a Tauri and React 19 application?▼

Structure React 19 components by standardizing their structure, props interfaces, and styling. This guide enforces strict TypeScript usage and consistent component development patterns for Tauri desktop applications.

What's the best way to style a Tauri React desktop application?▼

The best way to style a Tauri React desktop application is using Tailwind CSS combined with shadcn/ui. This guide recommends utilizing CSS variables within these tools to achieve consistent theming across your components.

Does this frontend guide support file-based routing and state management?▼

Yes, this frontend guide supports file-based routing and state management. It details using @tanstack/react-router for file-based routing and standard React Hooks for managing application state within your Tauri desktop app.

Can I use this guide for data visualization in my Tauri desktop app?▼

Yes, you can use this guide for data visualization in your Tauri desktop app. It specifically recommends utilizing the @unovis/react library to handle charting and data visualization tasks within your React 19 frontend.

Why use strict TypeScript and Result-based error handling for frontend development?▼

Strict TypeScript and Result-based error handling ensure code quality and maintainability for frontend development. Enforcing these patterns prevents runtime errors and facilitates effective code reviews and technical decision-making.

Related Skills

Explore More Software Engineering Skills→
tlswhdghks42tlswhdghks42

nextjs-frontend-guidelines

Provide Next.js 15 frontend guidelines covering React 19, TypeScript, App Router, shadcn/ui, and Tailwind CSS 4 for the YGS project.

Community
Advanced
brenordvbrenordv

reactjs

Standardize React 19+ development with strict TypeScript patterns and component composition.

Community
Advanced
jameinghjameingh
2

tauri-architecture

Outline Tauri architecture with Rust backend and React + TypeScript frontend.

Community
Advanced
jhouserjhouser

frontend-dev-guidelines

Provide frontend development guidelines for React/TypeScript applications using Suspense, TanStack Query, and Tailwind CSS.

Community
Intermediate