skills.rest
1k-off
1k-offCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

umbraco-example-generator

Generate Umbraco backoffice extension examples with mocked dev sessions.

1|Updated May 21, 2026
Search Tags:#typescript#umbraco#workspace context#backoffice extensions#dashboard manifests#lit elements#mocked backoffice
One-click install
npx skills add https://github.com/1k-off/umbraco-observability-playground --skill umbraco-example-generator-1k-off
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: umbraco-example-generator
Source: https://github.com/1k-off/umbraco-observability-playground/tree/main/.agents/skills/umbraco-example-generator
Command: npx skills add https://github.com/1k-off/umbraco-observability-playground --skill umbraco-example-generator-1k-off

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

It helps you quickly create complete, testable Umbraco backoffice extension examples and run them locally using Umbraco’s dev infrastructure, so you can validate UI and context behavior without building a full .NET backend.

Core Features & Use Cases

  • Create ready-to-run extensions: Generate dashboards, views, actions, and context tokens with minimal boilerplate so they appear in the Umbraco backoffice.
  • Run in mocked backoffice mode: Use Vite external extension loading to run examples with mocked APIs for fast iteration.
  • Validate with tests: Add unit tests and Playwright E2E tests against the mocked backoffice to ensure extension behavior stays correct.

Use case example: You want to demonstrate a “workspace feature toggle” extension in a workshop—generate the context, view, action, and footer app, then run it and verify it with automated tests.

Quick Start

Use the umbraco-example-generator skill to create an external Umbraco backoffice extension that exports a manifests array from index.ts and then run it locally in mocked backoffice mode.

Frequently Asked Questions about umbraco-example-generator

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

FAQPage Schema
How do I create Umbraco backoffice extensions without a .NET backend?▼

Umbraco backoffice extensions can be generated as ready-to-run dashboards, views, and actions with minimal boilerplate, then executed locally using mocked APIs and Vite external extension loading to validate UI and context behavior without a full backend.

What is a mocked backoffice session for Umbraco development?▼

A mocked backoffice session uses Vite external extension loading to run generated Umbraco extension examples with mocked APIs, enabling fast local iteration and validation of UI and state management without requiring a live server.

How do I set up an index.ts file to export Umbraco extension manifests?▼

To export Umbraco extension manifests, generate an index.ts file that exports a manifests array alongside compatible element and context modules, allowing the extensions to be hot-reloadable via the VITE_EXTERNAL_EXTENSION dev:external flow.

Can I test Umbraco dashboard extensions with Playwright?▼

Yes, you can add Playwright E2E tests against the mocked backoffice to ensure your generated Umbraco dashboard extensions behave correctly, alongside unit tests for validating individual UI and state management logic.

Does Umbraco example generation support workspace context patterns and Lit elements?▼

Yes, the generation process supports creating workspace context patterns, actions, and Lit elements for the Umbraco backoffice, producing compatible context tokens and views that integrate with the mocked dev infrastructure.

Do I need a full Umbraco environment to validate backoffice views and actions?▼

No, you do not need a full environment; you can generate and validate backoffice views, actions, and workspace context patterns locally using deterministic mocked backoffice sessions and Vite hot-reloading.

Related Skills

Explore More Software Engineering Skills→
diegoperinidiegoperini

Kubernetes Implementation: Sercan Next.js App

Automate Next.js TypeScript app deployment to Kubernetes using Skaffold with ConfigMaps, Deployments, and Services.

Community
Advanced
Alif-NAlif-N

create-tests

Generate Playwright E2E and Vitest unit tests for DaaS features and API routes.

Community
Advanced
markwang2658markwang2658
31

excalidraw

Generate Excalidraw diagrams from a JSON elements array and export as .excalidraw files.

Community
Intermediate
albanistalbanist
4

umbraco-extension-template

Scaffold new Umbraco backoffice extensions using the official .NET template.

Community
Intermediate