Toolverse
All skills
Frontend

admin-crud-page

by svelte-society

Create admin dashboard pages with tables, forms, and actions

Installation

Pick a client and clone the repository into its skills directory.

Installation

Quick info

Author
svelte-society
Category
Frontend
Views
2
GitHub repo

About this skill

Create admin dashboard pages with tables, forms, and actions

How to use

  1. Umieść skill w katalogu .claude/skills/ swojego projektu Svelte. Skill zawiera szablon struktury katalogów dla tras administracyjnych — skopiuj go do src/routes/(admin)/admin/[feature]/.

  2. Utwórz plik +page.svelte dla strony listy, która będzie wyświetlać tabelę z danymi. Użyj komponentu AdminList jako wrapper i Table do renderowania wierszy. Komponenty znajdują się w $lib/ui/admin/.

  3. Stwórz plik data.remote.ts w tym samym katalogu — tutaj umieść całą logikę serwerową, funkcje pobierania danych i mutacje. Skill wymaga używania Remote Functions zamiast +page.server.ts lub SvelteKit form actions.

  4. Dla strony edycji utwórz [id]/+page.svelte, a dla tworzenia nowych wpisów opcjonalnie new/+page.svelte. Oba pliki powinny importować komponenty z $lib/ui/admin/, takie jak PageHeader do nagłówka strony.

  5. Dodaj filtry do listy, jeśli potrzebujesz — skill zawiera komponenty StatusSelect i TypeSelect do filtrowania danych po statusie lub typie zawartości.

  6. Pamiętaj, że wszystkie operacje danych (ładowanie, obsługa formularzy, zmiany) muszą przechodzić przez Remote Functions — nigdy nie używaj +page.server.ts ani +server.ts w tym projekcie.

Related skills

frontend-slides

by sickn33

Create stunning, animation-rich HTML presentations from scratch or by converting PowerPoint files. Use when the user wants to build a presentation, convert a PPT/PPTX to web, or create slides for a talk/pitch. Helps non-designers discover their aesthetic through visual

Frontend
65135

brainstorming

by obra

Use when creating or developing, before writing code or implementation plans - refines rough ideas into fully-formed designs through collaborative questioning, alternative exploration, and incremental validation. Don't use during clear 'mechanical' processes

Frontend
49170

theme-factory

by anthropics

Toolkit for styling artifacts with a theme. These artifacts can be slides, docs, reportings, HTML landing pages, etc. There are 10 pre-set themes with colors/fonts that you can apply to any artifact that has been creating, or can generate a new theme on-the-fly.

Frontend
40139

screenshot-to-code

by OneWave-AI

Convert UI screenshots into working HTML/CSS/React/Vue code. Detects design patterns, components, and generates responsive layouts. Use this when users provide screenshots of websites, apps, or UI designs and want code implementation.

Frontend
94209

livewire-development

by spatie

Develops reactive Livewire 4 components. Activates when creating, updating, or modifying Livewire components; working with wire:model, wire:click, wire:loading, or any wire: directives; adding real-time updates, loading states, or reactivity; debugging component behavior;

Frontend
2335

react

by lobehub

React component development guide. Use when working with React components (.tsx files), creating UI, using @lobehub/ui components, implementing routing, or building frontend features. Triggers on React component creation, modification, layout implementation, or navigation tasks.

Frontend
2058