texinroistot-sveltekit-frontend

Standardize SvelteKit frontend maintenance with validation workflows for pages, loaders, and API routes.

Updated Nov 5, 2023
One-click install
npx skills add https://github.com/kokkoniemi/texinroistot --skill texinroistot-sveltekit-frontend
Or copy as Structured Prompt for Agentβ–Ό
Please help me install this Agent Skill.
Skill: texinroistot-sveltekit-frontend
Source: https://github.com/kokkoniemi/texinroistot/tree/main/.codex/skills/texinroistot-sveltekit-frontend
Command: npx skills add https://github.com/kokkoniemi/texinroistot --skill texinroistot-sveltekit-frontend

SYSTEM DOCUMENTATION & REQUIREMENTS

πŸ’‘ This Skill includes references (resource) components.

What problem does it solve?

texinroistot-ui frontend tends to drift without a standard workflow; this skill provides guardrails, patterns, and a repeatable process to keep SvelteKit pages, loaders, and API routes aligned with project conventions.

Core Features & Use Cases

  • Enforce standard project structure and naming conventions for SvelteKit assets, routes, and API handlers.
  • Provide a repeatable validation workflow including checks, linting, and building the frontend before merging or deployment.
  • Use in scenarios such as adding a new route, updating +page.ts or +server.ts, or adjusting UI components across the tarinat/roistot sections.

Quick Start

Navigate to texinroistot-ui and run the standard validation sequence: npm run check, npm run lint, then npm run build.

Frequently Asked Questions about texinroistot-sveltekit-frontend

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

FAQPage Schema
How do I maintain SvelteKit routes and prevent frontend UI drift?β–Ό

To maintain SvelteKit routes and prevent frontend drift, apply standardized guardrails for editing Svelte pages, +page.ts loaders, and +server.ts API routes, ensuring consistent route structure and API wiring alignment with the backend.

What is the standard validation workflow for a SvelteKit frontend build?β–Ό

The standard SvelteKit frontend validation workflow involves running three commands sequentially: npm run check for type checking, npm run lint for code quality, and npm run build to verify the frontend compiles successfully before merging or deployment.

How do I add a new API route in SvelteKit using +server.ts files?β–Ό

Adding a new API route in SvelteKit using +server.ts files requires following standard project naming conventions to ensure the API wiring aligns with the backend, keeping route structure consistent across stories and villains sections.

Can I use standard linting and checks for SvelteKit +page.ts loaders?β–Ό

Yes, you can use standard linting and checks for SvelteKit +page.ts loaders by executing the npm run check and npm run lint commands, which enforce project conventions and validate the frontend code before integration.

Why does my SvelteKit frontend drift without a standard workflow?β–Ό

Your SvelteKit frontend drifts without a standard workflow because pages, loaders, and API routes lack enforced structural guardrails, leading to inconsistent route patterns and API wiring that diverge from project conventions.