My DF23 - The Dutch Umbraco Experience highlights

On Thursday, September 28, 2023, it was finally time again for DF23 - The Dutch Umbraco Experience at de Fabrique. It was a full program with many new sessions, but there were also some sessions that I had missed during Codegarden and was now fortunately able to attend. In this blog post, I will discuss some of my highlights again.

Introducing the Umbraco Commerce Storefront API

I am a big fan of headless and still happy that Umbraco 12 now also supports this with the Content Delivery API. With the release of Umbraco Commerce 12.1, it also supports headless with the Storefront API. To demonstrate how all these new APIs work, the Umbraco Headless Demo was built. During this session, Matt Brailsford showed how this site was built. It was very interesting to see how all the APIs could work together. I also liked that Next.js is used. You can now use Umbraco with the latest technologies, and that is really good news!

Me, myself and AI

This session had nothing to do with Umbraco but was fun to attend. A quiz was held via Kahoot! to test our knowledge of AI. I didn't know that AI had trouble showing fish because apparently, many pictures of fish online are held by fishermen. So AI thought fingers belonged to the fish. We also had to guess which photos were real and which were generated by AI. That turned out to be quite difficult. It was an interactive session, and my colleague Roy Berris even won!

Embrace, Don't Replace: The Umbraco Way

This was a very technical session with a lot of code and was mainly about how to make modifications in Umbraco. I found this session very interesting to see. Hiding properties can be very useful. Especially how you could replace internal services via a proxy can be very handy! I also encountered this problem during my experiment with virtual members.

Building a Strong Foundation for Your Modern .NET Project

My colleague Roy Berris also gave a presentation. He showed how to build a strong foundation for your Umbraco projects. In this way, the project can grow without problems. He showed things like compositions, code style, and devops. By applying these kinds of things, we at iO also build projects with a strong foundation.

Automate Umbraco package development

It used to be quite difficult to build and maintain packages for Umbraco. It involved a lot of work that was difficult to automate at the time. I had trouble with this myself with my own packages, but for Richard Soeteman, it was even more difficult because he had to maintain many more packages for many more versions of Umbraco. Nowadays, it is fortunately easier since Umbraco has switched to .NET (Core). With the help of Powershell scripts, Gitversion, and Azure DevOps, a lot can be automated. In this way, package development has become much better.

Mounting your UI in the New Backoffice

This was one of my favorite sessions! It explained step by step how to create a custom property editor for the new backoffice coming in Umbraco 14. There is now a clear separation between frontend work (Property Editor UI) and backend work (Property Editor Schema). Here is an overview of what is involved:

Propery Editor UI

  • JavaScript
  • User Interface (View)
  • Web Component
  • Editing Experience

Property Editor Schema

  • C#
  • Storage
  • Server Side Validation
  • Property Value Converter

Umbraco uses an extension first approach. So everything consists of extensions that you can use. There is also now the Context API. From this, you can really get all the info you need. For example, in which variant you are. Niels gave a demo of different credit cards and could show or not show a Danish credit card based on the current language. It is clear that the new backoffice is a great improvement, and it will be much easier to extend the backoffice in the future.

Web components in Umbraco: crash course

This session briefly explained how web components work. The demo showed different components in Umbraco. It was especially interesting to see how one web component uses Lit and another web component uses Svelte. These web components could indeed work together. Web components are an important part of the new backoffice in Umbraco 14, and it is good to see how powerful they are!

Umbraco closing keynote

In the closing keynote, Andy extensively showed what is coming in Umbraco 13 and 14. Umbraco 13 will be another LTS version and mainly focuses on stability. With Umbraco 14, the new backoffice is coming, and it is a great time to remove many legacy things. Umbraco Commerce and Umbraco Workflow are also being developed further, and Umbraco Cloud is also getting many features we have been waiting for, such as custom CI/CD and load balancing. Many of these things were also discussed during Codegarden, but it was nice to see again that many beautiful things are coming for Umbraco.

Conclusion

It was another fantastic day with many sessions that were really about Umbraco. I am especially very excited about the new backoffice. It will be even better to work and develop with Umbraco! I can't wait for Umbraco 14 to be released!