Umbraco Belle workshop London review


Well firstly a big thanks to all who attended the Umbraco Belle workshop in London on the 6th September. It was a really enjoyable day and I certainly learnt a lot!

My take homes from the day were:-

  • Unlimited coffee is a good idea
  • Never use find and replace when writing a technical 'code' based document
  • Always make sure the lapel mic's are ready to go before the speakers start talking!

But enough about my non-technical ramblings…I think (hope!) everyone took home with them more knowledge than they had when they arrived and also a working piece of code that they had created to demonstrate the new features in Umbraco 7.

I wanted the day to be as informative as possible and for people to have a hands-on experience with Umbraco Belle and the upcoming changes in Umbraco 7.

So, firstly a quick summary of the day:-

An introduction to AngularJS

First up, Peter Bacon Darwin, AngularJS guru and all round nice chap took, us through AngularJS, where it came from, why it exists and some great working examples.

As it happens, it turns out that our good friends at the Umbraco HQ have made a pretty good decision and backed the right JS Framework horse judging by the Google Search figures shown by Peter! 


Graph Angular JS

Uptake of AngularJS has grown phenomenally over the past few months which is great news. This means that learning and understanding the concepts behind AngularJS for Umbraco 7 will no doubt increase your skills as a developer and will hopefully be useful on other non-Umbraco projects as well.

Hello Umbraco Belle

Next up Per Ploug, Project Lead from the Umbraco HQ, took us through the specific concepts behind of Umbraco Belle, its use of AngularJS and how it is going to impact developers and editors lives.

How to create a property editor

After a quick coffee break it was back to Per who walked everyone through the creation of a property editor. One of the great features of Umbraco Belle is the fact that any developer, front-end or back-end, with a little bit of training will be able to customise the backend without the need for Visual Studio and C# knowledge. 

The Warren Buckley Show

It was now time to fire up the laptops and get everyone in the room as hands on as possible, so the next session after lunch was led by our very own Warren 'I've been using Umbarco since I was a twinkle in my mothers eye' Buckley.

We created a workbook for everyone to work through, which contained some hidden intentional(ish) spelling errors to make sure everyone was on their toes :)

The session took everyone through how to create a property editor, how to wire it up to a datatype and then how to extend the datatype to allow some variables to be set and values to be passed And all without the need to fire-up Visual Studio.

Feel free to download the session workbook and have a go yourself. It was so simple even I could follow it :)


Generally the day went pretty smoothly, no animals were hurt and no-one ended up in casualty. So all in all a great success.

Everyone left the room with a working Umbraco 7 property editor and a configurable datatype on their own laptop, which they could take away and use a reminder of how to complete the task in the future.

We even had some guys in the room who went a little further, one of which created a property editor that connected to the ISDB web service, which is awesome stuff.

You can find all the goodies from the day including some questionable quality videos on the Umbraco Belle Workshop site.

My Thoughts on Umbraco Belle / Umbraco 7

In a nutshell, it would seem that whilst there is no specific upgrade path from Umbraco V6 > V7, Per and the team have been doing some great work to make sure that, if you have a latest Umbraco 6 installation, and are using only standard datatypes, then Umbraco 7 should just work out-of-the-box.

Now I'm sure there are some 'huge' caveats, and that most installations have some form of customisation somewhere in there, but as far as a website front end user is concerned these should still function fine and the website will continue running.

It is only the Umbraco editor that is changing so whilst that specific datatype may not have been ported over from umbraco 6 to Umbraco 7, the editor should still function. The custom DataType will just be a readOnly control and will therefore not be editable, but it shouldn't just 'break' the interface.

This will at least leave you in a good place where all you would need to do is re-factpr any customisations one-by-one and convert to Umbraco 7 property editors.

Or at least this is my take on things…

On first impressions, and if you are new to Umbraco and not used to the current editor, it seems like a very simple and well structured way of extending the Umbraco editor, especially as there is no real need to use Visual Studio. This makes it a lot more accessible to designers and front-end devs who may or may not necesarily have Visual Studio and prefer to use something like Sublime Text.

Either way it looks like a great new interface and the improvements for the editing environment on different devices will be welcome by a lot of editors and a massive step forward in the Umbraco eco-system...