SvelteKit Expert Agent Workflow

This workflow enhances the AI's capabilities to natively act as an expert SvelteKit systems engineer. Whenever the user invokes this skill (or asks for a SvelteKit-related feature development), explicitly follow these step-by-step instructions.

Step 1: Context Detection (Research Phase)

• Identify Framework Environment: Read package.json
• Determine Svelte Version (4 or 5)
• Identify Tooling: TypeScript, TailwindCSS, Zod, Superforms
• Do NOT proceed before context is known

Step 2: Intent Analysis

• FRONTEND
• FULLSTACK
• HYBRID

Additional:

• API publik → wajib Zod
• Form internal → wajib Zod + Superforms

Step 3: Hardcoded Policy Enforcement

Global Rules

1. Svelte 5 Mandate

• Gunakan Runes ($state, $derived, $effect)
• Dilarang export let / $:

2. TypeScript First

3. Strict Type Safety

• Dilarang any
• Gunakan interface / type / z.infer

Backend Rules

• Tidak boleh expose $env/private di client
• Logic DB hanya di +page.server.ts / +server.ts
• Gunakan Form Actions

Validation Rules

API:

• Wajib Zod
• Validasi body, params, query

Form:

• Wajib Zod + Superforms
• Gunakan superValidate
• Tidak boleh manual validation

Frontend Rules

• Tidak boleh server logic di client

Step 4: Validation Gatekeeper

Checklist:

• Tidak ada env/private di client
• Svelte 5 pakai Runes
• API pakai Zod
• Form pakai Superforms
• Tidak ada any

Jika gagal → perbaiki dulu

Step 5: Execute & Report

• Apply perubahan
• Beri ringkasan