Skip to main content

First Steps with Umbraco 14

Probably the largest change coming in the Umbraco ecosystem is the development of a new backoffice, removing the dependency on the legacy angularjs and moving to a modern front-end stack based on web components and Typescript. Not just for HQ in the work needed to update the CMS itself and associated commercial products. But also for the community, whether that be package developers or custom solution implementors looking to extend the backoffice.

It reminds me a little of the time coming up to Umbraco 9, the first version running on modern .NET. There was a lot of collbarative effort and information sharing then, as many people were learning new technology and ways of doing things. I'm hoping the next nine months or so leading up to Umbraco 14 will be a similar experience.

Although I'm now working at HQ, I'm in a similar position to many in finding a lot of the change new and something I'm going to need to get up to speed with. Like, I suspect, a number of Umbraco developers, I'm more comfortable on the back-end. And whilst over the years I managed have picked up enough front-end to be at least somewhat useful; particularly when it comes to modern JavaScript, I'm a little behind the times.

Leading up to the .NET Core release, I put together a series of blog posts describing how I went about converting a small package to Umbraco 9. It was very much learning in public, with lots of false starts and things that got improved along the way.

This week, with the pre-release of Umbraco 14 preview 3, I thought it was time to start digging into it. And so again, I decided to blog as I go.

Please bear in mind that this isn't official documentation - which is coming along nicely - and at the various festivals, meet-ups and conferences coming up, you'll see and hear from many more more qualified people to advise on how to approach front-end package development and best practices with extending the new backoffice. But, as I say, I'm expecting there are many others in a similar place - new to the technology, not quite sure where to start and how to progress, and so hopefully there'll be some value in sharing as I go.

As last time, I'll work on a small package I keep updated with new Umbraco versions called Personalisation Groups. UI-wise it's not massive, but does have a reasonably involved property editor, so there should be enough to reflect something that's real-world, but not too complex in terms of it's specific functionality.

I'll keep this index page updated with links to the subsequent articles written after working on various bits, and you can find the source code here. At the time of writing, all work is in the feature/migrate-to-14 branch.

  1. Introduction
  2. Upgrading to Umbraco 14 Preview
  3. Creating a Property Editor With Umbraco 14
  4. Adding and Deleting Criteria