Illustration showing Umbraco UI components in a book situated on a table. Surrounded by a coffe mug with the Umbraco logo, a pencil, laptop and a chair. background is dark with a window and a plant.

Bellissima: Preview releases of the new backoffice

Progress update on the journey to a new and improved Umbraco backoffice

Jacob Headshot Umbraco 500X500
Written by Jacob Overgaard

During the Codegarden Keynote, we announced the availability of the first preview of the new backoffice. We’re happy to announce the availability of the second preview, aptly named Preview 2, with some excellent additions, and extensive documentation. The previews are mainly targeted at package and extension developers wanting to get an early look at the new backoffice. However, anyone is of course welcome to install and try it out.

Overview:

 

To codename, or not to codename, that is the question… 

We’ve tried calling it “Future-proofing the backoffice”. Rather longwinded and has since turned into “the new backoffice” in day-to-day speak, which is not really all that useful either. There has been many new backoffice’s, and this one will only be new for a while. So here it is, the official codename for the project to update the backoffice to modern technology:

Bellissima 😘👌

Going forward, when we refer to Project Bellissima, it is referring to the project leading up to launch (currently targeting Umbraco 14). And Bellissima is also the codename for the frontend layer for the backoffice going forward (Umbraco.CMS.Backoffice on GitHub).

When we set out to build Umbraco 7, it also came with a whole new backoffice. The codename for that backoffice was “Belle”. This codename was kept through the overhaul in Umbraco 7.6, and Umbraco 8, and is still there in the latest release of Umbraco 12. You can expect the last version to carry this codename will be the backoffice of Umbraco 13.

Fun fact: the soundtrack for creating the Belle prototype for Umbraco 7, and later iterations, was the French jazz band Paris Combo. The lead singer was named Belle Du Berry; hence the Belle codename.

As the new backoffice is still heavily inspired by later iterations of Belle, we think it makes sense to keep the spirit and update it slightly. That’s how, with some help from some clever community members, we landed on “Bellissima”. Bellissima is the Italian term for “very beautiful”. This signifies that, although the current Backoffice is beautiful, the new backoffice will be even more beautiful. 

What is Project Bellissima?

In short, it is the work being done to ensure the backoffice in Umbraco is built on modern technology, easy to maintain and develop, and continuous to be the most extendable CMS around. 

For details, and a bit of history, you can dig into the accepted RFCs (request for comments) on the topic:

  1. Future-proofing the Umbraco Backoffice
  2. UI Component Library
  3. Define the Backoffice Extension API
  4. Implement the new backoffice

On the Product Roadmap you'll also find items for the project among all the other exciting things in the works.

Target release: Umbraco 14

The current target version for Bellissima is Umbraco 14. We have therefore chosen to base the Bellissima preview on the development branch of Umbraco 14. The Umbraco 14 preview is compatible with Umbraco 12 under the hood, but the backend ships with the Management API added and the old backoffice replaced in the assemblies. Be aware that more and more features meant for 12 and 13 will land in the previews, eventually, but might not be available in the preview releases immediately, and likewise, unstable features of Umbraco might be present in the preview release.

Available features

The preview release is mostly meant to get a feel for Bellissima. You will be able to work with the extension system and place new dashboards, sections, and property editors in there. You will also be able to create data types, document types and add new documents using either your property editors or the built-in property editors that have already been migrated.

.NET

It is currently based on the .NET 8 Preview 7, which you can download from Microsoft on the .NET website.

Management API

The Management API is enabled in the preview release. This API complements the Content Delivery API from Umbraco 12 with a set of controllers meant to create and manage content and other entities in Umbraco. It will eventually replace the older backoffice API and make it possible to authorize Umbraco objects from any system. Currently, only pre-approved apps can authenticate against the Management API including the new backoffice.

Extension API

There is a new exciting API available for package authors and extension developers of the Backoffice UI. The Extension API allows you to register extensions that will then be loaded in the UI to take advantage of the built-in services of Umbraco as well as any third-party controllers added to the Management API.

New Documentation space

You can find tutorials on our documentation space taking you through the journey of creating an extension to the Backoffice, and by extension of that to Umbraco itself:

Creating Your First Extension - learn the basics of building extensions for the Backoffice.

Creating a Custom Dashboard - learn how to create a dashboard welcoming your users to the Backoffice.

Creating a Property Editor - learn how to build a property editor that lets your users select or type values that will then be evaluated programmatically.

Bellissima makes extensive use of the Umbraco UI Library which you can also use to build your extensions and packages. Head over to uui.umbraco.com for documentation and examples of all the components.

Release Cadence

We are currently in the preview phase of the project, meaning that we are releasing previews of Umbraco 14 with Bellissima, which is targeted toward package authors.

Umbraco 14 with Bellissima is available through two channels on MyGet at the moment: Nightly and Prereleases.

The Nightly feed will get a new release once a day based on whatever is on the development branch of Umbraco 14 configured with Bellissima and Management API.

The Prerelease feed will get a release whenever we think there is something new and exciting for you to test out as the development of Bellissima proceeds.

Our Discord server is a good place for you to follow along with the releases and learn more about the releases immediately when they are available.

Preview Phase

The latest prerelease is versioned 14.0.0--preview002 and is available on MyGet now. To learn how to get ahold of the preview, please read this article on the Umbraco Documentation

Beta Phase

The beta phase will commence once we are feature complete with Bellissima and Umbraco 14. You can expect this phase to start well in advance of the release candidate phase giving you time to adapt to any breaking change.

Release Candidate Phase

The release candidate phase will follow our standard release cadence. We will enter this phase 6 weeks before the public release.

Public Release

The public release of Umbraco 14 is slated for May 2024.

Learn more about Bellissima

As the development of Bellissima proceeds, we are documenting our work on a new dedicated documentation space, where you can follow along and learn how to work with the new backoffice and how to migrate your extensions. There are already several excellent guides you can try out to extend the Backoffice. You can learn how to create your first basic extension for Bellissima by following this tutorial.

We will continue to provide updates here on the blog in the regular Product Updates when new preview releases, or new versions of the UI Library, are available. And when significant features or changes have been made, we will keep you updated in dedicated Bellissima blog posts detailing the progress.

Loved by developers, used by thousands around the world!

One of the biggest benefits of using Umbraco is that we have the friendliest Open Source community on this planet. A community that's incredibly pro-active, extremely talented and helpful.

If you get an idea for something you would like to build in Umbraco, chances are that someone has already built it. And if you have a question, are looking for documentation or need friendly advice, go ahead and ask on the community forums.

Want to be updated on everything Umbraco?

Sign up for the Umbraco newsletter and get the latest news and special offers sent directly to your inbox