DEV Community

Kevin Jump
Kevin Jump

Posted on • Edited on

Battle scarred developer's guide to Umbraco v17 - Getting Started

#umbraco #umbracopackagedev

All the code for this series of posts is available in the DoStuffWithUmbraco Repository on GitHub

umbraco-extensions

If you are starting out on a new umbraco extension or package you will probably want to start with the umbraco-extension template that comes as part of the Umbraco templates.

So if you haven't already you will want the Umbraco templates

dotnet new install Umbraco.Templates@17.*
Enter fullscreen mode Exit fullscreen mode

and once you have these templates installed you 'could' just run the umbraco extension.

dotnet new umbraco-extension -n MySuperNewUmbracoPackage
Enter fullscreen mode Exit fullscreen mode

and this will crate you a new package to pay about with, but at this point you won't have an Umbraco site just an extension, so you will probably want to think about that.

Opinionated starter kit template.

if you actually want to have a site and a bit more structure around your development then you might want to consider @lottepitcher's Opinionated starter kit template, this adds stuff around the edges of the standard umbraco-extension, such as a test site, GitHub scripts and umbraco-marketplace files which will help when you come to release your super package.

You can install the templates for the Opinonated starter kit like so:

dotnet new install Umbraco.Community.Templates.PackageStarter
Enter fullscreen mode Exit fullscreen mode

you can then start a new project

dotnet new umbracopackagestarter -n MySuperPackage
Enter fullscreen mode Exit fullscreen mode

after this you get your extension and a test site, and scripts all nicely laid out for you.

Project Structure

For the DoStuffWithUmbraco repository that we are using as a reference for these blog posts you will notice there are a few slight differences with both the umbraco-extensions and the opinionated starter kit.

These changes are not major, and for the most part you can ignore them, but for information we have laid the project out like so.

+-- src
  +-- DoStuff
  +-- DoStuff.Client
  +-- DoStuff.Core
+-- demo
  +-- DoStuff.Website
Enter fullscreen mode Exit fullscreen mode

DoStuff.Client

Client contains all the "front end" code and API controllers for the extension to render inside Umbraco. There is no real 'business logic' inside this layer, it's the UI and the c# code required to get data to the UI.

DoStuff.Core

The core project contains the backend logic for the application - this is where services, repositories, data layers etc all live. we sperate this out from the client, because then well it's separate and we can in theory use the core logic of our code without the front end, or on a different front end should it ever change 😧

DoStuff

The parent to all of these projects is the 'DoStuff' library - no really this has no code it in, but it would be the library that became the NuGet package that people would install (if we made the library a package).

The "DoStuff" has dependencies on the .Client and .Core projects so when someone would install the "DoStuff" NuGet package that would also fetch the client and the core.

DoStuff.Website

Our website is off in a 'demo' folder, just so we can have it separate from our project. If this wasn't a reference library we would probably exclude the 'demo' folder from the source repository, then the site is independent of our package's code.

Top comments (0)