Prerequisites

Before you can develop DesQTA, you need to install the following tools:

Required Tools

1. Node.js (v18 or higher)
   • Download from nodejs.org
   • Verify: node --version
2. pnpm (Package Manager)
   npm install -g pnpm
   

   • Verify: pnpm --version
3. Rust (Latest stable)
   • Install from rustup.rs
   • Verify: rustc --version and cargo --version
4. Git
   • Download from git-scm.com
   • Verify: git --version

Platform-Specific Requirements

Windows

• Visual Studio Build Tools or Visual Studio Community
  • Required for compiling Rust code
  • Install "Desktop development with C++" workload

macOS

• Xcode Command Line Tools
  xcode-select --install
  

Linux

• Build Essentials
  # Ubuntu/Debian
  sudo apt-get update
  sudo apt-get install build-essential libwebkit2gtk-4.0-dev libssl-dev libayatana-appindicator3-dev librsvg2-dev
  

Fedora

sudo dnf install webkit2gtk3-devel.x86_64 openssl-devel libappindicator librsvg2-devel

## Cloning the Repository

### Get the Source Code

```bash
git clone --branch develop https://github.com/betterseqta/desqta
cd desqta

Note: Always use the develop branch for development. The main branch is for stable releases.

Installing Dependencies

Frontend Dependencies

pnpm install

This installs all Node.js dependencies including:

• SvelteKit and Svelte
• TypeScript and type definitions
• TailwindCSS and plugins
• Tauri API bindings
• All other frontend libraries

Backend Dependencies

Rust dependencies are managed by Cargo and install automatically when you build:

cd src-tauri
cargo build

Or they'll install when you run the dev server.

Development Server

Quick Start

The easiest way to start developing:

npm run start

This command:

1. Installs dependencies (if needed)
2. Starts the Tauri dev server
3. Opens the app window
4. Enables hot reload

Manual Start

If you prefer to run commands separately:

# Install dependencies
pnpm install

# Start dev server
npm run tauri dev

Frontend Only (Web)

To run just the frontend without Tauri:

npm run dev

Note: Some features won't work without Tauri backend (file system, native APIs, etc.)

Development Environment

IDE Setup

Recommended: VS Code

1. Install VS Code extensions:
   • Svelte for VS Code: Svelte language support
   • rust-analyzer: Rust language support
   • Tailwind CSS IntelliSense: Tailwind autocomplete
   • TypeScript and JavaScript: Built-in
   • Prettier: Code formatting
   • ESLint: Code linting
2. VS Code Settings:
   {
     "editor.formatOnSave": true,
     "editor.defaultFormatter": "esbenp.prettier-vscode",
     "[svelte]": {
       "editor.defaultFormatter": "svelte.svelte-vscode"
     },
     "[rust]": {
       "editor.defaultFormatter": "rust-lang.rust-analyzer"
     }
   }
   

Building for Production

Frontend Build

npm run build

Outputs to build/ directory.

Desktop App Build

npm run tauri build

Creates installers in src-tauri/target/release/:

• Windows: .exe installer
• macOS: .dmg file
• Linux: .AppImage or .deb package

Build Configuration

Tauri configuration is in src-tauri/tauri.conf.json:

{
  "build": {
    "beforeDevCommand": "npm run dev",
    "beforeBuildCommand": "npm run build",
    "devPath": "http://localhost:1420",
    "distDir": "../build"
  },
  "package": {
    "productName": "DesQTA",
    "version": "1.0.0"
  }
}

Debugging

Frontend Debugging

1. Browser DevTools: Available in dev mode
   • Right-click → Inspect
   • Or use Tauri devtools command
2. VS Code Debugging: Configure launch.json
   {
     "type": "node",
     "request": "launch",
     "name": "Debug Svelte",
     "runtimeExecutable": "npm",
     "runtimeArgs": ["run", "dev"]
   }
   

3. Console Logging: Use console.log() or the logger utility
   import { logger } from '$lib/utils/logger';
   logger.info('context', 'function', 'message');
   

Backend Debugging

1. Rust Debugger: Use VS Code with rust-analyzer
   • Set breakpoints in Rust code
   • Use "Debug" launch configuration
2. Logging: Use Rust's log crate
   use log::{info, warn, error};
   info!("Debug message");
   

3. Tauri Devtools: Enable in dev mode
   // In lib.rs
   #[cfg(debug_assertions)]
   window.open_devtools();
   

Common Issues

Port Already in Use

If port 1420 is already in use:

# Find process using port
lsof -i :1420  # macOS/Linux
netstat -ano | findstr :1420  # Windows

# Kill process or change port in tauri.conf.json

Rust Compilation Errors

1. Update Rust:
   rustup update
   

2. Clean Build:
   cd src-tauri
   cargo clean
   cargo build
   

Node Modules Issues

1. Clear Cache:
   rm -rf node_modules pnpm-lock.yaml
   pnpm install
   

2. Update pnpm:
   npm install -g pnpm@latest
   

Tauri Not Found

If Tauri CLI is missing:

npm install -g @tauri-apps/cli
# or use npx
npx @tauri-apps/cli dev

Development Tips

Hot Reload

• Frontend changes reload automatically
• Backend changes require restart
• Use npm run tauri dev for full hot reload

Type Checking

Run TypeScript type checking:

npm run check

Code Formatting

Format code automatically:

npm run format

Linting

Check code quality:

npm run lint

Fix issues automatically:

npm run lint:fix

Next Steps

Now that you're set up:

1. Architecture Overview - Understand the system
2. Frontend Development - Learn SvelteKit
3. Backend Development - Learn Rust/Tauri
4. Adding Features - Start coding