skills.rest
twofoldtech-dakota
twofoldtech-dakotaCOMMUNITY
Explore all skills by this author →
GitHub

umbraco-modern-guide

Guide developers in building Umbraco 14+ backoffice features with Lit components.

2|1|Updated Jan 10, 2026
Search Tags:#dashboard#content-delivery#umbraco#lit#backoffice#property-editor
One-click install
npx skills add https://github.com/twofoldtech-dakota/claude-marketplace --skill umbraco-modern-guide
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: umbraco-modern-guide
Source: https://github.com/twofoldtech-dakota/claude-marketplace/tree/main/plugins/umbraco-analyzer/skills/umbraco-modern-guide
Command: npx skills add https://github.com/twofoldtech-dakota/claude-marketplace --skill umbraco-modern-guide

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill helps developers adopt modern Umbraco 14+ backoffice development patterns, including Lit-based components, Content Delivery API usage, and modern package architecture, reducing the learning curve for new Umbraco projects.

Core Features & Use Cases

  • Backoffice Components: Examples of Lit-based property editors and dashboards that align with Umbraco 14+ architecture.
  • API & Caching: Guidance on integrating the Content Delivery API and HybridCache v15+ for responsive, scalable apps.
  • Package & Architecture: Best practices for packaging, module extension, and backoffice integration in Umbraco projects.
  • Use Case: Build a Lit-backed color editor and a analytics dashboard to demonstrate modern backoffice capabilities.

Quick Start

Open the skill to review the sample App_Plugins components and the accompanying TypeScript code illustrating a modern Umbraco 14+ setup.

Frequently Asked Questions about umbraco-modern-guide

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

FAQPage Schema
How do I build custom Umbraco 14+ backoffice property editors?▼

You build custom Umbraco 14+ property editors using Lit components to create interactive backoffice interfaces. This modern approach replaces legacy AngularJS patterns with native web components for scalable property editor development.

What is the best way to integrate the Content Delivery API in Umbraco 14+?▼

The best way to integrate the Content Delivery API in Umbraco 14+ involves pairing it with HybridCache v15+ for responsive, scalable apps. This combination ensures efficient content retrieval and modern caching patterns for headless delivery scenarios.

Do I need to know Lit to create Umbraco 14+ backoffice dashboards?▼

Yes, you need familiarity with Lit to create Umbraco 14+ backoffice dashboards. Modern Umbraco architecture relies on Lit components for building interactive dashboard interfaces and extending backoffice functionality.

How does modern Umbraco 14+ package architecture work?▼

Modern Umbraco 14+ package architecture works by utilizing App_Plugins components and TypeScript. It provides best practices for packaging, module extension, and backoffice integration, reducing the learning curve for new projects.

Can I use HybridCache v15+ with the Umbraco Content Delivery API?▼

Yes, you can use HybridCache v15+ with the Umbraco Content Delivery API. This integration provides responsive, scalable applications by combining modern content retrieval with efficient caching patterns for backoffice features.

What are the limitations of using Lit components in Umbraco 14+ backoffice development?▼

A key limitation is the requirement for familiarity with Umbraco 14+ architecture and Lit. Developers without experience in modern web components or the new backoffice APIs may face a steep learning curve when extending backoffice functionality.

Related Skills

Explore More Software Engineering Skills→
umbracoumbraco
26

umbraco-controllers

Create Umbraco backoffice controllers extending UmbControllerBase with lifecycle methods.

Official
Intermediate
umbracoumbraco
26

umbraco-umbraco-element

Implement Umbraco backoffice Web Components using UmbElementMixin and UmbLitElement.

Official
Intermediate
albanistalbanist
4

umbraco-search-provider

Integrate custom search providers into the Umbraco backoffice using TypeScript.

Community
Intermediate
umbracoumbraco
26

umbraco-property-value-preset

Implement property value presets for Umbraco backoffice property editors using TypeScript and official Umbraco APIs.

Official
Intermediate